/*
 * Fiskal Jasno - stilovi komponenti (stranica i editor). Koncept „Jasno“: katalog s filtrima i popisom za upit.
 *
 * Boje i fontovi su iz aplikacije Fiskalna blagajna (Android app-v2) i backoffice v2: plava #0483B3, tamnoplava #02384D,
 * zlatna #E8B931, Inter za tekst, Roboto za gumbe, zaobljenja 14 px. Paleta je u theme.json; ovdje su samo tokeni koji iz
 * nje izlaze. Tamna tema, pozadina aplikacije i prekidač teme su u front.css (samo na stranici).
 * Klase s prefiksom fk- imaju uzorci; blokovima se dodaju kroz „Dodatne CSS klase“ (Napredno).
 */

:root {
	--fk-bg: var(--wp--preset--color--pozadina);
	--fk-bg-2: var(--wp--preset--color--pozadina-2);
	--fk-card: var(--wp--preset--color--kartica);
	--fk-card-on-alt: var(--wp--preset--color--kartica);
	--fk-field: var(--wp--preset--color--polje);
	--fk-line: var(--wp--preset--color--crta);
	--fk-line-2: var(--wp--preset--color--crta-jaca);
	--fk-text: var(--wp--preset--color--tekst);
	--fk-muted: var(--wp--preset--color--tekst-2);
	--fk-primary: var(--wp--preset--color--plava);
	--fk-primary-dark: var(--wp--preset--color--plava-tamna);
	--fk-primary-light: var(--wp--preset--color--plava-svijetla);
	--fk-tint: var(--wp--preset--color--plava-tint);
	--fk-link: var(--wp--preset--color--plava-tamna);
	--fk-gold: var(--wp--preset--color--zlatna);
	--fk-wholesale: var(--wp--preset--color--veleprodaja);
	--fk-ok: var(--wp--preset--color--uspjeh);
	--fk-tile: #f5f5f5;
	--fk-header-bg: rgb(255 255 255 / .86);
	--fk-shadow: 0 1px 2px rgb(23 23 23 / .05), 0 14px 34px rgb(23 23 23 / .08);
	--fk-font: var(--wp--preset--font-family--inter);
	--fk-btn-font: var(--wp--preset--font-family--roboto);
	--fk-mono: var(--wp--preset--font-family--roboto-mono);
	--fk-radius: 14px;
	--fk-radius-lg: 20px;
}

html { scroll-behavior: smooth; scroll-padding-top: 110px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before { transition: none !important; animation: none !important; } }
body { -webkit-text-size-adjust: 100%; font-feature-settings: "cv11", "ss01"; }
/* ništa ne smije pomicati stranicu vodoravno na mobitelu (clip, ne hidden, da zaglavlje ostane „ljepljivo“) */
html, body { overflow-x: clip; }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 2px solid var(--fk-primary); outline-offset: 3px; border-radius: 6px; }
h1, h2, h3 { text-wrap: balance; }
.fk-nowrap { white-space: nowrap; }

/* ---------- section scaffolding ---------- */
.fk-section { padding-block: clamp(3.5rem, 8vw, 5.5rem); border-top: 1px solid var(--fk-line); }
.fk-section--flush { border-top: 0; }
.fk-section--alt { background: var(--fk-bg-2); --fk-card: var(--fk-card-on-alt); }
.fk-head { margin-bottom: 2.25rem; }
.fk-head > * { max-width: 46rem; }
.fk-head > h2, .fk-head > h1 { max-width: 30ch; }
.fk-kicker { font-size: .8rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--fk-primary); }
.fk-lead { color: var(--fk-muted); font-size: 1.15rem; }
.fk-muted { color: var(--fk-muted); }
.fk-small { font-size: .875rem; color: var(--fk-muted); }
.fk-note { border: 1px dashed var(--fk-line-2); border-radius: 12px; padding: .9rem 1rem; color: var(--fk-muted); font-size: .9rem; }

/* grids built with plain groups: children lose the flow margins */
.fk-split, .fk-grid-2, .fk-grid-3, .fk-grid-4, .fk-plans, .fk-steps, .fk-cards, .fk-contact-cards { display: grid; gap: 1.25rem; }
.fk-split > *, .fk-grid-2 > *, .fk-grid-3 > *, .fk-grid-4 > *, .fk-plans > *, .fk-steps > *, .fk-contact-cards > * { margin-block: 0 !important; min-width: 0; }
.fk-split { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(2rem, 5vw, 3.5rem); align-items: center; }
.fk-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fk-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fk-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 960px) { .fk-split { grid-template-columns: 1fr; } .fk-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fk-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .fk-grid-2, .fk-grid-3, .fk-grid-4 { grid-template-columns: 1fr; } }

.fk-panel, .fk-outline { background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: 1.5rem; }
.fk-panel > :first-child, .fk-outline > :first-child { margin-top: 0; }

/* ---------- header ---------- */
.fk-util { border-bottom: 1px solid var(--fk-line); font-size: .85rem; color: var(--fk-muted); background: var(--fk-header-bg); }
.fk-util a { color: var(--fk-text); text-decoration: none; font-weight: 600; }
.fk-util a:hover { color: var(--fk-primary); }
.fk-util .fk-util__row { display: flex; gap: 1.1rem; align-items: center; flex-wrap: wrap; padding-block: .4rem; }
.fk-util .fk-util__row > * { margin: 0 !important; }
.fk-util .fk-util__push { margin-left: auto !important; }
.fk-util .fk-util__cta a { color: var(--fk-primary); }
.fk-util .fk-util__cta a:hover { color: var(--fk-primary-dark); }
@media (max-width: 640px) {
	.fk-util .fk-hide-sm { display: none; }
	/* mobitel: sve u jednom redu, centrirano; umjesto „Podrška i prodaja:“ ikona telefona */
	.fk-util .fk-util__row { justify-content: center; flex-wrap: nowrap; gap: .75rem; padding-block: .45rem; white-space: nowrap; font-size: .82rem; }
	.fk-util .fk-util__row > p:first-child { font-size: 0; }
	.fk-util .fk-util__row > p:first-child a { font-size: .82rem; display: inline-flex; align-items: center; gap: .35rem; }
	.fk-util .fk-util__row > p:first-child a::before { content: ""; width: 14px; height: 14px; flex: none; background: var(--fk-primary); -webkit-mask: var(--fk-ico-tel) center / contain no-repeat; mask: var(--fk-ico-tel) center / contain no-repeat; }
	.fk-util { --fk-ico-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E"); }
	.fk-util .fk-theme-toggle button { width: 26px; height: 24px; }
}
@media (max-width: 374px) {
	.fk-util .fk-util__row { gap: .5rem; }
	.fk-util .fk-theme-toggle button { width: 22px; }
	.fk-util .fk-theme-toggle svg { width: 14px; height: 14px; }
}

/* Zamagljenje je na ::before, ne na .fk-header - backdrop-filter na samom elementu bi "zarobio" svaki
   position:fixed unutar njega (npr. overlay mobilnog izbornika) u vlastitu kutiju umjesto cijelog ekrana. */
.fk-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--fk-line); }
.fk-header::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--fk-header-bg); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.admin-bar .fk-header { top: var(--wp-admin--admin-bar--height, 32px); }
.fk-header__row { display: flex; align-items: center; gap: 1.5rem; padding-block: .7rem; }
.fk-header__row > * { margin: 0 !important; }
.fk-logo img { width: 136px; height: auto; display: block; }
.fk-logo--dark { display: none; }
.fk-header .wp-block-navigation { flex: 1; }
.fk-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--fk-muted); padding: .45rem .7rem; border-radius: 10px; }
.fk-header .wp-block-navigation .wp-block-navigation-item__content:hover,
.fk-header .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { color: var(--fk-text); background: var(--fk-tint); }
.fk-header .wp-block-navigation__submenu-container { background: var(--fk-card) !important; color: var(--fk-text) !important; border: 1px solid var(--fk-line) !important; border-radius: var(--fk-radius); padding: .4rem !important; min-width: 240px !important; box-shadow: var(--fk-shadow); }
.fk-header .wp-block-navigation__submenu-container .wp-block-navigation-item__content { border-radius: 9px; }
.fk-header .wp-block-navigation__responsive-container-open, .fk-header .wp-block-navigation__responsive-container-close { color: var(--fk-text); }

/* mobilni izbornik: proziran, zamagljen, stavke lijevo s crtama; trenutna stranica se ovdje ne označava */
.fk-header .wp-block-navigation__responsive-container.is-menu-open {
	padding: 1rem 20px 2rem;
	background: color-mix(in srgb, var(--fk-bg) 80%, transparent) !important;
	-webkit-backdrop-filter: blur(20px) saturate(1.4); backdrop-filter: blur(20px) saturate(1.4);
	color: var(--fk-text) !important;
	animation: fk-menu-in .22s ease-out both;
}
@keyframes fk-menu-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
.fk-header .is-menu-open .wp-block-navigation__responsive-close { max-width: 520px; margin-inline: auto; }
.fk-header .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 3.75rem !important; align-items: stretch !important; }
.fk-header .is-menu-open .wp-block-navigation__container { width: 100%; padding: 0 !important; margin: 0 !important; gap: 0 !important; align-items: stretch !important; }
.fk-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item { width: 100%; align-items: stretch !important; border-bottom: 1px solid var(--fk-line); padding-block: .2rem; }
.fk-header .is-menu-open .wp-block-navigation-item__content { display: block; width: 100%; padding: .8rem 0 !important; font-size: 1.2rem; font-weight: 600; color: var(--fk-text) !important; background: none !important; border-radius: 0; }
.fk-header .is-menu-open .wp-block-navigation__submenu-container { width: 100%; border: 0 !important; border-left: 2px solid var(--fk-primary) !important; border-radius: 0; background: transparent !important; box-shadow: none; padding: 0 0 0 1rem !important; margin: -.15rem 0 .7rem !important; gap: 0 !important; min-width: 0 !important; }
.fk-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { padding: .5rem 0 !important; font-size: 1.02rem; font-weight: 500; color: var(--fk-muted) !important; }
.fk-header .is-menu-open .wp-block-navigation__submenu-icon { display: none; }
.fk-header .is-menu-open .wp-block-navigation-item__content:hover, .fk-header .is-menu-open .wp-block-navigation-item__content:active { color: var(--fk-primary) !important; }
.fk-header .is-menu-open .current-menu-item > .wp-block-navigation-item__content, .fk-header .is-menu-open [aria-current] { font-weight: inherit; }
.fk-header .is-menu-open .wp-block-navigation__container > .wp-block-navigation-item > .wp-block-navigation-item__content { font-weight: 600; }
.fk-header .is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content { font-weight: 500 !important; }
.fk-header .is-menu-open .wp-block-navigation-item__content:focus { outline: none; }
.fk-header .is-menu-open .wp-block-navigation-item__content:focus-visible { outline: none; color: var(--fk-primary) !important; text-decoration: underline; text-underline-offset: 4px; }
.fk-header .wp-block-navigation__responsive-container-close { top: 1rem !important; right: 20px !important; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; border: 1px solid var(--fk-line); background: var(--fk-card) !important; }
.fk-header .wp-block-navigation__responsive-container-close svg { width: 20px; height: 20px; }
@media (prefers-reduced-motion: reduce) { .fk-header .wp-block-navigation__responsive-container.is-menu-open { animation: none; } }
.fk-header .wp-block-buttons { flex: none; }
.fk-header .wp-block-button__link { padding: .75rem 1rem; font-size: .85rem; }
@media (max-width: 1100px) { .fk-header .wp-block-navigation { flex: 0 0 auto; order: 3; } .fk-header .wp-block-buttons { margin-left: auto !important; } }
@media (max-width: 420px) { .fk-header .wp-block-buttons { display: none; } .fk-header .wp-block-navigation { margin-left: auto !important; } }

/* theme switch (light / device / dark) */
.fk-theme-toggle { display: inline-flex; gap: 2px; padding: 2px; border-radius: 10px; background: var(--fk-field); }
.fk-theme-toggle button { width: 30px; height: 26px; border: 0; border-radius: 8px; background: transparent; color: var(--fk-muted); display: grid; place-items: center; cursor: pointer; padding: 0; }
.fk-theme-toggle button:hover { color: var(--fk-text); }
.fk-theme-toggle button[aria-pressed="true"] { background: var(--fk-card); color: var(--fk-text); box-shadow: 0 1px 2px rgb(0 0 0 / .14); }
.fk-theme-toggle svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- hero ---------- */
.fk-hero { position: relative; padding-block: clamp(2.5rem, 7vw, 5rem) clamp(3rem, 8vw, 5.5rem); }
.fk-hero h1 { margin-top: 1rem; }
.fk-hero h1 strong, .fk-accent { color: var(--fk-primary); font-weight: inherit; }
/* Uvod stranice i popis odmah ispod njega (Paketi, Uređaji, Aplikacije) su jedna cjelina, bez dvostrukog razmaka. */
.fk-hero:has(+ .fk-section--flush) { padding-bottom: clamp(2rem, 4vw, 3rem); }
.fk-hero + .fk-section--flush { margin-block-start: 0; padding-top: 0; }

.fk-countdown { display: flex; gap: 1.1rem; align-items: center; flex-wrap: wrap; margin-top: 2rem; }
.fk-countdown__n { font: 700 3.4rem/1 var(--fk-font); letter-spacing: -.04em; font-variant-numeric: tabular-nums; color: var(--fk-text); }
.fk-countdown__t { color: var(--fk-muted); font-size: .95rem; line-height: 1.4; }
.fk-countdown__t b { color: var(--fk-text); font-weight: 600; }

/* the two documents: paper objects, light in both themes */
.fk-docs { position: relative; min-height: 580px; }
.fk-doc-label { font: 600 .7rem/1 var(--fk-font); letter-spacing: .08em; text-transform: uppercase; color: var(--fk-muted); margin-bottom: 8px; display: flex; gap: 8px; align-items: center; }
.fk-doc-label i { width: 7px; height: 7px; border-radius: 50%; background: var(--fk-primary); }
.fk-receipt-wrap { position: absolute; left: 0; top: 290px; width: 62%; transform: rotate(-2deg); }
.fk-shot-wrap { top: 0; width: 46%; transform: rotate(-2deg); z-index: 1; }
.fk-shot-img { display: block; width: 100%; height: auto; border-radius: 22px; border: 1px solid var(--fk-line); box-shadow: 0 24px 48px rgb(0 0 0 / .22); }
.fk-docs:has(.fk-shot-wrap) { min-height: 600px; }
.fk-docs:has(.fk-shot-wrap) .fk-eracun-wrap { top: 60px; right: 0; left: auto; width: 46%; transform: rotate(2deg); z-index: 2; }
@media (max-width: 560px) { .fk-shot-wrap { width: 64%; } }
.fk-receipt { background: #fff; color: #171717; font: 400 .74rem/1.55 var(--fk-mono); padding: 18px 16px 26px; box-shadow: 0 24px 48px rgb(0 0 0 / .22);
	-webkit-mask: conic-gradient(from 135deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat;
	mask: conic-gradient(from 135deg at bottom, #0000, #000 1deg 89deg, #0000 90deg) bottom / 12px 7px repeat-x, linear-gradient(#000 0 0) top / 100% calc(100% - 7px) no-repeat; }
.fk-receipt .c { text-align: center; }
.fk-receipt .b { font-weight: 500; }
.fk-receipt hr { border: 0; border-top: 1px dashed #a1a1a1; margin: 8px 0; }
.fk-receipt .row { display: flex; justify-content: space-between; gap: 8px; }
.fk-receipt .tot { font-size: .9rem; font-weight: 500; }
.fk-receipt .id { color: #525252; overflow-wrap: anywhere; }
.fk-receipt .qr { width: 64px; height: 64px; margin: 10px auto 0; opacity: .85; background:
	conic-gradient(from 90deg at 30% 30%, #171717 25%, transparent 0) 0 0 / 12px 12px,
	linear-gradient(#171717 0 0) 0 0 / 22px 22px no-repeat,
	linear-gradient(#171717 0 0) 100% 0 / 22px 22px no-repeat,
	linear-gradient(#171717 0 0) 0 100% / 22px 22px no-repeat; }
.fk-eracun-wrap { position: absolute; right: 0; top: 0; width: 62%; transform: rotate(2deg); }
.fk-eracun { background: #fff; color: #171717; border-radius: var(--fk-radius); padding: 18px 18px 16px; box-shadow: 0 24px 56px rgb(0 0 0 / .24); font-size: .82rem; display: grid; gap: 12px; }
.fk-eracun .top { display: flex; justify-content: space-between; align-items: start; gap: 6px 10px; flex-wrap: wrap; }
.fk-eracun .top b { font-weight: 700; font-size: 1rem; letter-spacing: -.01em; white-space: nowrap; }
.fk-eracun .tag { font: 500 .62rem/1 var(--fk-mono); background: #e0f0f6; color: #02384d; padding: 5px 6px; border-radius: 4px; white-space: nowrap; }
.fk-eracun dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; }
.fk-eracun dt { color: #525252; }
.fk-eracun dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.fk-eracun dd.big { font-weight: 700; font-size: 1.05rem; }
.fk-track { list-style: none; margin: 0; padding: 10px 0 0; border-top: 1px solid #e5e5e5; display: grid; gap: 7px; }
.fk-track li { display: grid; grid-template-columns: 14px 1fr auto; gap: 8px; align-items: center; }
.fk-track li::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #34c759; box-shadow: 0 0 0 3px rgb(52 199 89 / .2); }
.fk-track li.wait { color: #525252; }
.fk-track li.wait::before { background: #fff; border: 2px solid #c8c8c8; box-shadow: none; }
.fk-track time { font: 400 .72rem var(--fk-mono); color: #525252; }
.fk-eracun-solo { max-width: 420px; margin-inline: auto; transform: rotate(1.5deg); }
@media (max-width: 560px) {
	.fk-docs { min-height: 0; display: grid; gap: 22px; }
	.fk-receipt-wrap, .fk-eracun-wrap { position: static; width: auto; }
	.fk-receipt-wrap { width: 86%; justify-self: start; transform: rotate(-2deg); }
	.fk-eracun-wrap { width: 92%; justify-self: end; transform: rotate(1.5deg); }
}

/* ---------- timeline ---------- */
.fk-tl { position: relative; max-width: 54rem; }
.fk-tl::before { content: ""; position: absolute; left: 148px; top: 10px; bottom: 10px; width: 2px; background: var(--fk-line); }
.fk-tl > .fk-tl__item { margin-block: 0 !important; }
.fk-tl__item { position: relative; display: grid; grid-template-columns: 130px 1fr; column-gap: 46px; padding-block: 1.1rem; }
.fk-tl__item > * { margin-block: 0 !important; }
.fk-tl__item > :not(.fk-tl__date) { grid-column: 2; }
.fk-tl__item > :not(.fk-tl__date) + * { margin-top: .4rem !important; }
.fk-tl__item::before { content: ""; position: absolute; left: 141px; top: calc(1.1rem + 4px); width: 14px; height: 14px; border-radius: 50%; background: var(--fk-bg); border: 2px solid var(--fk-line-2); z-index: 1; box-sizing: border-box; }
.fk-tl__item.is-past::before { background: var(--fk-line-2); }
.fk-tl__item.is-key::before { border-color: var(--fk-primary); background: var(--fk-primary); box-shadow: 0 0 0 6px rgb(4 131 179 / .18); }
.fk-tl__date { grid-column: 1; grid-row: 1 / span 3; text-align: right; font-size: .9rem; font-weight: 600; line-height: 1.4; color: var(--fk-muted); white-space: nowrap; padding-top: 2px; font-variant-numeric: tabular-nums; }
.fk-tl__item.is-key .fk-tl__date { color: var(--fk-primary); }
.fk-tl__item h3 { margin: 0; }
.fk-tl__item p { color: var(--fk-muted); }
.fk-tl__item.is-today { padding-block: .4rem; }
.fk-tl__item.is-today::before { width: 10px; height: 10px; left: 143px; top: calc(.4rem + 6px); border: 0; background: var(--fk-ok); }
.fk-tl__item.is-today .fk-tl__date, .fk-tl__item.is-today p { color: #1f9d48; font-size: .88rem; font-weight: 600; }
.fk-fx { font-size: .93rem; color: var(--fk-text) !important; background: var(--fk-tint); border-radius: 12px; padding: 10px 12px; }
.fk-fx strong { color: var(--fk-primary); font-weight: 600; }
@media (max-width: 560px) {
	.fk-tl::before { left: 7px; }
	.fk-tl__item { grid-template-columns: 1fr; padding-left: 30px; }
	.fk-tl__item > :not(.fk-tl__date) { grid-column: 1; }
	.fk-tl__date { grid-row: auto; text-align: left; padding: 0 0 4px; }
	.fk-tl__item::before { left: 0; }
	.fk-tl__item.is-today::before { left: 2px; }
}

/* ---------- steps ---------- */
.fk-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); counter-reset: fkstep; }
.fk-step { background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: 1.5rem; counter-increment: fkstep; }
.fk-step::before { content: counter(fkstep); display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: linear-gradient(180deg, #0483b3, #02384d); color: #fff; font-weight: 700; margin-bottom: .9rem; }
.fk-step > * { margin-block: 0 !important; }
.fk-step > * + * { margin-top: .6rem !important; }
.fk-step p { color: var(--fk-muted); font-size: .97rem; }
@media (max-width: 860px) { .fk-steps { grid-template-columns: 1fr; } }

/* ---------- catalogue: filters, cards, chips, „Dodaj u upit“ ---------- */
.fk-filters { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.fk-filters button { font: 500 .9rem/1 var(--fk-font); padding: .65rem .95rem; border-radius: 999px; border: 1px solid var(--fk-line); background: var(--fk-card); color: var(--fk-text); cursor: pointer; }
.fk-filters button:hover { border-color: var(--fk-line-2); }
.fk-filters button[aria-pressed="true"] { background: var(--fk-text); color: var(--fk-bg); border-color: var(--fk-text); }
.fk-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
/* Kartice imaju puno sadržaja (slika, naslov, opis, oznake, cijena, gumb) - jedan stupac na svemu ispod
   "malog desktopa", ne samo na uskom mobitelu, inače je u dva stupca pretijesno za čitanje. Ovo mora stajati
   IZA osnovnog pravila gore (isti CSS specificitet - tko je kasnije u datoteci, taj pobjeđuje). */
@media (max-width: 820px) { .fk-cards { grid-template-columns: 1fr; } }
.fk-card { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); overflow: hidden; transition: box-shadow .15s, transform .15s, border-color .15s; }
.fk-card:hover { box-shadow: var(--fk-shadow); transform: translateY(-2px); }
.fk-card[hidden] { display: none; }
.fk-card__photo { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--fk-tile); }
.fk-card__photo img { position: absolute; inset: 0; margin: auto; width: 80%; height: 80%; max-width: none; object-fit: contain; }
.fk-card__badge, .fk-badge { display: inline-block; font-size: .74rem; font-weight: 700; padding: 5px 9px; border-radius: 999px; background: #fff; color: #02384d; box-shadow: 0 1px 2px rgb(0 0 0 / .12); }
.fk-card__badge { position: absolute; left: 12px; top: 12px; }
.fk-card__body { display: flex; flex-direction: column; gap: .7rem; padding: 1.1rem 1.15rem 1.15rem; }
.fk-card__title { margin: 0; font-size: 1.18rem; font-weight: 700; line-height: 1.25; letter-spacing: -.015em; }
.fk-card__title a { color: var(--fk-text); text-decoration: none; }
.fk-card__title a:hover { color: var(--fk-primary); }
.fk-card__desc { margin: 0; color: var(--fk-muted); font-size: .93rem; line-height: 1.5; }
.fk-chips { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; }
.fk-chips li { font-size: .78rem; font-weight: 500; background: var(--fk-tint); color: var(--fk-primary-dark); padding: 4px 9px; border-radius: 8px; }
/* Cijena iznad gumba, gumb cijelom širinom: isto u svakoj kartici i na svakoj širini, i za dugu cijenu („Uključen u svaku licencu“). */
.fk-card__foot { display: grid; gap: .75rem; padding-top: .85rem; margin-top: auto; border-top: 1px solid var(--fk-line); align-self: stretch; }
.fk-card__price { font-weight: 700; font-size: 1.1rem; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.fk-card__price:empty { display: none; }
/* mjesečni najam kompleta: redak na kartici i okvir na stranici proizvoda */
.fk-card__rent { margin-top: -.45rem; font-size: .88rem; color: var(--fk-muted); text-decoration: none; }
.fk-card__rent b { color: var(--fk-primary); font-weight: 700; white-space: nowrap; }
.fk-card__rent:hover b { text-decoration: underline; }
/* zadano: kupnja je glavna cijena; uz filtar „Najam“ (.fk-rent-mode na omotaču kartica) obrnuto */
.fk-card__price--rent, .fk-card__rent--buy, .fk-card__foot .fk-add--rent { display: none; }
.fk-rent-mode .fk-card__foot:has(.fk-card__price--rent) > .fk-card__price:not(.fk-card__price--rent),
.fk-rent-mode .fk-card__rent:not(.fk-card__rent--buy),
.fk-rent-mode .fk-card__foot .fk-add--buy { display: none; }
.fk-rent-mode .fk-card__price--rent { display: inline; }
.fk-rent-mode .fk-card__rent--buy { display: inline; }
.fk-rent-mode .fk-card__foot .fk-add--rent { display: inline-block; }
.fk-rent-mode .fk-card__rent--buy b { color: var(--fk-text); }
.fk-rent { margin-top: 1.5rem !important; padding: 1.25rem 1.4rem; border: 1px solid var(--fk-line); border-left: 4px solid var(--fk-primary); border-radius: var(--fk-radius-lg); background: var(--fk-tint); scroll-margin-top: 110px; }
.fk-rent > * { margin: 0 !important; }
.fk-rent__kicker { font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fk-primary); }
.fk-rent__price { margin-top: .35rem !important; font-size: 1.15rem; }
.fk-rent__price b { font-size: 1.9rem; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fk-rent__price small { color: var(--fk-muted); font-size: .95rem; font-weight: 500; }
.fk-rent .fk-price-gross { margin-top: .1rem !important; }
.fk-rent__list { list-style: none; padding: 0; margin-top: .9rem !important; display: grid; gap: .4rem; }
.fk-rent__list li { position: relative; padding-left: 1.6rem; line-height: 1.45; }
.fk-rent__list li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--fk-primary); font-weight: 800; }
.fk-rent__setup { margin-top: .9rem !important; padding-top: .8rem; border-top: 1px solid var(--fk-line); font-weight: 600; font-size: .95rem; }
.fk-rent__note { margin-top: .4rem !important; font-size: .9rem; color: var(--fk-muted); }
.fk-rent .fk-add { margin-top: 1rem !important; }

/* Complianz: banner za kolačiće u bojama teme (i u tamnom načinu) */
.cmplz-cookiebanner.cmplz-cookiebanner {
	--cmplz_banner_background_color: var(--fk-card);
	--cmplz_banner_border_color: var(--fk-line);
	--cmplz_banner_border_radius: 16px;
	--cmplz_text_color: var(--fk-text);
	--cmplz_hyperlink_color: var(--fk-primary);
	--cmplz_button_accept_background_color: var(--fk-primary);
	--cmplz_button_accept_border_color: var(--fk-primary);
	--cmplz_button_accept_text_color: #fff;
	--cmplz_button_deny_background_color: transparent;
	--cmplz_button_deny_border_color: var(--fk-line);
	--cmplz_button_deny_text_color: var(--fk-text);
	--cmplz_button_settings_background_color: transparent;
	--cmplz_button_settings_border_color: var(--fk-line);
	--cmplz_button_settings_text_color: var(--fk-text);
	--cmplz_button_border_radius: 10px;
	--cmplz_slider_active_color: var(--fk-primary);
	font-family: var(--fk-font);
	box-shadow: 0 20px 50px rgb(0 0 0 / .18);
}
.cmplz-cookiebanner .cmplz-btn { font-family: var(--fk-btn-font, var(--fk-font)); font-weight: 600; letter-spacing: .02em; }
.cmplz-cookiebanner .cmplz-title { font-weight: 700; }
@media (max-width: 640px) { .cmplz-cookiebanner.cmplz-cookiebanner { --cmplz_banner_margin: 10px; } }

/* naslovnica: kratkotrajni najam za evente */
.fk-event { background: linear-gradient(180deg, transparent, var(--fk-tint) 55%, transparent); }
.fk-event .wp-block-buttons { margin-top: 1.75rem !important; gap: .75rem; }
.fk-event__stage { position: relative; aspect-ratio: 1 / .85; border-radius: 28px; background: radial-gradient(circle at 60% 40%, var(--fk-card), var(--fk-tint) 70%); border: 1px solid var(--fk-line); display: grid; place-items: center; overflow: hidden; }
.fk-event__stage img { width: 68%; height: auto; filter: drop-shadow(0 26px 34px rgb(2 56 77 / .22)); transform: rotate(-6deg); }
.fk-event__tag { position: absolute; left: 18px; top: 18px; padding: .45rem .85rem; border-radius: 999px; background: var(--fk-gold); color: #171717; font-size: .8rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
@media (max-width: 960px) { .fk-event .fk-split > :last-child { order: -1; } .fk-event__stage { max-width: 520px; } }
.fk-card__foot .fk-add { width: 100%; }
.fk-add { font: 500 .85rem/1 var(--fk-btn-font); letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; padding: .7rem .95rem; border-radius: 12px; border: 1.5px solid var(--fk-primary); background: transparent; color: var(--fk-primary); cursor: pointer; transition: background .15s, color .15s; }
.fk-add:hover { background: var(--fk-tint); }
.fk-add[aria-pressed="true"] { background: var(--fk-primary); color: #fff; }
.fk-add--sm { padding: .6rem .8rem; font-size: .78rem; }
.fk-add--lg { padding: .95rem 1.3rem; font-size: .95rem; border-radius: var(--fk-radius); }
.wp-block-button.fk-add { border: 0; padding: 0; background: none; }
.wp-block-button.fk-add .wp-block-button__link { background: transparent; color: var(--fk-primary); border: 1.5px solid var(--fk-primary); }
.wp-block-button.fk-add .wp-block-button__link:hover { background: var(--fk-tint); }
.wp-block-button.fk-add[aria-pressed="true"] .wp-block-button__link { background: var(--fk-primary); color: #fff; }

/* ---------- product page ---------- */
.fk-back { font-size: .9rem; }
.fk-back a { color: var(--fk-muted); text-decoration: none; }
.fk-back a:hover { color: var(--fk-text); }
.fk-product__photo { position: relative; background: var(--fk-tile); border-radius: 24px; aspect-ratio: 1 / .85; margin: 0; overflow: hidden; }
.fk-product__photo img { position: absolute; inset: 0; margin: auto; width: 84% !important; height: 84% !important; max-width: none; object-fit: contain !important; }
.fk-product .wp-block-post-excerpt { color: var(--fk-muted); font-size: 1.15rem; }
.fk-product .wp-block-post-excerpt__excerpt { margin: 0; }
.fk-price-box { display: grid; gap: .2rem; }
.fk-price { font-weight: 700; font-size: 2rem; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fk-price-gross { color: var(--fk-muted); font-size: .9rem; font-variant-numeric: tabular-nums; }
.fk-includes { list-style: none; padding: 0; display: grid; gap: .55rem; }
.fk-includes li { position: relative; padding-left: 1.9rem; }
.fk-includes li::before { content: ""; position: absolute; left: 0; top: .2rem; width: 18px; height: 18px; border-radius: 50%; background: var(--fk-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.3l2.4 2.4L13 6.2' fill='none' stroke='%230483b3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat; }

/* ---------- tables ---------- */
.wp-block-table { overflow-x: auto; }
.wp-block-table table { border-collapse: collapse; width: 100%; font-size: .95rem; }
.wp-block-table th, .wp-block-table td { border: 0; border-bottom: 1px solid var(--fk-line); padding: .75rem .9rem; text-align: left; vertical-align: top; }
.wp-block-table thead { border: 0; }
.wp-block-table thead th { font-size: .74rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--fk-muted); border-bottom: 1px solid var(--fk-line-2); }
.wp-block-table tbody tr:last-child td { border-bottom: 0; }
.fk-specs td:first-child { color: var(--fk-muted); width: 38%; }
.fk-compare table { min-width: 720px; }
.fk-compare td, .fk-compare th { white-space: nowrap; }
.fk-table-panel { background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: .4rem .6rem; }

/* ---------- licence plans ---------- */
.fk-period { display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--fk-radius); background: var(--fk-field); margin-bottom: 1.25rem; }
.fk-period button { font: 500 .85rem/1 var(--fk-btn-font); letter-spacing: .04em; text-transform: uppercase; border: 0; background: transparent; color: var(--fk-muted); padding: .7rem 1rem; border-radius: 11px; cursor: pointer; }
.fk-period button[aria-pressed="true"] { background: var(--fk-primary); color: #fff; }
.fk-plans { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); align-items: stretch; }
.fk-plan { position: relative; background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: 1.6rem 1.5rem; display: flex; flex-direction: column; }
.fk-plan > * { margin-block: 0 !important; }
.fk-plan > * + * { margin-top: .8rem !important; }
.fk-plan.is-featured { border: 2px solid var(--fk-primary); }
.fk-plan__flag { position: absolute; top: -12px; left: 1.4rem; margin: 0 !important; background: var(--fk-gold); color: #171717; font-size: .75rem; font-weight: 700; padding: 5px 10px; border-radius: 999px; }
.fk-plan__for { color: var(--fk-muted); font-size: .93rem; margin-top: .2rem !important; }
.fk-plan__price { font-weight: 700; font-size: 2.1rem; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.fk-plan__price { text-align: center; }
.fk-plan__flag + * { margin-top: 0 !important; }
.fk-plan__for { min-height: 2.9em; }
.fk-plan .wp-block-buttons { justify-content: center; }
.fk-tile-card .fk-plan__price { margin-block: .4rem .6rem !important; font-size: 1.7rem; line-height: 1.2; color: var(--fk-text); }
.fk-tile-card .fk-plan__price.fk-na { font-size: 1.05rem; font-weight: 600; color: var(--fk-muted); }
.fk-plan.is-featured { padding-top: calc(1.6rem + 1px); }
.fk-plan__price small, .fk-plan__price em { font-size: .9rem; font-weight: 500; color: var(--fk-muted); font-style: normal; letter-spacing: 0; }
.fk-plan__price.fk-na { font-size: 1.05rem; font-weight: 600; line-height: 2.1; color: var(--fk-muted); letter-spacing: 0; }
.fk-plan ul { padding-left: 1.1rem; color: var(--fk-muted); font-size: .95rem; display: grid; gap: .3rem; }
.fk-plan .wp-block-buttons { margin-top: auto !important; padding-top: 1rem; }
html:not([data-period="mj"]) .fk-mj, html[data-period="mj"] .fk-god { display: none !important; }
/* mjesečno = samo licenca za aplikaciju (napomenu i oznaku umeće theme.js) */
.fk-period-note-wrap { margin-top: -.5rem !important; margin-bottom: 1.75rem !important; }
.fk-period-note { max-width: 760px; margin: 0 !important; padding: .85rem 1.1rem; border-radius: var(--fk-radius); border: 1px solid var(--fk-line); border-left: 4px solid var(--fk-gold); background: var(--fk-card); font-size: .95rem; line-height: 1.5; }
.fk-plan__only { display: block; margin-top: .3rem; font-size: .8rem; font-weight: 600; letter-spacing: 0; color: var(--fk-muted); }

/* ---------- readiness check ---------- */
.fk-check { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 2rem; align-items: start; }
.fk-check fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: .6rem; min-width: 0; }
.fk-check legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.fk-opt { display: grid; grid-template-columns: 26px 1fr; gap: .9rem; align-items: start; background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius); padding: 1rem 1.1rem; cursor: pointer; transition: border-color .15s, background .15s; }
.fk-opt:hover { border-color: var(--fk-line-2); }
.fk-opt input { appearance: none; -webkit-appearance: none; width: 22px; height: 22px; margin: 1px 0 0; border: 2px solid var(--fk-line-2); border-radius: 6px; display: grid; place-items: center; cursor: pointer; background: transparent; }
.fk-opt input:checked { background: var(--fk-primary); border-color: var(--fk-primary); }
.fk-opt input:checked::after { content: ""; width: 10px; height: 6px; border: solid #fff; border-width: 0 0 2.5px 2.5px; transform: translateY(-1px) rotate(-45deg); }
.fk-opt:has(input:checked) { border-color: var(--fk-primary-light); background: var(--fk-tint); }
.fk-opt b { display: block; font-weight: 600; }
.fk-opt span span { color: var(--fk-muted); font-size: .93rem; }
.fk-result { position: sticky; top: 120px; background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: 1.6rem; display: grid; gap: 1rem; box-shadow: var(--fk-shadow); }
.fk-meter { height: 10px; border-radius: 999px; background: var(--fk-field); overflow: hidden; }
.fk-meter i { display: block; height: 100%; width: 40%; border-radius: inherit; background: var(--fk-primary); transition: width .3s; }
.fk-score { font-weight: 700; font-size: 2.6rem; line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.fk-score small { font-size: 1rem; color: var(--fk-muted); }
.fk-result h3 { margin: 0; }
.fk-result p, .fk-result ul { color: var(--fk-muted); font-size: .95rem; margin: 0; }
.fk-result ul { padding-left: 1.1rem; display: grid; gap: 4px; }
.fk-btn { display: inline-flex; justify-content: center; align-items: center; font: 500 .95rem/1 var(--fk-btn-font); letter-spacing: .04em; text-transform: uppercase; padding: .95rem 1.3rem; border-radius: var(--fk-radius); background: var(--fk-primary); color: #fff !important; text-decoration: none; }
.fk-btn:hover { background: var(--fk-primary-dark); }
@media (max-width: 860px) { .fk-check { grid-template-columns: 1fr; } .fk-result { position: static; } }

/* ---------- lists, small cards ---------- */
.fk-arrows { list-style: none; padding: 0; display: grid; gap: .75rem; }
.fk-arrows li { position: relative; padding-left: 1.7rem; color: var(--fk-muted); }
.fk-arrows li::before { content: "→"; position: absolute; left: 0; top: 0; color: var(--fk-primary); }
.fk-arrows strong { color: var(--fk-text); font-weight: 600; }
.fk-tile-card { background: var(--fk-card); border: 1px solid var(--fk-line); border-radius: var(--fk-radius-lg); padding: 1.4rem; }
.fk-tile-card > * { margin-block: 0 !important; }
.fk-tile-card > * + * { margin-top: .6rem !important; }
.fk-tile-card p { color: var(--fk-muted); font-size: .95rem; }
.fk-tile-card a { font-weight: 600; text-decoration: none; color: var(--fk-link); }
.fk-tile-card a:hover { color: var(--fk-primary); }
.fk-partner-logo img { height: 28px; width: auto; display: block; }
.fk-bo-shot img { border-radius: var(--fk-radius); }

/* ---------- phone frame ---------- */
.fk-phone { position: relative; width: min(280px, 70%); margin-inline: auto; aspect-ratio: 9 / 19; border-radius: 34px; background: #171717; padding: 9px; box-shadow: 0 30px 60px rgb(0 0 0 / .28); }
.fk-phone img { width: 100%; height: 100%; object-fit: cover; border-radius: 26px; display: block; }
.fk-phone video { width: 100%; height: 100%; object-fit: cover; border-radius: 26px; display: block; background: #000; }
.fk-phone video::-webkit-media-controls,
.fk-phone video::-webkit-media-controls-start-playback-button,
.fk-phone video::-webkit-media-controls-panel { display: none !important; -webkit-appearance: none; }
figure.fk-phone, .fk-phone figure { margin-block: 0; }
/* svijetli/tamni zaslon aplikacije, isti okvir: drugi se slaže preko prvog. Prekidač je svoj (fk-shot-toggle),
   neovisan o temi cijele stranice. */
.fk-phone .fk-appshot { position: absolute; inset: 9px; margin: 0; }
.fk-phone .fk-appshot--dark { display: none; }
.fk-phone[data-shot="dark"] .fk-appshot--light { display: none; }
.fk-phone[data-shot="dark"] .fk-appshot--dark { display: block; }
.fk-shot-toggle { position: absolute; z-index: 3; left: 50%; bottom: -18px; transform: translateX(-50%); display: flex; gap: 2px; background: var(--fk-card); border-radius: 999px; padding: 3px; box-shadow: var(--fk-shadow); }
.fk-shot-toggle button { width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 50%; background: none; color: var(--fk-muted); font-size: 1rem; line-height: 1; cursor: pointer; }
.fk-shot-toggle button[aria-pressed="true"] { background: var(--fk-primary); color: #fff; }

/* ---------- FAQ ---------- */
.wp-block-details { border-bottom: 1px solid var(--fk-line); padding-block: 1.1rem; }
.wp-block-details summary { cursor: pointer; list-style: none; font-weight: 600; font-size: 1.06rem; display: flex; justify-content: space-between; gap: 1rem; }
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; color: var(--fk-primary); font-size: 1.4rem; line-height: 1; font-weight: 400; flex: none; }
.wp-block-details[open] summary::after { content: "−"; }
.wp-block-details > :not(summary) { color: var(--fk-muted); margin-top: .75rem; }
.fk-faq { max-width: 52rem; }

/* ---------- call to action: the app's brand tile (gradient + circle) ---------- */
.fk-cta { border-top: 0; }
.fk-cta__row { position: relative; overflow: hidden; isolation: isolate; display: flex; justify-content: space-between; align-items: center; gap: 1.75rem; flex-wrap: wrap; padding: clamp(1.75rem, 4vw, 2.75rem); border-radius: var(--fk-radius-lg); background: linear-gradient(180deg, #0483b3 0%, #02384d 100%); color: #fff; }
.fk-cta__row::after { content: ""; position: absolute; z-index: -1; width: 260px; height: 260px; border-radius: 50%; background: rgb(255 255 255 / .1); top: -66px; right: -58px; }
.fk-cta__row > * { margin: 0 !important; }
.fk-cta h2, .fk-cta p { color: #fff; }
.fk-cta p { opacity: .9; }
.fk-cta .wp-block-button__link { background: #fff; color: #02384d; }
.fk-cta .wp-block-button__link:hover { background: #e0f0f6; color: #02384d; }
.fk-cta .is-style-outline .wp-block-button__link { background: transparent; color: #fff; border-color: rgb(255 255 255 / .55); }
.fk-cta .is-style-outline .wp-block-button__link:hover { background: rgb(255 255 255 / .1); color: #fff; }

/* ---------- contact ---------- */
.fk-contact-cards { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.fk-contact-cards .fk-tile-card a { font-weight: 700; font-size: 1.12rem; }
.wpcf7 form { display: grid; gap: .85rem; }
.wpcf7 label { display: grid; gap: .35rem; font-weight: 600; font-size: .92rem; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea, .wpcf7 select {
	font: 400 1rem var(--fk-font); width: 100%; padding: .7rem .9rem; color: var(--fk-text); background: var(--fk-bg); border: 1.5px solid var(--fk-line-2); border-radius: 12px; box-sizing: border-box; }
.wpcf7 input:focus, .wpcf7 textarea:focus { border-color: var(--fk-primary); outline: none; }
.wpcf7 textarea { min-height: 100px; resize: vertical; }
/* Ime+Telefon i Tvrtka+E-mail u paru, da obrazac ne bude puno viši od stupca s kontakt podacima. */
.wpcf7 .fk-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .85rem; }
.wpcf7 input[type="submit"] { font: 500 .95rem/1 var(--fk-btn-font); letter-spacing: .04em; text-transform: uppercase; padding: .95rem 1.4rem; border-radius: var(--fk-radius); border: 0; background: var(--fk-primary); color: #fff; cursor: pointer; justify-self: start; }
.wpcf7 input[type="submit"]:hover { background: var(--fk-primary-dark); }
.wpcf7 .wpcf7-response-output { margin: 0 !important; border-radius: 12px; }
.wpcf7 .wpcf7-acceptance .wpcf7-list-item { display: block; margin: 0; }
.wpcf7 .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: .6rem; font-weight: 400; line-height: 1.5; }
.wpcf7 .wpcf7-acceptance input { flex: none; width: 1.1rem; height: 1.1rem; margin: .2rem 0 0; accent-color: var(--fk-primary); }

/* ---------- posts (Novosti) ---------- */
.fk-posts .wp-block-post { border-bottom: 1px solid var(--fk-line); padding-block: 1.4rem; margin: 0 !important; }
.fk-posts .wp-block-post-title { font-size: 1.3rem; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; margin: .3rem 0 .5rem; }
.fk-posts .wp-block-post-title a { color: var(--fk-text); text-decoration: none; }
.fk-posts .wp-block-post-title a:hover { color: var(--fk-primary); }
.fk-posts .wp-block-post-date, .fk-article .wp-block-post-date { font-size: .82rem; font-weight: 600; color: var(--fk-muted); }
.fk-posts .wp-block-post-excerpt { color: var(--fk-muted); }
.fk-article { max-width: 46rem; }

/* ---------- footer ---------- */
.fk-footer { border-top: 1px solid var(--fk-line); padding-block: 3.5rem 2.5rem; color: var(--fk-muted); font-size: .92rem; background: var(--fk-bg-2); }
.fk-footer__cols { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); gap: 2rem; }
.fk-footer__cols > * { margin: 0 !important; min-width: 0; }
.fk-footer h2 { font-size: .95rem; font-weight: 600; letter-spacing: 0; color: var(--fk-text); margin: 0 0 .8rem; }
.fk-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.fk-footer a { color: var(--fk-muted); text-decoration: none; }
.fk-footer a:hover { color: var(--fk-text); }
.fk-footer .fk-logo img { width: 132px; }
.fk-footer__company > * { margin: 0 !important; }
.fk-footer__company > * + * { margin-top: .3rem !important; }
.fk-footer__legal { margin-top: 2.5rem !important; padding-top: 1.25rem; border-top: 1px solid var(--fk-line); display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; font-size: .85rem; }
.fk-footer__legal > * { margin: 0 !important; }
/* tablet i mobitel: podaci o tvrtki na vrhu, sve centrirano */
@media (max-width: 860px) {
	.fk-footer { padding-block: 2.75rem 2rem; }
	.fk-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.75rem 1rem; text-align: center; }
	.fk-footer__company { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; padding-bottom: 1.75rem; border-bottom: 1px solid #333; }
	.fk-footer__company .fk-logo { margin-bottom: .5rem !important; }
	.fk-footer__legal { flex-direction: column; align-items: center; text-align: center; gap: .35rem; margin-top: 2rem !important; }
}
@media (max-width: 480px) {
	.fk-footer__cols { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
	.fk-footer ul { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem 1.1rem; }
}

/* ---------- page intro (default page template) ---------- */
.fk-page-intro { padding-block: clamp(2.5rem, 6vw, 4rem) 1.5rem; }
.fk-page-content { padding-bottom: clamp(3rem, 7vw, 5rem); }

/* ===================== koncept „Jasno“ ===================== */

/* header: popis za upit */
.fk-quote-btn { display: inline-flex; align-items: center; gap: .55rem; font: 500 .85rem/1 var(--fk-btn-font); letter-spacing: .04em; text-transform: uppercase; padding: .75rem 1rem; border-radius: var(--fk-radius); background: var(--fk-primary); color: #fff !important; text-decoration: none; white-space: nowrap; }
.fk-quote-btn:hover { background: var(--fk-primary-dark); }
.fk-quote-count { display: inline-grid; place-items: center; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; background: #fff; color: #02384d; font-size: .78rem; font-weight: 700; letter-spacing: 0; }
.fk-quote-count[hidden] { display: none; }
.fk-header .wp-block-html { margin: 0 !important; }
@media (max-width: 1100px) { .fk-header .fk-quote-wrap, .fk-header__row > .fk-quote-btn { margin-left: auto !important; } .fk-header__row > .wp-block-navigation { margin-left: 0 !important; } }
@media (max-width: 640px) { .fk-header__row { gap: .9rem; } }

/* tray at the bottom while the quote list has items */
.fk-tray { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 60; display: flex; align-items: center; gap: 1rem; max-width: calc(100% - 32px); width: max-content; padding: 10px 10px 10px 18px; border-radius: 16px; background: #171717; color: #fff; box-shadow: 0 16px 40px rgb(0 0 0 / .3); transform: translate(-50%, 140%); opacity: 0; visibility: hidden; transition: transform .25s, opacity .25s, visibility .25s; }
.fk-tray.is-shown { transform: translate(-50%, 0); opacity: 1; visibility: visible; }
.fk-tray__what { font-size: .92rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fk-tray .fk-btn { padding: .75rem 1rem; font-size: .82rem; flex: none; }

/* hero: product on a tile, with floating info cards */
.fk-stage { position: relative; aspect-ratio: 1 / .9; border-radius: 28px; background: var(--fk-tint); display: grid; place-items: center; margin: 0; }
.fk-stage img { width: 74% !important; height: auto; filter: drop-shadow(0 30px 40px rgb(2 56 77 / .2)); }
.fk-stage figure { margin: 0; display: grid; place-items: center; width: 100%; height: 100%; }
.fk-chipcard { position: absolute; z-index: 2; display: grid; gap: 2px; background: #fff; color: #171717; border-radius: var(--fk-radius); padding: 12px 14px; box-shadow: 0 12px 30px rgb(2 56 77 / .16); font-size: .86rem; }
.fk-chipcard b { font-weight: 700; font-variant-numeric: tabular-nums; }
.fk-chipcard .ok { color: #1f9d48; font-weight: 600; }
.fk-chipcard.one { left: -18px; bottom: 16%; }
.fk-chipcard.two { right: -10px; top: 12%; }
@media (max-width: 960px) { .fk-chipcard.one { left: 10px; } .fk-chipcard.two { right: 10px; } }
.fk-anchor-price { color: var(--fk-muted); font-size: .97rem; }
.fk-anchor-price strong { color: var(--fk-text); }

/* hero: ulazak teksta (stagger) i plutajuće kartice */
@keyframes fk-fade-up { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fk-fade-scale { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@keyframes fk-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
.fk-hero .fk-kicker { animation: fk-fade-up .6s ease both; }
.fk-hero h1 { animation: fk-fade-up .6s ease .08s both; }
.fk-hero .fk-lead { animation: fk-fade-up .6s ease .16s both; }
.fk-hero .wp-block-buttons { animation: fk-fade-up .6s ease .24s both; }
.fk-hero .fk-anchor-price { animation: fk-fade-up .6s ease .32s both; }

/* radno vrijeme prodaje, kartica u kontakt dijelu naslovnice (.fk-hours__state puni theme.js: „sada otvoreno“ / „sada zatvoreno“) */
.fk-hours { display: flex; align-items: center; gap: .45rem; }
.fk-hours__ico { width: 1.1em; height: 1.1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fk-hours__state:empty { display: none; }
.fk-hours__state { display: inline-flex; align-items: center; gap: .4rem; font-size: .85em; font-weight: 600; color: var(--fk-muted); }
.fk-hours__state::before { content: ""; width: .55rem; height: .55rem; border-radius: 50%; background: currentColor; }
.fk-hours__state.is-open { color: #1f9d55; }
.fk-hours__state.is-open::before { box-shadow: 0 0 0 3px rgb(31 157 85 / .2); animation: fk-hours-pulse 2s ease-in-out infinite; }
@keyframes fk-hours-pulse { 50% { box-shadow: 0 0 0 6px rgb(31 157 85 / 0); } }
@media (prefers-reduced-motion: reduce) { .fk-hours__state.is-open::before { animation: none; } }
.fk-hours--card { flex-wrap: wrap; font-weight: 700; font-size: 1.12rem; }
.fk-hours--card .fk-hours__ico { color: var(--fk-primary); }
.fk-hours--card .fk-hours__state { flex-basis: 100%; }
.fk-stage img { animation: fk-fade-scale .7s ease .15s both; }
.fk-chipcard { animation: fk-fade-up .5s ease both, fk-float 5s ease-in-out infinite; }
.fk-chipcard.two { animation-delay: .4s, .9s; }
.fk-chipcard.one { animation-delay: .55s, 1.05s; }

/* proof strip */
.fk-proof { border-block: 1px solid var(--fk-line); }
.fk-proof__row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fk-proof__row > * { margin: 0 !important; display: flex; gap: 12px; align-items: center; padding: 1.3rem 1.2rem; font-size: .95rem; color: var(--fk-muted); line-height: 1.35; }
.fk-proof__row > * + * { border-left: 1px solid var(--fk-line); }
.fk-proof__row strong { display: block; color: var(--fk-text); font-weight: 600; }
.fk-proof svg, .fk-feat svg { width: 22px; height: 22px; flex: none; fill: none; stroke: var(--fk-primary); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 900px) { .fk-proof__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fk-proof__row > :nth-child(3) { border-left: 0; } .fk-proof__row > :nth-child(n+3) { border-top: 1px solid var(--fk-line); } }
@media (max-width: 480px) { .fk-proof__row > * { padding: 1rem .75rem; font-size: .88rem; } }

/* features with icon tiles */
.fk-feats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.6rem 2rem; }
.fk-feats > * { margin: 0 !important; }
.fk-feat { display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: start; }
.fk-feat .fk-ico { width: 44px; height: 44px; border-radius: 12px; background: var(--fk-card); border: 1px solid var(--fk-line); display: grid; place-items: center; }
/* Naslov u visini ikone, opis ispod njega. Razmak bloka (block gap) ne smije spustiti tekst ispod ikone. */
.fk-feat > * { margin: 0 !important; }
.fk-feat h3 { margin: 0 0 4px; min-height: 44px; font-size: 1.05rem; font-weight: 600; letter-spacing: 0; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.fk-feat p { margin: 0; color: var(--fk-muted); font-size: .95rem; }
.fk-new { font-size: .66rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; background: var(--fk-gold); color: #171717; padding: 4px 6px; border-radius: 6px; }
@media (max-width: 760px) { .fk-feats { grid-template-columns: 1fr; } }

/* back office band: the app's brand tile, full width */
.fk-band { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, #0483b3 0%, #02384d 100%); color: #fff; border-top: 0; }
.fk-band::after { content: ""; position: absolute; z-index: -1; width: 420px; height: 420px; border-radius: 50%; background: rgb(255 255 255 / .08); top: -140px; right: -90px; }
.fk-band h2, .fk-band h3, .fk-band p, .fk-band li { color: #fff; }
.fk-band .fk-kicker { color: #c7e5f1; }
.fk-band .fk-lead, .fk-band p { color: rgb(255 255 255 / .85); }
.fk-band .fk-arrows li { color: rgb(255 255 255 / .9); }
.fk-band .fk-arrows li::before { color: #c7e5f1; }
.fk-band .fk-arrows strong { color: #fff; }
.fk-band .wp-block-button__link { background: #fff; color: #02384d; }
.fk-band .wp-block-button__link:hover { background: #e0f0f6; color: #02384d; }
.fk-band .is-style-outline .wp-block-button__link { background: transparent; color: #fff; border-color: rgb(255 255 255 / .55); }
.fk-band .fk-bo-shot img { box-shadow: 0 30px 60px rgb(0 0 0 / .35); }

/* FAQ: title left, questions right */
.fk-faq-split { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 3rem; }
.fk-faq-split > * { margin: 0 !important; min-width: 0; }
@media (max-width: 900px) { .fk-faq-split { grid-template-columns: 1fr; gap: 1rem; } }

/* contact with the quote list */
.fk-quote-items { display: flex; flex-wrap: wrap; gap: 6px; min-height: 30px; margin-bottom: .5rem; }
.fk-quote-items em { color: var(--fk-muted); font-size: .92rem; }
.fk-quote-chip { display: inline-flex; align-items: center; gap: 4px; background: var(--fk-tint); color: var(--fk-primary-dark); font-size: .88rem; font-weight: 500; padding: 5px 6px 5px 11px; border-radius: 999px; }
.fk-quote-chip button { border: 0; background: transparent; color: inherit; font-size: 1.1rem; line-height: 1; width: 22px; height: 22px; border-radius: 50%; cursor: pointer; }
.fk-quote-chip button:hover { background: rgb(4 131 179 / .15); }

/* footer: always dark (app token „Card fill dark“ #171717) */
.fk-footer { background: #171717; color: #a1a1a1; border-top: 0; }
.fk-footer h2 { color: #fff; }
.fk-footer a { color: #a1a1a1 !important; }
.fk-footer a:hover { color: #fff !important; }
.fk-footer__legal { border-top-color: #333; }

/* app screenshots in phone frames */
.fk-shots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.25rem; }
.fk-shots > * { margin: 0 !important; min-width: 0; }
.fk-shot .fk-phone { width: 100%; border-radius: 26px; padding: 6px; }
.fk-shot .fk-phone img { border-radius: 21px; }
.fk-shot__cap { margin: .75rem 0 0 !important; text-align: center; font-size: .9rem; font-weight: 600; color: var(--fk-text); }
@media (max-width: 1000px) { .fk-shots { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .fk-shots { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* product page (Jasno) */
.fk-product__info > * + * { margin-top: 1rem; }
.fk-product__info .fk-badge { box-shadow: none; background: var(--fk-tint); color: var(--fk-primary-dark); }
.fk-actions { gap: .75rem; align-items: center; }
.fk-actions > * { margin: 0 !important; }

/* hero: dva zaslona aplikacije */
.fk-docs:has(.fk-shot-wrap) { min-height: 600px; isolation: isolate; }
.fk-docs:has(.fk-shot-wrap)::before { content: ""; position: absolute; inset: 4% -4% 0 -4%; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, rgb(3 130 180 / .20), rgb(3 130 180 / 0)); filter: blur(10px); animation: fk-glow 7s ease-in-out infinite alternate; }
.fk-shot-wrap { --r: -3deg; top: 10px; left: 2%; width: 49%; transform: rotate(var(--r)); z-index: 1; animation: fk-in .9s cubic-bezier(.2,.7,.2,1) both, fk-float 6s ease-in-out 1s infinite; }
.fk-docs:has(.fk-shot-wrap) .fk-eracun-wrap.fk-shot-wrap--b { --r: 3deg; top: 70px; left: auto; right: 0; width: 49%; z-index: 2; animation: fk-in .9s cubic-bezier(.2,.7,.2,1) .25s both, fk-float 7s ease-in-out 1.4s infinite reverse; }
.fk-shot-img { border-radius: 26px; border: 1px solid var(--fk-line); box-shadow: 0 30px 60px rgb(0 0 0 / .26), 0 6px 14px rgb(0 0 0 / .12); transition: transform .35s ease, box-shadow .35s ease; }
.fk-shot-wrap:hover { z-index: 3; }
.fk-shot-wrap:hover .fk-shot-img { transform: translateY(-6px) scale(1.03); box-shadow: 0 38px 70px rgb(0 0 0 / .32), 0 8px 18px rgb(0 0 0 / .14); }
@keyframes fk-in { from { opacity: 0; transform: translateY(34px) rotate(var(--r)) scale(.96); } to { opacity: 1; transform: translateY(0) rotate(var(--r)) scale(1); } }
@keyframes fk-float { 0%, 100% { transform: translateY(0) rotate(var(--r)); } 50% { transform: translateY(-9px) rotate(var(--r)); } }
@keyframes fk-glow { from { opacity: .6; transform: scale(.96); } to { opacity: 1; transform: scale(1.04); } }
/* mobitel: dva zaslona jedan pored drugog, bez preklapanja natpisa */
@media (max-width: 560px) {
	.fk-docs:has(.fk-shot-wrap) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; min-height: 0; }
	.fk-shot-wrap, .fk-docs:has(.fk-shot-wrap) .fk-eracun-wrap.fk-shot-wrap--b { position: relative; width: auto; left: 0; right: 0; top: 0; margin: 0; }
	.fk-docs:has(.fk-shot-wrap) .fk-eracun-wrap.fk-shot-wrap--b { margin-top: 28px; }
	.fk-shot-img { border-radius: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.fk-shot-wrap, .fk-docs:has(.fk-shot-wrap) .fk-eracun-wrap.fk-shot-wrap--b, .fk-docs:has(.fk-shot-wrap)::before { animation: none !important; }
}
/* vijest: sidrene cijene */
.fk-news { background: linear-gradient(180deg, transparent, var(--fk-tint) 50%, transparent); }
.fk-news__badge { display: inline-block; background: var(--fk-gold); color: #171717; font-weight: 700; letter-spacing: .06em; padding: 3px 9px; border-radius: 999px; margin-right: .5rem; }
.fk-news__shot { position: relative; max-width: 300px; margin-inline: auto; isolation: isolate; --r: 2.5deg; animation: fk-in .9s cubic-bezier(.2,.7,.2,1) both, fk-float 7s ease-in-out 1s infinite; }
.fk-news__shot::before { content: ""; position: absolute; inset: 6% -14% 0; z-index: -1; border-radius: 50%; background: radial-gradient(closest-side, rgb(242 169 0 / .22), rgb(242 169 0 / 0)); }
.fk-news__shot .fk-shot-img { display: block; width: 100%; height: auto; }
@media (prefers-reduced-motion: reduce) { .fk-news__shot { animation: none; transform: rotate(2.5deg); } }
/* animirani koraci e-računa */
.fk-eslide { width: min(300px, 80%); margin-inline: auto; display: grid; gap: 14px; justify-items: center; }
.fk-eslide__phone { position: relative; width: 100%; aspect-ratio: 640 / 1264; border-radius: 34px; background: #171717; padding: 8px; box-shadow: 0 30px 60px rgb(0 0 0 / .28), 0 6px 14px rgb(0 0 0 / .14); }
.fk-eslide__screen { position: relative; width: 100%; height: 100%; border-radius: 27px; overflow: hidden; background: #fff; }
.fk-eslide__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.02); transition: opacity .5s ease, transform .6s ease; border-radius: 0; }
.fk-eslide__img.is-active { opacity: 1; transform: scale(1); }
.fk-eslide__tap { position: absolute; width: 54px; height: 54px; margin: -27px 0 0 -27px; border-radius: 50%; pointer-events: none; opacity: 0; background: rgb(3 130 180 / .32); border: 2px solid rgb(3 130 180 / .85); box-shadow: 0 0 0 0 rgb(3 130 180 / .35); z-index: 2; }
.fk-eslide__tap.is-tap { animation: fk-tap .9s ease-out both; }
@keyframes fk-tap { 0% { opacity: 0; transform: scale(1.6); } 20% { opacity: 1; transform: scale(1); } 55% { opacity: 1; transform: scale(.82); box-shadow: 0 0 0 0 rgb(3 130 180 / .35); } 100% { opacity: 0; transform: scale(1.1); box-shadow: 0 0 0 22px rgb(3 130 180 / 0); } }
.fk-eslide__cap { min-height: 3.2em; text-align: center; font-size: .95rem; line-height: 1.4; color: var(--fk-text); display: flex; align-items: flex-start; justify-content: center; gap: .5rem; max-width: 30ch; }
.fk-eslide__cap b { flex: none; display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--fk-primary); color: #fff; font-size: .85rem; }
.fk-eslide__dots { display: flex; gap: 8px; }
.fk-eslide__dots button { width: 10px; height: 10px; padding: 0; border: 0; border-radius: 999px; background: var(--fk-line); cursor: pointer; transition: width .3s ease, background .3s ease; }
.fk-eslide__dots button[aria-current="true"] { width: 26px; background: var(--fk-primary); }
.fk-eslide__dots button:focus-visible { outline: 2px solid var(--fk-primary); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .fk-eslide__img { transition: none; } .fk-eslide__tap { display: none; } }
.fk-band .fk-eslide__dots button { background: rgb(255 255 255 / .45); }
.fk-band .fk-eslide__dots button[aria-current="true"] { background: var(--fk-gold); }
.fk-band .fk-eslide__cap b { background: var(--fk-gold); color: #171717; }
.fk-eslide { width: min(340px, 86%); }

.fk-eslide__dots .fk-eslide__pause { width: auto; height: 22px; margin-left: 6px; padding: 0 8px; border-radius: 999px; background: transparent; color: inherit; font-size: 9px; line-height: 22px; letter-spacing: .08em; border: 1px solid currentColor; opacity: .7; }
.fk-eslide__dots .fk-eslide__pause:hover { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .fk-eslide__img { transition: opacity .2s linear; transform: none; } }

/* eslide: mobilni razmaci */
@media (max-width: 960px) {
	.fk-band .fk-split { gap: 3rem; }
	.fk-eslide { width: min(300px, 78%); gap: 20px; padding-block: .5rem 0; }
	.fk-eslide__cap { min-height: 3.6em; padding-inline: .5rem; font-size: 1rem; }
	.fk-eslide__dots { gap: 12px; align-items: center; padding-block: .25rem; }
	.fk-eslide__dots button:not(.fk-eslide__pause) { width: 12px; height: 12px; }
	.fk-eslide__dots button[aria-current="true"] { width: 30px; }
}
@media (max-width: 560px) {
	.fk-band.fk-section { padding-inline: 1.25rem; padding-block: 3.5rem; }
	.fk-band .fk-split { gap: 3.25rem; }
	.fk-band .fk-head { margin-bottom: 1.25rem; }
	.fk-band .fk-lead { margin-block: 1rem 1.5rem; }
	.fk-band .fk-arrows { display: grid; gap: 1rem; }
	.fk-band .fk-small { margin-top: 1.5rem; }
}

/* mobitel: manji okomiti razmaci između sekcija (traka e-računa zadržava svoje) */
@media (max-width: 640px) {
	.fk-section { padding-block: 2.75rem; }
	.fk-hero { padding-block: 2rem 2.75rem; }
	.fk-section.fk-cta { padding-block: 1.25rem 2.75rem; }
	.fk-page-intro { padding-block: 2rem 1rem; }
	/* tablice koje se pomiču vodoravno: sjena na rubu pokazuje da ima još stupaca */
	.fk-table-panel {
		background:
			linear-gradient(to right, var(--fk-card) 30%, transparent) left / 40px 100% no-repeat local,
			linear-gradient(to left, var(--fk-card) 30%, transparent) right / 40px 100% no-repeat local,
			radial-gradient(farthest-side at 0 50%, rgb(0 0 0 / .16), transparent) left / 14px 100% no-repeat scroll,
			radial-gradient(farthest-side at 100% 50%, rgb(0 0 0 / .16), transparent) right / 14px 100% no-repeat scroll,
			var(--fk-card);
	}
}