/* ÚčtoFin, site.css. Skladá ho tools/build.py zo súborov styles/*.css v abecednom poradí; upravuj moduly, nie web/assets/site.css.
   Redizajn 2026-10-05: písmo Inter, tokeny podľa tools/zadania/dizajn-system.md. Mobile first od 360 px, bez @import. */

/* ===== 0. Písmo Inter (OFL, assets/fonty) ===== */
@font-face { font-family: "Inter"; font-weight: 400; font-display: swap; src: url("/assets/fonty/inter-latin-400.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-weight: 400; font-display: swap; src: url("/assets/fonty/inter-latin-ext-400.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; font-weight: 500; font-display: swap; src: url("/assets/fonty/inter-latin-500.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-weight: 500; font-display: swap; src: url("/assets/fonty/inter-latin-ext-500.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Inter"; font-weight: 600; font-display: swap; src: url("/assets/fonty/inter-latin-600.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-weight: 600; font-display: swap; src: url("/assets/fonty/inter-latin-ext-600.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* náhradné písmo s metrikami Inter: rovnaké zalomenie riadkov počas načítania (CLS) */
@font-face { font-family: "Inter fallback"; src: local("Arial"); size-adjust: 107.4%; ascent-override: 90.2%; descent-override: 22.48%; line-gap-override: 0%; }

/* ===== 1. Tokeny (dizajn-system.md 2.8) ===== */
:root {
  /* farby ÚčtoFin: bez zmeny */
  --ink: #16181D;
  --muted: #5C6270;
  --canvas: #EEF0F3;
  --soft: #F7F8FA;
  --soft-2: #F3F4F6;
  --card: #FFFFFF;
  --line: #E4E6EB;
  --btn-line-light: #D8DCE2;
  --accent: #FFD21E;
  --accent-hover: #FFDB4D;
  --accent-soft: #FFF7D1;
  --gold: #8A6D00;
  --dark-2: #2B2F38;
  --dark-muted: #B6BAC4;
  --dark-muted-2: #9AA0AC;
  --dark-soft: #D8DBE2;
  --ok: #17784E;
  --ok-soft: #E3F4EC;
  --warn: #B45309;
  --warn-soft: #FDF1E6;
  --err: #C0262D;
  --err-soft: #FBE2E3;
  /* písmo a typografia */
  --font: "Inter", "Inter fallback", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --fw-display: 500;
  --fw-strong: 600;
  --fs-h1: clamp(2.375rem, 1.2rem + 4.2vw, 4.125rem);
  --fs-h1-sub: clamp(2.125rem, 1.35rem + 2.9vw, 3.25rem);
  --fs-h2: clamp(2rem, 1.25rem + 2.9vw, 3.375rem);
  --fs-h3: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
  --fs-h4: 1.125rem;
  --fs-lead: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --fs-text: 1rem;
  --fs-small: 0.875rem;
  --fs-micro: 0.8125rem;
  --fs-label: 0.75rem;
  --ls-h1: -0.04em;
  --ls-h2: -0.035em;
  --ls-h3: -0.025em;
  --ls-h4: -0.015em;
  --ls-text: -0.011em;
  --ls-label: 0.08em;
  --lh-h1: 1.05;
  --lh-h2: 1.1;
  --lh-h3: 1.25;
  --lh-text: 1.55;
  /* tvary a tiene (tieň len plávajúce prvky) */
  --r-xs: 8px;
  --r-s: 14px;
  --r-card: 24px;
  --r-tile: 32px;
  --r-panel: clamp(28px, 4vw, 48px);
  --r-pill: 999px;
  --sh-1: 0 1px 2px rgba(22, 24, 29, 0.04), 0 8px 24px rgba(22, 24, 29, 0.06);
  --sh-2: 0 1px 2px rgba(22, 24, 29, 0.05), 0 18px 48px rgba(22, 24, 29, 0.12);
  --sh-3: 0 24px 60px rgba(22, 24, 29, 0.28);
  /* rozloženie */
  --content: 1120px;
  --gutter: calc(var(--edge) + var(--pad));
  --edge: 8px;
  --panel-max: 1280px;
  --pad: 20px;
  --sec-y: clamp(4rem, 2.5rem + 6vw, 7.5rem);
  --panel-y: clamp(3rem, 2rem + 5vw, 6rem);
  --panel-gap: clamp(16px, 2vw, 24px);
  --head-gap: clamp(2rem, 1.5rem + 2vw, 3.5rem);
  --gap: clamp(12px, 1.6vw, 20px);
  --header-h: 76px;
  /* pohyb */
  --ease: cubic-bezier(0.4, 0, 0.6, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --t-1: 0.2s;
  --t-2: 0.3s;
  --t-3: 0.4s;
  --t-4: 0.6s;
  /* zlato, mriežka, sklo, šípka */
  --grad-gold: linear-gradient(135deg, transparent 55%, rgba(138, 109, 0, 0.35)), linear-gradient(135deg, var(--accent-soft), var(--accent-hover) 40%, var(--accent) 70%);
  --grid-line: rgba(255, 255, 255, 0.08);
  --glow: rgba(255, 210, 30, 0.18);
  --glass-dark: rgba(255, 255, 255, 0.06);
  --glass-dark-line: rgba(255, 255, 255, 0.1);
  --field-line: rgba(22, 24, 29, 0.5);
  --arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h11M9 4l4 4-4 4' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  /* kontext: svetlý (tmavé plochy ho prepíšu) */
  --text: var(--ink);
  --text-muted: var(--muted);
  --on-text: var(--card);
  --line-c: var(--line);
  --box: var(--soft);
  --btn-line: var(--ink);
  --hover: var(--gold);
  --focus: var(--ink);
}
@media (min-width: 600px) { :root { --pad: 32px; } }
@media (min-width: 720px) { :root { --fs-text: 1.0625rem; --edge: 16px; } }
@media (min-width: 768px) { :root { --header-h: 84px; } }
@media (min-width: 900px) { :root { --ls-h1: -0.05em; --ls-h2: -0.045em; } }
@media (min-width: 1024px) { :root { --pad: clamp(48px, 5vw, 80px); } }

/* ===== 2. Základ (dizajn-system 2.2, 2.3, 2.6, 3.3, 4.0) ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; font-synthesis-weight: none; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); scroll-padding-bottom: var(--bottom-ui, 0px); }
body { margin: 0; padding: 0; overflow-x: hidden; background: var(--card); color: var(--ink); font-family: var(--font); font-size: var(--fs-text); line-height: var(--lh-text); letter-spacing: var(--ls-text); overflow-wrap: break-word; -webkit-font-smoothing: antialiased; }
[hidden] { display: none !important; }
img { max-width: 100%; height: auto; display: block; }

/* Nadpisy: H1 Domova je väčší ako H1 podstránok */
h1, h2, h3, h4 { margin: 0 0 0.5em; color: inherit; font-weight: var(--fw-strong); letter-spacing: var(--ls-h3); line-height: var(--lh-h3); text-wrap: balance; }
h1 { font-size: var(--fs-h1-sub); font-weight: var(--fw-display); letter-spacing: var(--ls-h1); line-height: var(--lh-h1); }
.hero--home h1 { font-size: var(--fs-h1); }
h2 { font-size: var(--fs-h2); font-weight: var(--fw-display); letter-spacing: var(--ls-h2); line-height: var(--lh-h2); }
h3 { font-size: var(--fs-h3); }
h4 { font-size: var(--fs-h4); letter-spacing: var(--ls-h4); line-height: 1.35; }
/* úzky mobil: väčšie riadkovanie H2 kvôli diakritike */
@media (max-width: 599px) { h2 { --lh-h2: 1.2; } }

/* Text a odkazy */
p { margin: 0 0 1em; }
a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; overflow-wrap: anywhere; transition: color var(--t-1) var(--ease); }
a:hover { color: var(--hover); }
strong { font-weight: var(--fw-strong); }
small { font-size: var(--fs-micro); letter-spacing: 0; }
button, input, select, textarea { font: inherit; letter-spacing: inherit; color: inherit; }
button { cursor: pointer; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { padding: 0; }
ul, ol { margin: 0 0 1em; padding-left: 1.4em; }
table { border-collapse: collapse; width: 100%; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
::selection { background: var(--accent); color: var(--ink); }
.site-card { overflow: clip; }

/* Zlatý prechod v texte (3.3) */
.text-zlato { color: var(--accent); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) { .text-zlato { background: var(--grad-gold); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; } }
@media (forced-colors: active) { .text-zlato { background: none; color: CanvasText; -webkit-text-fill-color: currentColor; } }

/* Kontext (4.0): tmavé plochy; --label-c je farba malých štítkov */
.section--dark, .hero--home, .page--kampan .hero, .site-footer > .container, .calc__price, .sticky-cta, .card--finance, .price-card--featured, .campaign-block .card, .am-panel { --text: var(--card); --text-muted: var(--dark-muted); --on-text: var(--ink); --line-c: rgba(255, 255, 255, 0.12); --box: var(--glass-dark); --btn-line: rgba(255, 255, 255, 0.45); --hover: var(--accent); --focus: var(--accent); --label-c: var(--accent); color: var(--text); }
/* svetlé boxy v tmavom */
.card:not(.card--finance, .campaign-block .card, .am-panel .card), .price-card:not(.price-card--featured), .calc__form, .quiz, .savings, .bonus-calc, .order, .calc__inquiry, .cookie-bar, .contact-block .form { --text: var(--ink); --text-muted: var(--muted); --on-text: var(--card); --line-c: var(--line); --box: var(--soft); --btn-line: var(--ink); --hover: var(--gold); --focus: var(--ink); --label-c: var(--gold); color: var(--text); }
/* ===== 3. Pomocné triedy (dizajn-system 2.2.1, 2.6, 4.10) ===== */
/* Kontajner; úzky stĺpec 46rem zarovnaný vľavo s obsahom */
.container { width: 100%; max-width: calc(var(--content) + 2 * var(--gutter)); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.container--narrow { max-width: calc(46rem + 2 * var(--gutter)); }
.section--white > .container--narrow { margin-left: max(0px, (100% - var(--content)) / 2 - var(--gutter)); }
.section--white#faq > .container--narrow { max-width: calc(var(--content) + 2 * var(--gutter)); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 24px; top: -100px; z-index: 100; padding: 10px 18px; border-radius: var(--r-pill); background: var(--accent); color: var(--ink); font-weight: var(--fw-strong); text-decoration: none; }
.skip-link:focus { top: 16px; outline: 3px solid var(--ink); }
.calc__line span:last-child, .savings__line strong, .stepper output { font-variant-numeric: tabular-nums; }

/* Eyebrow so žltým podčiarknutím; riadkovanie 2 chráni diakritiku pri zalomení */
:is(.hero__eyebrow, .contact-block__label) { display: inline-block; margin: 0 0 24px; padding: 0; border-radius: 0; background: none; color: var(--text); font-size: 1rem; font-weight: var(--fw-display); letter-spacing: 0; line-height: 2; text-transform: none; text-decoration: underline 5px var(--accent); text-underline-offset: 9px; text-decoration-skip-ink: none; }
/* Domov: dlhý nadnadpis bez čiary */
.hero--home .hero__eyebrow { display: block; margin-bottom: 16px; max-width: 34rem; color: var(--text-muted); font-size: var(--fs-small); line-height: 1.5; text-decoration: none; }

/* Malé štítky VERZÁLKAMI; farba z kontextu (--label-c) */
.card__eyebrow, .price-card__type, .footer__title, .table th, .table--cards td::before { font-size: var(--fs-label); font-weight: var(--fw-strong); letter-spacing: var(--ls-label); line-height: 1.4; text-transform: uppercase; }
.card__eyebrow, .price-card__type { color: var(--label-c, var(--gold)); }
/* ===== 4. Tlačidlá (dizajn-system 4.1): pohyb cez translate a scale, transform patrí GSAP ===== */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 13px 24px; border: 1px solid transparent; border-radius: var(--r-pill); font-size: 1rem; font-weight: var(--fw-strong); line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; transition: background-color var(--t-2) var(--ease), border-color var(--t-2) var(--ease), color var(--t-2) var(--ease), translate var(--t-2) var(--ease), scale var(--t-1) var(--ease); }
@media (hover: hover) { .btn:hover { translate: 0 -1px; } }
.btn:active { translate: 0 0; scale: 0.98; }
.btn--primary { background: var(--accent); border-color: var(--accent); color: var(--ink); }
.btn--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: var(--ink); }
/* tmavé: rámik z kontextu, viditeľný aj na tmavom paneli */
.btn--dark { background: var(--ink); border-color: var(--btn-line); color: var(--card); }
.btn--dark:hover { background: var(--dark-2); color: var(--card); }
/* obrysové: farby z kontextu, pri hoveri výplň */
.btn--secondary, .btn--ghost { background: transparent; border-color: var(--btn-line); color: var(--text); }
.btn--secondary:hover, .btn--ghost:hover { background: var(--text); border-color: var(--text); color: var(--on-text); }
.btn--small { min-height: 44px; padding: 10px 18px; font-size: 0.9375rem; }
.btn--block { display: flex; width: 100%; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; translate: none; scale: none; }
/* Šípka maskou z --arrow, pri hoveri posun o 4 px */
:is(.btn--arrow, .hero__actions .btn--primary, .cta-final .btn--primary, .header-cta, .card__link)::after { content: ""; flex: 0 0 auto; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--arrow) center / contain no-repeat; mask: var(--arrow) center / contain no-repeat; transition: translate var(--t-3) var(--ease); }
@media (hover: hover) { :is(.btn, .card__link):hover::after { translate: 4px 0; } }
/* Mobil: tlačidlá v hero a záverečnej výzve na celú šírku */
@media (max-width: 479px) { .hero__actions > .btn { flex: 1 1 100%; } }
@media (prefers-reduced-motion: reduce) { .btn, .btn:hover, .btn:active, :is(.btn, .card__link):hover::after { translate: none; scale: none; } }
/* ===== 5. Kampaňová lišta ===== */
.campaign-bar { display: flex; align-items: center; justify-content: center; min-height: 36px; padding: 6px 20px; background: var(--accent); color: var(--ink); font-size: 0.8125rem; font-weight: 600; line-height: 1.3; text-align: center; }
.campaign-bar__text { margin: 0; }
@media (min-width: 600px) { .campaign-bar { min-height: 40px; font-size: 0.875rem; } }
/* Drobčeky (dizajn-system 4.16) */
.breadcrumbs { margin: 0 0 8px; color: var(--muted); font-size: var(--fs-micro); letter-spacing: 0; line-height: 1.55; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 4px 6px; list-style: none; margin: 0; padding: 12px 0 0; }
.breadcrumbs li + li::before { content: "/"; content: "/" / ""; color: var(--btn-line-light); padding-right: 6px; }
.breadcrumbs li[aria-current] { color: var(--ink); font-weight: var(--fw-display); }
.breadcrumbs a { color: var(--muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--gold); text-decoration: underline; }
/* Kampaňová lišta: miesto rezervované pred site.js (CLS); 3, 2 a 1 riadok */
@media (scripting: enabled) {
  .campaign-bar[hidden] { display: flex !important; min-height: calc(12px + 3.9em); }
  @media (min-width: 480px) { .campaign-bar[hidden] { min-height: calc(12px + 2.6em); } }
  @media (min-width: 1024px) { .campaign-bar[hidden] { min-height: 40px; } }
}
/* ===== 6. Sekcie a panely (dizajn-system 4.6, 2.6, 4.5) ===== */
/* Biela sekcia bez panela; druhá biela za bielou bez horného odsadenia */
.section { padding: var(--sec-y) 0; }
.section--white + .section--white { padding-top: 0; }
/* Panel odsadený od okraja okna */
.section--light, .section--dark { margin: var(--panel-gap) max(var(--edge), calc((100% - var(--panel-max)) / 2)); padding: var(--panel-y) 0; border-radius: var(--r-panel); }
.section--light { --box: var(--card); background: var(--soft); }
:is(.section--light, .section--dark) > .container { max-width: calc(var(--content) + 2 * var(--pad)); padding-inline: var(--pad); }
.section--light > .container + .container { margin-top: 8px; }

/* Tmavý panel so žiarou; mriežka len hero Domova a kampane, výzva, kontakt */
.section--dark:not(.hero), .hero--home, .page--kampan .hero { position: relative; isolation: isolate; overflow: hidden; background: var(--ink); }
:is(.hero--home, .page--kampan .hero, .cta-final, .contact-block)::before { --m: radial-gradient(ellipse 80% 70% at 70% 45%, #000 30%, #0000 85%); content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none; background: linear-gradient(var(--grid-line) 1px, #0000 1px), linear-gradient(90deg, var(--grid-line) 1px, #0000 1px); background-size: 56px 56px; -webkit-mask-image: var(--m); mask-image: var(--m); }
:is(.section--dark:not(.hero), .hero--home, .page--kampan .hero)::after { content: ""; position: absolute; z-index: -1; pointer-events: none; width: 60%; aspect-ratio: 1; right: -15%; top: -30%; background: radial-gradient(circle, var(--glow), #0000 60%); }

/* Hlavička sekcie */
.section__title { margin: 0 0 var(--head-gap); }
.section__title + .section__lead { margin-top: calc(16px - var(--head-gap)); }
.section__lead { max-width: 42rem; margin: 0 0 var(--head-gap); color: var(--text-muted); font-size: var(--fs-lead); line-height: 1.45; text-wrap: pretty; }
.section__more { margin: 32px 0 0; }
.section > .container > :last-child { margin-bottom: 0; }
.section__more + .callout { margin-top: 24px; }
/* Na stred: Prečo ÚčtoFin, Služby na Domove, záverečná výzva */
:is(#preco-uctofin, #sluzby, .cta-final) :is(.section__title, .section__lead) { max-width: 40rem; margin-inline: auto; text-align: center; }
#preco-uctofin .cards__note { text-align: center; }
/* ===== 7. Hero (dizajn-system 5.1, 4.5, 4.6) ===== */
/* Hero podstránok: svetlé, bez panela (tmavé hero kampane je panel zo 6. Sekcie) */
.hero--simple { padding: clamp(32px, 1.5rem + 3vw, 72px) 0 clamp(16px, 3vw, 40px); }
.hero--simple + .section--white { padding-top: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
/* Hero Domova a kampane: tmavý panel (6. Sekcie) */
.hero__grid { display: grid; gap: 32px; align-items: center; }
.hero__body { min-width: 0; }
.hero__body > * { animation: heroIn 0.7s var(--ease-out) both; }
.hero__body > :nth-child(2) { animation-delay: 0.08s; }
.hero__body > :nth-child(3) { animation-delay: 0.15s; }
.hero__body > :nth-child(4) { animation-delay: 0.3s; }
.hero__body > :nth-child(n+5) { animation-delay: 0.45s; }
.hero__title { margin: 0 0 24px; }
.hero__lead { max-width: 38rem; margin: 0 0 8px; color: var(--text-muted); font-size: var(--fs-lead); line-height: 1.45; text-wrap: pretty; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 32px 0 20px; }
.hero__note { max-width: 44rem; margin: 0 0 8px; color: var(--text-muted); font-size: var(--fs-small); }
/* blog: dátum zverejnenia článku pod úvodom */
.hero__date { margin: 6px 0 0; color: var(--text-muted); font-size: var(--fs-small); font-weight: var(--fw-strong); }
.hero__media { position: relative; width: 100%; min-width: 0; max-width: 420px; margin: 8px auto 0; animation: heroIn 0.8s var(--ease-out) both; }
.hero__caption { margin: 12px 0 0; color: var(--text-muted); font-size: var(--fs-micro); text-align: center; }
@media (min-width: 900px) {
  .hero__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); gap: clamp(40px, 5vw, 72px); }
  .hero--simple .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero--simple .hero__grid:has(> .hero__media) { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); }
  .hero--simple .hero__body { max-width: 800px; }
  .hero__media { margin: 0 0 0 auto; }
  .hero-visual .photo-placeholder { width: 340px; max-width: 78%; }
}

/* Placeholder fotky */
.photo-placeholder { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 5; padding: 20px; border: 2px dashed var(--btn-line-light); border-radius: var(--r-tile); background: var(--soft); text-align: center; }
.section--light .photo-placeholder { background: var(--card); }
.photo-placeholder--square { max-width: 360px; aspect-ratio: 1; }
.photo-placeholder .doplnit { text-wrap: balance; }
/* skutočná fotka Tomáša v ráme placeholdera */
.photo--real { padding: 0; border: 0; overflow: hidden; background: var(--soft); }
.photo--real img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Domov: fotka s odznakmi */
.hero-visual { display: flex; flex-direction: column; align-items: center; max-width: 460px; padding: 28px 0 0; }
.hero-visual > * { position: relative; z-index: 1; }
.hero-visual .photo-placeholder { width: 78%; border-color: rgba(255, 255, 255, 0.3); background: var(--glass-dark); }
.hero-visual > .hero-badge, .hero-diamond { position: absolute; z-index: 2; }
.hero-badge { margin: 0; border-radius: var(--r-s); line-height: 1.3; box-shadow: var(--sh-3); }
.hero-badge--light { top: 0; left: 0; display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--card); color: var(--ink); animation: popMsg 0.6s var(--ease-out) 0.5s both, floatY 4.5s var(--ease) 2.2s infinite; }
.hero-badge__check { position: relative; flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--accent); }
.hero-badge__check::after { content: ""; position: absolute; left: 13px; top: 9px; width: 8px; height: 14px; border: solid var(--ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.hero-badge__body { display: grid; }
.hero-badge__body strong { font-size: var(--fs-small); }
.hero-badge span { color: var(--muted); font-size: var(--fs-label); }
.hero-badge--dark { right: 0; bottom: 64px; display: grid; gap: 2px; padding: 14px 18px; border: 1px solid var(--glass-dark-line); background: rgba(43, 47, 56, 0.8); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); animation: popMsg 0.6s var(--ease-out) 1.2s both, floatY 5s var(--ease) 2.6s infinite; }
.hero-badge--dark span { color: var(--dark-muted); }
.hero-badge--dark strong { color: var(--accent); font-size: 1.5rem; letter-spacing: -0.03em; }
.hero-diamond { left: 10px; bottom: 150px; width: 14px; height: 14px; border-radius: 3px; background: var(--accent); transform: rotate(45deg); animation: diamondFloat 3.6s var(--ease) infinite; }
.hero-diamond--small { left: auto; right: 44px; top: 30px; bottom: auto; width: 10px; height: 10px; border-radius: 2px; animation-duration: 4.4s; animation-delay: 0.8s; }
/* 80+ klientov */
.hero-clients { display: flex; align-items: center; gap: 14px; margin-top: 24px; }
.hero-clients__dots { display: flex; flex: none; }
.hero-clients__dots span { display: grid; place-items: center; width: 40px; height: 40px; border: 2.5px solid var(--on-text); border-radius: 50%; background: var(--accent); color: var(--ink); font-size: var(--fs-micro); font-weight: 600; }
.hero-clients__dots span + span { margin-left: -10px; }
.hero-clients__dots span:nth-child(2) { background: var(--dark-2); color: var(--accent); font-size: var(--fs-label); }
.hero-clients__dots span:nth-child(3) { background: var(--soft-2); }
.hero-clients__text { display: grid; margin: 0; line-height: 1.3; }
.hero-clients__text strong { font-size: 1.25rem; letter-spacing: -0.02em; }
.hero-clients__text > span { color: var(--text-muted); font-size: var(--fs-micro); }

/* Kampaň: dátumy */
.dates { display: grid; gap: 12px; margin: 28px 0 20px; }
.date { display: grid; gap: 2px; padding: 16px 20px; border: 1px solid var(--glass-dark-line); border-radius: var(--r-s); background: var(--box); }
.date__day { color: var(--accent); font-size: 1.625rem; font-weight: 600; letter-spacing: -0.03em; line-height: 1.1; }
.date__label { color: var(--text-muted); font-size: var(--fs-small); }
@media (min-width: 560px) { .dates { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Žltý rámček placeholdera, trieda .doplnit (dnes sa na webe nepoužíva) */
.doplnit { display: inline-block; padding: 2px 10px; border: 2px dashed var(--gold); border-radius: var(--r-xs); background: var(--accent); color: var(--ink); font-size: var(--fs-small); font-weight: 600; line-height: 1.4; }
/* ===== 8. Dôvera v hero (register NBS, certifikát EFA) ===== */
.hero-proof { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: 16px 0 0; font-size: var(--fs-micro); letter-spacing: 0; }
.hero-proof a { display: inline-block; padding-block: 2px; color: var(--text); font-weight: var(--fw-strong); text-decoration-color: var(--text-muted); }
.hero-proof a:hover { color: var(--hover); text-decoration-color: currentColor; }
/* ===== 9. Krátka odpoveď a meta riadok (dizajn-system.md 4.17, 5.7) ===== */
.answer { margin: 0 0 16px; padding: 20px 24px; border-left: 4px solid var(--accent); border-radius: var(--r-card); background: var(--accent-soft); color: var(--ink); font-size: clamp(1.0625rem, 1rem + 0.25vw, 1.125rem); font-weight: var(--fw-display); line-height: 1.5; }
.answer p:last-child { margin-bottom: 0; }
.meta-line { margin: 0 0 28px; color: var(--text-muted); font-size: var(--fs-micro); letter-spacing: 0; }
/* ===== 10. Karty, dlaždice a štítky (dizajn-system 4.2, 4.3, 4.4, 4.10) ===== */
/* Ploché karty: na bielej --soft, v paneli biele */
.cards { display: grid; gap: var(--gap); margin: 0 0 24px; }
.card, .step, .post { min-width: 0; padding: clamp(24px, 2.5vw, 32px); border-radius: var(--r-card); background: var(--box); }
.card { display: flex; flex-direction: column; gap: 12px; }
.card > * { margin: 0; }
.section--light .card, .section--dark .card { background: var(--card); }
/* Ikona: žltý štvorček, čiarová SVG (viewBox 200) */
.card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 8px; border-radius: var(--r-s); background: var(--accent); color: var(--ink); }
.card__icon svg { width: 28px; height: 28px; stroke-width: 12; }
.card__text { color: var(--text-muted); font-size: var(--fs-small); line-height: 1.6; }
.card__price { font-size: 1.5rem; font-weight: var(--fw-strong); letter-spacing: -0.03em; line-height: 1.2; }
.card__price-note { display: block; margin-top: 4px; color: var(--text-muted); font-size: var(--fs-micro); font-weight: 400; letter-spacing: 0; line-height: 1.5; }
.card__link { display: inline-flex; align-items: center; align-self: flex-start; gap: 8px; margin-top: auto; padding-top: 8px; color: var(--text); font-size: 0.9375rem; font-weight: var(--fw-strong); text-decoration: none; }
.card__link + .card__link { margin-top: 0; padding-top: 0; }
.card__link { min-height: 24px; }
.card .btn { align-self: flex-start; margin-top: 8px; }
.card .btn--block { align-self: stretch; }
.cards__note { margin: 0 0 8px; color: var(--text-muted); font-size: var(--fs-small); }
@media (min-width: 720px) {
  .cards--2, .cards--4, .cards--3:where(:has(.persona)) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .cards--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cards--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* Dlaždice služieb (4.3): dve veľké, tri menšie, posledná tmavá */
.cards--services .card { padding: clamp(28px, 3.5vw, 44px); border-radius: var(--r-tile); }
.cards--services .card__price { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 4px; font-size: 1rem; }
.cards--services .card__price-value { padding: 8px 16px; border-radius: var(--r-pill); background: var(--card); font-size: var(--fs-small); letter-spacing: 0; }
.cards--services .card__price-note { margin: 0; }
.section--light .cards--services .card__price-value { background: var(--soft); }
.card--finance { background: var(--ink) !important; }
.card--finance .card__text { flex: 1 1 auto; }
@media (min-width: 720px) {
  .cards--services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards--services .card--finance { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
  .cards--services { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .cards--services .card { grid-column: span 2; }
  .cards--services .card:nth-child(-n+2) { grid-column: span 3; min-height: 380px; }
  .cards--services .card:nth-child(-n+2) .card__title { font-size: clamp(1.5rem, 1rem + 1vw, 2rem); font-weight: var(--fw-display); letter-spacing: var(--ls-h2); line-height: 1.15; }
}

/* Dlaždice typov klientov na Pre koho (4.3) */
#skupiny-klientov .card { padding: 12px 12px 28px; border-radius: var(--r-tile); }
#skupiny-klientov .card > :not(.persona) { margin-inline: clamp(12px, 1.5vw, 20px); }
#skupiny-klientov .persona--karta { margin-bottom: 12px; }

/* Štítky (4.10) */
.tag { display: inline-block; padding: 3px 11px; border-radius: var(--r-pill); background: var(--soft-2); color: var(--ink); font-size: var(--fs-micro); font-weight: var(--fw-strong); line-height: 1.5; white-space: nowrap; vertical-align: middle; }
.tag--plus { background: var(--ink); color: var(--accent); }
/* ===== 10b. O nás: fotka a text (5.1, 5.2) ===== */
.about__grid { display: grid; gap: 28px; align-items: center; margin-bottom: 32px; }
.about__media { min-width: 0; max-width: 360px; }
.about__media .photo-placeholder { border-radius: var(--r-tile); }
.about__body { min-width: 0; }
.about__body .section__title { margin-bottom: 12px; }
.about__body p { color: var(--text-muted); }
.about__name { margin: 0 0 12px; color: var(--text) !important; font-size: var(--fs-h4); font-weight: var(--fw-strong); letter-spacing: var(--ls-h4); }
@media (min-width: 800px) { .about__grid { grid-template-columns: minmax(0, 360px) 1fr; gap: clamp(40px, 5vw, 72px); } }
/* ===== 11. Kroky (5.1 Ako to funguje): karty so žltým číslom v krúžku ===== */
.steps { display: grid; gap: var(--gap); margin: 0 0 24px; padding: 0; list-style: none; counter-reset: krok; }
.step { position: relative; counter-increment: krok; }
.step::before { content: counter(krok); display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-bottom: 20px; border-radius: 50%; background: var(--accent); color: var(--ink); font-size: var(--fs-h4); font-weight: var(--fw-strong); letter-spacing: 0; line-height: 1; }
.step__title { margin: 0 0 8px; font-size: var(--fs-h4); letter-spacing: var(--ls-h4); line-height: 1.35; }
.step__text { margin: 0; color: var(--text-muted); font-size: var(--fs-small); line-height: 1.6; }
/* Kompaktné kroky (zoznam s číslom vľavo) */
.steps--compact { gap: 10px; }
.steps--compact .step { padding: 14px 18px 14px 64px; border-radius: var(--r-s); }
.steps--compact .step::before { position: absolute; left: 16px; top: 12px; width: 34px; height: 34px; margin: 0; font-size: var(--fs-small); }
.steps--compact .step__title { margin: 5px 0 0; font-size: 1rem; font-weight: var(--fw-display); letter-spacing: var(--ls-text); line-height: 1.5; }
@media (min-width: 720px) {
  .steps:not(.steps--compact) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps:not(.steps--compact):has(.step:nth-child(3):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 960px) {
  .steps:not(.steps--compact):has(.step:nth-child(4)) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
/* ===== 12. Upozornenia a povinné vety (dizajn-system 4.17) ===== */
.callout { position: relative; margin: 0 0 24px; padding: clamp(20px, 3vw, 24px) clamp(22px, 3.5vw, 28px); border-radius: var(--r-card); background: var(--box); color: var(--text); }
.callout > :last-child { margin-bottom: 0; }
.callout ul { padding-left: 20px; }
.callout__title { margin: 0 0 10px; font-size: var(--fs-h4); letter-spacing: var(--ls-h4); }
/* Čiarka vľavo z --bar; vo varovaní hover --warn (kontrast) */
:is(.callout--info:not(.co-nerobime, .callout--banner), .callout--warning)::before { content: ""; position: absolute; left: 0; top: 20px; bottom: 20px; width: 4px; border-radius: 0 4px 4px 0; background: var(--bar, var(--accent)); }
.callout--warning { --bar: var(--warn); --hover: var(--warn); --focus: var(--ink); background: var(--warn-soft); color: var(--ink); }
/* Povinné vety: bez boxu, čiara hore, nikdy menšie ako 13 px */
.callout--legal { padding: 14px 0 0; border-radius: 0; background: none; border-top: 1px solid var(--line-c); color: var(--text-muted); font-size: var(--fs-micro); line-height: 1.55; }
.callout--legal p { margin: 0; }
/* Čo nerobíme: bez boxu, dva stĺpce */
.co-nerobime { display: grid; gap: 4px 48px; padding: 24px 0 0; border-top: 1px solid var(--line-c); border-radius: 0; background: none; color: var(--text-muted); font-size: 0.9375rem; }
.co-nerobime .callout__title { color: var(--text); }
.co-nerobime ul { margin: 0 0 8px; }
.co-nerobime li { margin-bottom: 4px; }
.co-nerobime .callout--legal { margin: 8px 0 0; }
@media (min-width: 800px) { .co-nerobime { grid-template-columns: minmax(0, 13rem) minmax(0, 1fr); } .co-nerobime .callout--legal { grid-column: 2; } }
/* Banner s tlačidlom (4.17) */
.callout--banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; padding: clamp(24px, 3.5vw, 40px); background: var(--accent-soft); color: var(--ink); }
.callout--banner > p { margin: 0; }
.callout--banner > p:first-child { flex: 1 1 20rem; max-width: 40rem; font-size: var(--fs-lead); font-weight: var(--fw-display); letter-spacing: var(--ls-h4); line-height: 1.4; }
/* ===== 13. Checklist (žltý krúžok s fajkou) ===== */
.checklist { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 12px; }
.checklist__item { position: relative; min-height: 24px; padding-left: 36px; }
.checklist__item::before { content: ""; position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 50%; background: var(--accent); }
.checklist__item::after { content: ""; position: absolute; left: 9px; top: 6px; width: 6px; height: 11px; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); rotate: 45deg; }
/* Krátke položky v dvoch stĺpcoch (Cenník: V cene bez príplatku) */
@media (min-width: 720px) { .checklist--2 { display: block; columns: 2; column-gap: 32px; } .checklist--2 > li { margin-bottom: 12px; break-inside: avoid; } }
/* ===== 14. Cenové karty kampane (5.2) ===== */
.price-cards { display: grid; gap: var(--gap); max-width: 880px; margin: 0 auto 32px; }
.price-card { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: clamp(32px, 3.5vw, 44px) clamp(24px, 3vw, 36px); border-radius: var(--r-tile); background: var(--box); text-align: center; }
.price-card > * { margin: 0; }
.price-card--featured { background: var(--ink); }
.price-card__old { color: var(--text-muted); font-size: 1.0625rem; text-decoration: line-through; }
.price-card__new { font-size: clamp(2.5rem, 2rem + 1.5vw, 3rem); font-weight: var(--fw-strong); letter-spacing: -0.04em; line-height: 1.1; }
.price-card--featured .price-card__new { color: var(--accent); }
.price-card__save { color: var(--ok); font-weight: var(--fw-strong); }
.price-card--featured .price-card__save { color: var(--accent-soft); }
.price-card__note { color: var(--text-muted); font-size: var(--fs-small); }
.price-card .btn { width: 100%; margin-top: 20px; }
@media (min-width: 720px) { .price-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* ===== 14b. Fotky typov klientov (4.19, AVATARY.md) ===== */
.persona { position: relative; margin: 0; }
.persona img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: var(--r-s); background: var(--accent); }
.persona__tag { margin-top: 8px; font-size: var(--fs-micro); font-weight: var(--fw-strong); line-height: 1.4; }
.personas { display: grid; grid-template-columns: repeat(3, minmax(0, 220px)); gap: var(--gap); margin: 0 0 24px; }
.persona--mini { width: 72px; margin-bottom: 8px; }
.persona--kviz { width: 96px; margin-bottom: 12px; }
.persona--bok { width: 140px; margin-bottom: 16px; }
/* Dlaždica Pre koho: 4:3, polomer dlaždice mínus 12 px */
.persona--karta img, #skupiny-klientov .persona--karta.anim-zoom { aspect-ratio: 4 / 3; object-position: top; border-radius: calc(var(--r-tile) - 12px); }
.container:has(> .persona--bok) { display: flow-root; }
.bonus-calc { clear: both; }
/* hero podstránky: na mobile malá fotka hore */
.persona--hero { order: -1; width: 112px; margin-bottom: -20px; }
@media (min-width: 600px) { .quiz__result--a { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 0 20px; } .persona--kviz { grid-row: span 2; } }
/* Od 900 px štítok ako biela pilulka na fotke */
@media (min-width: 900px) {
  .hero--persona .hero__grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; }
  .persona--hero { order: 0; width: auto; margin: 0; }
  .persona--bok { float: right; width: 220px; margin: 0 0 16px 32px; }
  :is(.personas, .persona--hero, .persona--bok) img { border-radius: var(--r-card); }
  :is(.personas, .persona--hero, .persona--bok) .persona__tag { position: absolute; left: 12px; bottom: 12px; margin: 0; padding: 4px 12px; border-radius: var(--r-pill); background: var(--card); color: var(--ink); }
}
/* ===== 15. Tabuľky (dizajn-system 4.18) ===== */
.table-wrap { margin: 0 0 24px; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); color: var(--ink); }
.table { width: 100%; font-size: 1rem; }
.table th, .table td { padding: 16px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.table th { background: var(--soft); color: var(--muted); }
.table tbody tr:last-child td { border-bottom: 0; }
.compare tbody td:first-child { font-weight: var(--fw-strong); }
/* Odkaz v bunke nedelí slovo (najmä pri tlači) */
.table a { overflow-wrap: break-word; }
/* Tabuľka v próze: hustejšie bunky */
@media (min-width: 721px) { .prose .table { font-size: 0.9375rem; } .prose .table :is(th, td) { padding: 14px; } }
/* Mobil: riadky ako karty so štítkom z data-label */
@media (max-width: 720px) {
  .table-wrap:has(.table--cards) { overflow: visible; border: 0; border-radius: 0; background: none; color: inherit; }
  .table--cards, .table--cards :is(tbody, tr, td) { display: block; width: 100%; }
  .table--cards thead { display: none; }
  .table--cards tr { margin: 0 0 12px; padding: 4px 20px; border-radius: var(--r-card); background: var(--box); color: var(--text); }
  .table--cards td { padding: 12px 0; border-bottom: 1px solid var(--line-c); }
  .table--cards td::before { content: attr(data-label); display: block; margin: 0 0 2px; color: var(--text-muted); }
  .table--cards td:last-child { border-bottom: 0; }
  .table--cards td:empty { display: none; }
  .compare.table--cards td:first-child { font-size: var(--fs-h4); letter-spacing: var(--ls-h4); }
  .compare.table--cards td:first-child::before { display: none; }
}
/* ===== 16. Dlhý text, FAQ, blog (dizajn-system 4.7, 5.7, 5.8) ===== */
/* Dlhý text: blog a právne stránky */
.prose { max-width: 46rem; line-height: 1.65; }
.prose h2 { margin: 48px 0 14px; font-size: clamp(1.625rem, 1.3rem + 1vw, 2rem); font-weight: var(--fw-display); letter-spacing: -0.03em; line-height: 1.2; }
.prose h3 { margin: 32px 0 8px; font-size: 1.25rem; }
.prose h2:first-child { margin-top: 0; }
.prose :is(p, ul, ol) { margin: 0 0 18px; }
.prose :is(ul, ol) { padding-left: 24px; }
.prose li { margin: 0 0 8px; }
.prose li::marker { color: var(--muted); }
.prose :is(.table-wrap, .callout) { margin: 28px 0; }
.prose + .faq { margin-top: 32px; }

/* FAQ: riadky s čiarami, plus sa otočí na krížik */
.faq { display: grid; max-width: 52rem; margin: 0 0 32px; border-bottom: 1px solid var(--line-c); }
.faq-item { border-top: 1px solid var(--line-c); }
.faq-item summary { position: relative; list-style: none; padding: 22px 56px 22px 0; border-radius: var(--r-xs); font-size: 1.125rem; font-weight: var(--fw-display); letter-spacing: var(--ls-h4); line-height: 1.4; cursor: pointer; transition: color var(--t-1) var(--ease); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: ""; position: absolute; right: 0; top: 50%; width: 32px; height: 32px; margin-top: -16px; border-radius: 50%; background: linear-gradient(var(--ink), var(--ink)) center / 12px 2px no-repeat, linear-gradient(var(--ink), var(--ink)) center / 2px 12px no-repeat, var(--accent); transition: rotate var(--t-3) var(--ease); }
.faq-item[open] > summary::after { rotate: 45deg; }
.faq-item summary:hover { color: var(--hover); }
.faq-item__body { max-width: 46rem; padding: 0 0 24px; color: var(--text-muted); }
.faq-item__body > :last-child { margin-bottom: 0; }
.faq-item__body a { color: var(--text); }
/* Porovnanie na kampani */
.compare-more { margin: 0 0 24px; border-bottom: 1px solid var(--line-c); }
.compare-more .faq-item__body { max-width: none; }
.compare-more .table-wrap { margin: 0; }

/* Blog: články ako karty s dátumom v pilulke */
.post-list { display: grid; gap: var(--gap); margin: 0 0 24px; padding: 0; list-style: none; }
/* na konci sekcie bez dolného okraja (skrytý posuvník sa nepočíta) */
.post-list:is(:last-child, :has(+ .slider-ctl[hidden]:last-child)), .slider-ctl:last-child { margin-bottom: 0; }
.post { position: relative; display: flex; flex-direction: column; transition: background-color var(--t-2) var(--ease); }
.post time { align-self: flex-start; padding: 4px 12px; border-radius: var(--r-pill); background: var(--card); color: var(--muted); font-size: var(--fs-micro); }
.section--light .post time { background: var(--soft); }
.post__title { margin: 20px 0 10px; font-size: 1.25rem; letter-spacing: var(--ls-h3); line-height: 1.3; }
.post__title a { text-decoration: none; }
.post__title a:hover { text-decoration: underline; }
.post__excerpt { margin: 0 0 20px; color: var(--text-muted); font-size: var(--fs-small); line-height: 1.6; }
/* celá karta je odkaz, šípka dole */
.post::after { content: ""; width: 18px; height: 18px; margin-top: auto; background: var(--text); -webkit-mask: var(--arrow) center / contain no-repeat; mask: var(--arrow) center / contain no-repeat; transition: translate var(--t-3) var(--ease); }
.post__title a::before { content: ""; position: absolute; inset: 0; border-radius: var(--r-card); }
.post__title a:focus-visible { outline: none; }
.post:has(.post__title a:focus-visible) { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (hover: hover) {
  .post:hover { background: var(--soft-2); }
  .section--light .post:hover { background: var(--soft); }
  .post:hover::after { translate: 4px 0; }
}
@media (min-width: 720px) { .post-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .post-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
/* ===== 17. Formuláre (dizajn-system.md 4.11) ===== */
.form { display: grid; gap: 16px; max-width: 820px; }
.section > .container > .form { padding: 22px 20px; border-radius: var(--r-card); background: var(--box); }
.form__grid { display: grid; gap: 16px; }
.form + p { margin-top: 16px; }
/* align-content: start: pole sa nenaťahuje, keď má susedné pole v riadku mriežky chybu alebo tip */
.form__row { display: grid; gap: 6px; min-width: 0; align-content: start; }
.form__label { font-weight: var(--fw-strong); font-size: var(--fs-small); }
.form__optional { font-weight: 400; color: var(--text-muted); }
.form__input, .form__select, .form__textarea { width: 100%; min-height: 52px; padding: 13px 16px; border: 1px solid var(--field-line); border-radius: var(--r-s); background: var(--card); color: var(--ink); font-size: 1rem; transition: border-color var(--t-1) var(--ease), box-shadow var(--t-1) var(--ease); }
.form__input::placeholder, .form__textarea::placeholder { color: var(--muted); }
.form__input:hover, .form__select:hover, .form__textarea:hover { border-color: var(--ink); }
.form__select { appearance: none; padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%2316181D' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; }
.form__textarea { min-height: 128px; resize: vertical; }
.form__input:focus, .form__select:focus, .form__textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink), 0 0 0 4px var(--accent); }
.form__input.is-invalid, .form__select.is-invalid, .form__textarea.is-invalid { border: 2px solid var(--err); box-shadow: 0 0 0 3px var(--err-soft); }
/* chyba nie len farbou: výkričník v poli (WCAG 1.4.1) */
.form__input.is-invalid, .form__textarea.is-invalid { padding-right: 44px; background: var(--card) no-repeat right 14px top 15px / 20px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='9' fill='%23C0262D'/%3E%3Cpath d='M10 5v6' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='14.5' r='1.2' fill='%23fff'/%3E%3C/svg%3E"); }
/* fokus na chybnom poli: prstenec ostáva, rámik červený */
.form__input.is-invalid:focus, .form__select.is-invalid:focus, .form__textarea.is-invalid:focus { box-shadow: 0 0 0 1px var(--err), 0 0 0 4px var(--accent); }
.form__check { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 0.9375rem; line-height: 1.5; cursor: pointer; }
.form__check input { width: 24px; height: 24px; margin: 1px 0 0; accent-color: var(--ink); cursor: pointer; flex: 0 0 auto; }
.form__check input.is-invalid { outline: 2px solid var(--err); outline-offset: 2px; border-radius: var(--r-xs); }
.form__check:has(input.is-invalid) > span { text-decoration: underline wavy var(--err) 1px; text-underline-offset: 4px; }
.form__check small { display: block; font-size: var(--fs-micro); color: var(--text-muted); margin-top: 2px; }
.form__check--required { font-weight: var(--fw-display); }
/* povinná voľba z možností (objednávka: prístup na Finančnú správu) */
.form__volba { margin: 0; padding: 0; border: 0; min-width: 0; }
.form__volba > legend { padding: 0; margin-bottom: 10px; }
.form__volby { display: flex; flex-wrap: wrap; gap: 10px 28px; }
.form__volba--vnorena { margin-top: 14px; padding-left: 16px; border-left: 2px solid var(--line); }
.form__check:has(input[type="radio"]) { grid-template-columns: 24px auto; }
.form__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.form__hint { margin: 0; font-size: var(--fs-micro); color: var(--text-muted); flex: 1 1 260px; }
.form__status { margin: 0; padding: 12px 18px; border: 1px solid var(--line); border-radius: var(--r-s); background: var(--card); font-size: 0.9375rem; }
.form__status:empty { display: none; }
.form__status--ok { background: var(--ok-soft); border-color: var(--ok); color: var(--ok); }
.form__status--error { background: var(--err-soft); border-color: var(--err); color: var(--err); }
.form__status--info { background: var(--accent-soft); border-color: var(--accent); color: var(--ink); }
@media (min-width: 720px) {
  .form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
  .section > .container > .form { padding: 32px; }
}
.section--light > .container > .form { max-width: none; }
@media (max-width: 400px) {
  .section > .container > .form { padding: 16px 12px; }
  .form__select { padding-left: 14px; padding-right: 36px; background-position: right 12px center; }
}

/* Kontaktný blok: tmavý panel, vpravo biela karta s formulárom */
.contact-block > .container { display: grid; gap: 0 56px; align-items: start; }
.contact-block .section__lead { margin-bottom: 12px; }
.contact-block__info { margin: 0 0 24px; font-size: 0.9375rem; color: var(--text-muted); }
.contact-block__info a { color: var(--text); font-weight: var(--fw-strong); }
.contact-block .form { --box: var(--card); max-width: none; }
.contact-block .form__grid { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 960px) { .contact-block > .container { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }

/* ===== 18. Kalkulačka priznania (dizajn-system 4.8, 4.11, 3.1) ===== */
.calc { margin: 32px 0 0; }
.calc__grid { display: grid; gap: var(--gap); align-items: start; }
.calc__form { min-width: 0; padding: 24px 20px; border-radius: var(--r-card); background: var(--card); }
.calc__group { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line-c); }
.calc__group > .calc__legend { float: left; width: 100%; padding: 0; }
.calc__group > .calc__legend + * { clear: both; }
/* malé nadpisy */
.calc__legend, .calc__type-name, .calc__more-title { display: block; font-size: var(--fs-h4); font-weight: var(--fw-strong); letter-spacing: var(--ls-h4); line-height: 1.35; }
.calc__legend { margin: 0 0 8px; }
.calc__hint, .calc__type-desc, .calc__more-text { color: var(--text-muted); font-size: var(--fs-small); line-height: 1.5; }
.calc__hint { margin: 0 0 16px; }
.calc__types { display: grid; gap: 12px; }
.calc__types .calc__legend { margin-bottom: 4px; }
.calc__types + .calc__hint { margin-top: 12px; }

/* Typ priznania: vybraná karta tmavá (3.1) */
.calc__type { position: relative; display: block; min-width: 0; padding: 20px 20px 20px 52px; border: 1px solid var(--line-c); border-radius: var(--r-card); background: var(--soft); cursor: pointer; transition: border-color var(--t-1) var(--ease), background-color var(--t-2) var(--ease), color var(--t-2) var(--ease); }
.calc__type input { position: absolute; left: 20px; top: 23px; width: 20px; height: 20px; margin: 0; accent-color: var(--ink); cursor: pointer; }
.calc__type:hover { border-color: var(--ink); }
.calc__type:has(input:checked) { --text-muted: var(--dark-muted); border-color: var(--ink); background: var(--ink); color: var(--card); }
.calc__type:has(input:checked) input { accent-color: var(--accent); }
.calc__type:has(input:focus-visible) { outline: 3px solid var(--ink); outline-offset: 3px; }
.calc__type input:focus-visible { outline: none; }
.calc__type-body { display: block; min-width: 0; }
.calc__type-desc { display: block; margin: 4px 0 8px; }
.calc__type-price { display: block; font-size: var(--fs-small); font-weight: var(--fw-strong); font-variant-numeric: tabular-nums; }

/* Riadky s otázkou a ovládačom */
.calc__row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 16px; padding: 16px 0; border-bottom: 1px solid var(--line-c); }
.calc__row:is(:last-child, :has(+ [hidden]:last-child)) { padding-bottom: 4px; border-bottom: 0; }
.calc__label { flex: 1 1 200px; min-width: 0; font-size: 0.9375rem; font-weight: var(--fw-display); line-height: 1.45; }
.calc__label small { display: block; margin-top: 3px; color: var(--text-muted); font-size: var(--fs-micro); font-weight: 400; }
.calc__ctl { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; }
.calc__ctl--wide { flex: 1 1 100%; }
.calc__ctl--wide .form__input { min-height: 48px; }
.calc__checks { display: grid; gap: 12px; padding: 6px 0 16px; border-bottom: 1px solid var(--line-c); }

/* Zbalené bonusy, ikona z FAQ (4.7) */
.calc__more { margin-top: 28px; }
.calc__more > summary { display: grid; gap: 4px; padding: 24px 52px 4px 0; font-size: 1rem; font-weight: 400; }
.calc__more-title { color: var(--text); transition: color var(--t-1) var(--ease); }
.calc__more > summary:hover .calc__more-title { color: var(--hover); }
.calc__more .calc__group { margin-top: 12px; padding-top: 0; border-top: 0; }

/* Prepínač (4.11) */
.switch { position: relative; display: inline-block; flex: 0 0 auto; cursor: pointer; }
.switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.switch__track { display: block; width: 46px; height: 27px; border-radius: var(--r-pill); background: var(--muted); transition: background-color var(--t-1) var(--ease); }
.switch__track::after { content: ""; position: absolute; left: 3px; top: 3px; width: 21px; height: 21px; border-radius: 50%; background: var(--card); box-shadow: 0 1px 2px rgba(22, 24, 29, 0.3); transition: transform var(--t-1) var(--ease); }
.switch input:checked + .switch__track { background: var(--ink); }
.switch input:checked + .switch__track::after { transform: translateX(19px); }
.switch input:focus-visible + .switch__track { box-shadow: 0 0 0 2px var(--card), 0 0 0 5px var(--focus); }

/* Krokovač +/- */
.stepper { display: inline-flex; align-items: center; height: 44px; overflow: hidden; border: 1px solid var(--field-line); border-radius: var(--r-pill); background: var(--card); }
.stepper button { width: 42px; height: 42px; border: 0; background: transparent; color: var(--ink); font-size: 1.25rem; font-weight: var(--fw-display); line-height: 1; transition: background-color var(--t-1) var(--ease); }
.stepper button:hover { background: var(--soft-2); }
.stepper button:focus-visible { outline-offset: -3px; }
.stepper output { min-width: 34px; font-weight: var(--fw-strong); text-align: center; }

/* Segmentované prepínanie (4.8) */
.seg { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: var(--r-pill); background: var(--soft-2); }
.seg label { position: relative; display: block; }
.seg input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.seg span { display: flex; align-items: center; min-height: 44px; padding: 8px 18px; border-radius: var(--r-pill); color: var(--ink); font-size: var(--fs-small); font-weight: var(--fw-strong); white-space: nowrap; transition: background-color var(--t-2) var(--ease), color var(--t-2) var(--ease); }
.seg input:hover + span { background: var(--card); }
.seg input:checked + span { background: var(--ink); color: var(--card); }
.seg input:focus-visible + span { outline: 3px solid var(--ink); outline-offset: 2px; }

/* Cenový panel, lepkavý od 960 px */
.calc__panel { min-width: 0; }
.calc__price { padding: 28px 24px; border-radius: var(--r-card); background: var(--ink); }
.calc__price-label { margin: 0; color: var(--dark-soft); font-size: var(--fs-small); font-weight: var(--fw-display); }
.calc__amount { margin: 8px 0 0; color: var(--accent); font-size: clamp(2.5rem, 2.2rem + 1vw, 3rem); font-weight: var(--fw-strong); letter-spacing: -0.035em; line-height: 1.05; }
.calc__was, .calc__note { color: var(--dark-muted-2); }
.calc__was { margin: 6px 0 0; font-size: var(--fs-small); }
.calc__was:empty { display: none; }
.calc__lines { margin: 20px 0 0; border-top: 1px solid var(--line-c); }
.calc__line { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line-c); color: var(--dark-soft); font-size: var(--fs-small); }
.calc__line span:first-child { min-width: 0; }
.calc__line span:last-child { flex: 0 0 auto; font-weight: var(--fw-strong); white-space: nowrap; }
.calc__line--disc { padding-left: 10px; border-left: 3px solid var(--accent); background: rgba(255, 210, 30, 0.12); color: var(--accent-soft); font-weight: var(--fw-strong); }
.calc__line--dim { color: var(--dark-muted-2); }
.calc__line--dim span:last-child { font-weight: 400; }
.calc__note { margin: 16px 0 20px; font-size: var(--fs-micro); }
.calc__cta { margin-top: 4px; }
.calc__inquiry { margin: 16px 0 0; padding: 20px; border: 2px dashed var(--gold); border-radius: var(--r-card); background: var(--accent); color: var(--ink); font-size: 0.9375rem; line-height: 1.5; }
@media (min-width: 560px) {
  .calc__types { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .calc__types .calc__legend { grid-column: 1 / -1; }
  .calc__ctl--wide { flex: 0 1 260px; }
}
@media (min-width: 960px) {
  .calc__grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 24px; }
  .calc__form, .calc__price { padding: 32px; }
  .calc__panel { position: sticky; top: calc(var(--header-h) + 24px); }
}
/* Tlač: tmavé plochy biele s rámikom */
@media print {
  :is(.calc__price, .calc__type:has(input:checked), .seg input:checked + span), .calc__price * { background: #fff !important; color: #000 !important; }
  :is(.calc__price, .calc__type:has(input:checked), .seg input:checked + span) { border: 2px solid #000 !important; }
  .calc__panel { position: static; }
}
/* ===== 19. Objednávka, po zaplatení, lepkavá lišta (4.13) ===== */
.order { margin: 32px 0 0; padding: 24px 20px; border-radius: var(--r-card); background: var(--card); }
.order__title, .after__title { margin: 0 0 8px; font-size: var(--fs-h3); }
.order__lead { max-width: 70ch; margin: 0 0 24px; color: var(--text-muted); }
.order__summary { padding: 16px 20px; border-radius: var(--r-s); background: var(--soft); font-size: 0.9375rem; }
.order__summary:empty { display: none; }
.order__consents { display: grid; gap: 14px; }
.order .form { max-width: none; }
.order .callout--legal { margin: 0; }
.after { margin: 48px 0 0; }
.after__title { margin-bottom: 16px; }

/* Lepkavá lišta: zobrazenie riadi site.js, vysunutie GSAP */
.sticky-cta { display: none; }
body:has(.site-header.nav--open) .sticky-cta { visibility: hidden; }
@media (max-width: 900px) {
  .sticky-cta { display: block; position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); z-index: 40; padding: 10px 10px 10px 20px; border-radius: var(--r-card); background: var(--ink); box-shadow: var(--sh-3); }
  .sticky-cta__inner { display: flex; align-items: center; gap: 12px; max-width: var(--content); margin: 0 auto; }
  .sticky-cta__price { display: grid; flex: 0 0 auto; line-height: 1.2; }
  .sticky-cta__label { color: var(--dark-muted); font-size: var(--fs-label); }
  .sticky-cta__price strong { color: var(--accent); font-size: 1.125rem; font-weight: var(--fw-strong); letter-spacing: -0.015em; white-space: nowrap; }
  .sticky-cta__inner .btn { flex: 1 1 auto; min-width: 0; padding-inline: 16px; font-size: 0.9375rem; }
  .page--kampan .site-footer, body:has(.sticky-cta:not([hidden])) .site-footer { padding-bottom: 96px; }
}
@media (min-width: 720px) { .order { padding: 32px; } }
/* ===== 20. Kvíz, kalkulačka úspory, bonus na deti ===== */
.quiz, .savings, .bonus-calc { margin: 0 0 32px; padding: 24px 20px; border-radius: var(--r-card); background: var(--card); }
.section--white .savings { background: var(--soft); }
.quiz__title, .savings__title, .bonus-calc__title { margin: 0 0 8px; font-size: var(--fs-h3); }
.quiz__lead, .savings__lead { max-width: 70ch; margin: 0 0 20px; color: var(--text-muted); }
.quiz__list { list-style: none; counter-reset: otazka; margin: 0 0 24px; padding: 0; border-top: 1px solid var(--line-c); }
.quiz__q { counter-increment: otazka; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px 20px; padding: 16px 0; border-bottom: 1px solid var(--line-c); }
.quiz__text { flex: 1 1 260px; min-width: 0; margin: 0; font-weight: var(--fw-display); }
.quiz__text::before { content: counter(otazka) ". "; color: var(--gold); font-weight: var(--fw-strong); }
.quiz__result { margin: 0 0 16px; }
.quiz__result .hero__actions { margin: 12px 0 0; }
.quiz__source, .savings__note { margin: 0; color: var(--text-muted); font-size: var(--fs-micro); }

/* Výsledok malých kalkulačiek (5.3) */
.savings__grid { display: grid; gap: 16px; margin: 0 0 4px; }
.savings__result { margin: 20px 0 12px; padding: 20px 24px; border-radius: var(--r-card); background: var(--ink); color: var(--dark-soft); }
.savings__line { margin: 0 0 6px; font-size: 0.9375rem; }
.savings__line strong { color: var(--card); }
.savings__diff { margin: 12px 0 0; color: var(--card); font-size: 1.125rem; font-weight: var(--fw-strong); }
.savings__diff strong { color: var(--accent); font-size: 1.75rem; letter-spacing: -0.03em; font-variant-numeric: normal; }
@media (max-width: 479px) { .quiz__result .btn { padding-inline: 16px; } }
@media (min-width: 720px) {
  .quiz, .savings, .bonus-calc { padding: 32px; }
  .savings__grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
}
/* Tlač: výsledok bez tmavého pozadia */
@media print { .savings__result, .savings__result * { background: #fff !important; color: #000 !important; } .savings__result { border: 2px solid #000; } }
/* ===== 21. Kampaňový blok a záverečná výzva (dizajn-system 4.4, 4.10, 5.1, 5.2) ===== */
.campaign-block__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px 40px; margin-bottom: var(--head-gap); }
.campaign-block__intro { flex: 1 1 520px; min-width: 0; max-width: 680px; }
.campaign-block__intro .section__lead { margin-bottom: 0; }
/* Štítok sezóny s trblietavým okrajom (jediný na webe) */
.campaign-block__label { display: inline-block; margin: 0 0 20px; padding: 6px 16px; border: 2px solid transparent; border-radius: var(--r-pill); background: linear-gradient(var(--ink), var(--ink)) padding-box, linear-gradient(90deg, var(--accent), var(--accent-soft), var(--gold), var(--accent)) 0 0 / 200% 100% border-box; box-shadow: 0 0 24px var(--glow); color: var(--card); font-size: 0.9375rem; font-weight: var(--fw-strong); line-height: 1.4; animation: shimmer 3s linear infinite; }
@keyframes shimmer { to { background-position: 0 0, 200% 0; } }
/* Sklenený box 48 h */
.campaign-block__fact { display: flex; flex: 0 1 340px; align-items: center; gap: 16px; margin: 0; padding: 18px 22px; border: 1px solid var(--glass-dark-line); border-radius: var(--r-s); background: var(--box); }
.campaign-block__fact strong { flex: 0 0 auto; color: var(--accent); font-size: 2rem; font-weight: var(--fw-strong); letter-spacing: -0.03em; line-height: 1.1; white-space: nowrap; }
.campaign-block__fact span { color: var(--text-muted); font-size: var(--fs-small); line-height: 1.45; }

/* Žiariace karty: Typ A žltá, Typ B strieborná */
.campaign-block .cards > .card { --c: var(--accent); --label-c: var(--c); border: 1px solid var(--c); border-radius: var(--r-tile); background: transparent; background: color-mix(in srgb, var(--c) 15%, transparent); transition: background-color var(--t-3) var(--ease), box-shadow var(--t-3) var(--ease); }
.campaign-block .cards > .card + .card { --c: var(--dark-soft); }
/* Žiara aj pri fokuse; šípka sa posunie pri myši nad kartou */
.campaign-block .cards > .card:is(:hover, :focus-within) { background: color-mix(in srgb, var(--c) 22%, transparent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 14%, transparent), 0 12px 40px color-mix(in srgb, var(--c) 22%, transparent); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .campaign-block .card:hover .btn::after { translate: 4px 0; } }

.campaign-block .card__text { order: 2; color: var(--text); font-size: var(--fs-text); }
.campaign-block .card__price { order: 3; margin-top: auto; padding-top: 8px; font-size: 2rem; letter-spacing: -0.035em; }
.campaign-block .card .btn { order: 4; margin-top: 8px; }
.campaign-block__note { max-width: 70ch; margin: 0; color: var(--text-muted); font-size: var(--fs-micro); }

/* Záverečná výzva na stred */
.cta-final { text-align: center; }
.cta-final > .cta-final__inner { max-width: calc(48rem + 2 * var(--pad)); }
.cta-final .hero__actions { justify-content: center; margin: 8px 0 0; }
/* ===== 22. Cookies lišta (dizajn-system 4.12) ===== */
.cookie-bar { position: fixed; inset: auto 8px calc(8px + env(safe-area-inset-bottom, 0px)); z-index: 60; max-width: 720px; margin: 0 auto; padding: 16px 0; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--card); box-shadow: var(--sh-2); }
.cookie-bar .container { padding-inline: 20px; }
.cookie-bar__inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; }
.cookie-bar__text { flex: 1 1 320px; margin: 0; color: var(--muted); font-size: var(--fs-small); line-height: 1.5; }
.cookie-bar__text a { color: var(--ink); font-weight: var(--fw-strong); }
.cookie-bar__actions { display: flex; flex: 1 1 auto; flex-wrap: wrap; gap: 10px; }
.cookie-bar .btn { flex: 1 1 140px; }
/* Mobil: nad sticky lištou (translate, bez CLS); --cookie-h, --sticky-h, --bottom-ui dáva site.js */
.cookie-bar { transition: translate var(--t-2) var(--ease); }
@media (max-width: 900px) { body:has(.sticky-cta:not([hidden])) .cookie-bar { translate: 0 calc(-8px - var(--sticky-h, 78px)); } }
body:has(#cookie-bar:not([hidden])) { padding-bottom: calc(var(--cookie-h, 0px) + 16px); }
body:has(.nav--open) .cookie-bar { visibility: hidden; }
@media (min-width: 720px) {
  .cookie-bar { inset: auto 24px calc(24px + env(safe-area-inset-bottom, 0px)); padding: 18px 4px; }
  .cookie-bar__actions { flex: 0 1 auto; }
}
/* ===== 23. Pätička: tmavý panel (dizajn-system 4.15) ===== */
.site-footer > .container { width: auto; max-width: none; margin: var(--panel-gap) max(var(--edge), calc((100% - var(--panel-max)) / 2)) 0; padding: var(--panel-y) var(--pad) clamp(28px, 3vw, 40px); border-radius: var(--r-panel); background: var(--ink); }
.footer__grid { display: grid; gap: 36px; }
.footer__title { margin: 0 0 16px; color: var(--dark-muted-2); }
.footer__links { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.footer__links a { color: var(--dark-soft); font-size: 0.9375rem; text-decoration: none; }
.footer__text { margin: 0 0 12px; color: var(--dark-muted); font-size: var(--fs-small); line-height: 1.6; }
.footer__text a { display: inline-block; padding-block: 4px; color: var(--card); font-weight: var(--fw-strong); text-decoration: none; }
.site-footer a:hover { color: var(--accent); }
/* právne údaje a veta agenta: vždy viditeľné */
.footer__legal { margin-top: clamp(36px, 4vw, 56px); padding-top: 24px; border-top: 1px solid var(--line-c); color: var(--dark-muted-2); font-size: var(--fs-micro); line-height: 1.55; }
.footer__legal p { margin: 0 0 8px; }
.footer__legal a { color: var(--dark-soft); }
.footer__copy { margin: 0 max(var(--edge), calc((100% - var(--panel-max)) / 2)); padding: 18px var(--pad) 24px; color: var(--muted); font-size: var(--fs-micro); }
@media (min-width: 720px) { .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) {
  .footer__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; }
  .footer__legal { display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
  .footer__legal p:last-child { grid-column: 2; grid-row: 1 / span 2; }
}
/* ===== 5. Hlavička a menu (UnboundX, dizajn-system 4.14) ===== */
/* Sklo je na ::before: backdrop-filter na predkovi by zavrel fixné #nav do lišty */
.logo { display: inline-flex; flex: none; }
.logo__img { display: block; width: auto; height: 32px; }
.logo--footer { margin-bottom: 18px; }
.site-header { position: sticky; top: 0; z-index: 50; padding: 8px var(--edge); }
.nav--open { z-index: 70; }
.site-header a { text-decoration: none; }
/* fokus v hlavičke neposúva stránku (scroll-padding-top) */
.site-header :is(a, button) { scroll-margin-top: -200px; }
.site-header__inner { position: relative; top: 0; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; height: 60px; max-width: 1180px; margin: 0 auto; padding: 0 8px 0 18px; transition: var(--t-2) var(--ease); }
.site-header__inner::before { content: ""; position: absolute; inset: 0; z-index: -1; border: 1px solid transparent; border-radius: var(--r-pill); transition: var(--t-2) var(--ease); }
:is(.is-scrolled, .nav--open) .site-header__inner { max-width: 1080px; }
:is(.is-scrolled, .nav--open) .site-header__inner::before { border-color: var(--line); background: rgba(255, 255, 255, 0.9); box-shadow: var(--sh-1); backdrop-filter: blur(16px) saturate(180%); }
.nav--open .site-header__inner { top: var(--hd-shift, 0); }
.site-header__actions { display: flex; align-items: center; justify-self: end; gap: 6px; }
.header-phone { display: none; margin-right: 10px; padding-block: 4px; color: var(--ink); font-size: 0.9375rem; font-weight: var(--fw-strong); white-space: nowrap; }
.header-cta { display: none; }
.nav__toggle { position: relative; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: var(--r-pill); background: none; color: var(--ink); }
.nav__toggle-bar { position: absolute; width: 17px; height: 2px; border-radius: 2px; background: currentColor; translate: 0 -3.5px; transition: var(--t-2) var(--ease-out); }
.nav__toggle-bar:last-child { translate: 0 3.5px; }
.nav--open .nav__toggle-bar { translate: none; rotate: 45deg; }
.nav--open .nav__toggle-bar:last-child { rotate: -45deg; }
.nav__list, .nav__sub { margin: 0; padding: 0; list-style: none; }
.nav__list { display: flex; }
.nav__in { position: relative; }
.nav__link { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; border-radius: var(--r-xs); background: none; color: inherit; font-weight: 500; }
.nav__sub-toggle::after { content: ""; width: .45em; height: .45em; border: solid; border-width: 0 2px 2px 0; translate: 0 -2px; rotate: 45deg; transition: var(--t-2) var(--ease); }
.is-open > .nav__sub-toggle::after { translate: 0 2px; rotate: 225deg; }
.nav__sub-link { display: block; }

/* Desktop: čiarka s pružinou (stiffness 380, damping 30), podmenu */
@media (min-width: 1024px) {
  .nav { justify-self: center; }
  .nav__list { gap: 24px; }
  .nav__item { position: relative; }
  .nav__link { padding: 4px 0; color: var(--muted); font-size: 0.9375rem; white-space: nowrap; transition: var(--t-1) var(--ease); }
  .nav__link:hover, .nav__link[aria-current], .nav__item--active > .nav__link, .is-open > .nav__link { color: var(--ink); }
  .nav__line { position: absolute; left: 0; bottom: -4px; height: 3px; border-radius: var(--r-pill); background: var(--accent); pointer-events: none; transition: .41s linear(0, .157, .438, .69, .863, .962, 1.007, 1.022, 1.021, 1.015, 1.009, 1.004, 1); }
  .nav__sub { position: absolute; top: 100%; left: -22px; min-width: 264px; margin-top: 20px; padding: 8px; border-radius: var(--r-card); background: var(--card); box-shadow: var(--sh-2); opacity: 0; visibility: hidden; transition: var(--t-1) var(--ease), visibility 0s var(--t-1); }
  .nav__sub::before { content: ""; position: absolute; inset: -22px 0 auto; height: 22px; }
  .is-open > .nav__sub { opacity: 1; visibility: visible; transition-delay: 0s; }
  .nav__sub-link { padding: 10px 14px; border-radius: var(--r-s); font-size: 0.9375rem; }
  .nav__sub-link:hover { color: var(--ink); background: var(--soft-2); }
  .nav__sub-link[aria-current] { background: var(--accent-soft); }
  .nav__toggle, .nav__end { display: none; }
}

/* Mobil a tablet: menu na celú obrazovku (--i dáva JS) */
@media (max-width: 1023.98px) {
  .nav { --hover: var(--card); --focus: var(--accent); position: fixed; inset: 0; z-index: -2; overflow: hidden; background: linear-gradient(142deg, var(--ink), var(--dark-2) 40%, #3F3613 70%, var(--ink)); visibility: hidden; clip-path: inset(0 0 100%); transition: clip-path .55s var(--ease-out), visibility 0s .55s; }
  .nav--open .nav { visibility: visible; clip-path: inset(0); transition-delay: 0s; }
  .nav::before, .nav::after { content: ""; position: absolute; z-index: -1; left: -146vw; top: -16%; width: 238vw; aspect-ratio: 1; border: 1px solid rgba(255, 255, 255, 0.06); border-radius: 50%; background: linear-gradient(160deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01) 62%); animation: hd-float 34s var(--ease) infinite paused; }
  .nav::after { left: -62vw; top: 36%; width: 148vw; animation-duration: 26s; }
  .nav--open .nav::before, .nav--open .nav::after { animation-play-state: running; }
  .nav__in { display: flex; flex-direction: column; height: 100%; padding: 96px 20px 0; overflow-y: auto; overscroll-behavior: contain; }
  .nav__in :is(a, button) { scroll-margin: 84px 0 16px; }
  /* zhora, nie na stred: rozbalené Služby neposkočia (tlačidlo ostane pod prstom) */
  .nav__list { flex: 1 0 auto; flex-direction: column; align-items: center; padding-top: clamp(16px, 10vh, 96px); text-align: center; }
  .nav__list > li, .nav__end { opacity: 0; translate: 0 16px; transition: 0s .55s; }
  .nav--open :is(.nav__list > li, .nav__end) { opacity: 1; translate: none; transition: .45s var(--ease-out) calc(.22s + var(--i, 0) * .07s); }
  .nav__link { padding: 8px 16px; color: var(--dark-soft); font-size: clamp(1.375rem, 6.6vw, 1.625rem); font-weight: 600; line-height: 1.35; }
  .nav__link[aria-current], .nav__item--active > .nav__link { color: var(--card); text-decoration: underline var(--accent); text-decoration-thickness: 3px; text-underline-offset: 8px; }
  .nav__sub { display: none; padding-bottom: 8px; }
  .is-open > .nav__sub { display: block; }
  .nav__sub-link { padding: 7px 16px; color: var(--dark-muted); font-size: 1.125rem; font-weight: 500; }
  .nav__sub-link[aria-current] { color: var(--card); font-weight: 600; }
  .nav__end { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 24px 0 calc(16px + env(safe-area-inset-bottom)); }
  .nav__contact { display: flex; margin: 0; }
  .nav__contact a { display: flex; padding: 12px; color: var(--dark-muted); }
  .nav__line { display: none; }
}
@keyframes hd-float { 33% { translate: 30px -22px; scale: 1.02; } 66% { translate: -30px 22px; } }
@media (min-width: 520px) { .header-cta { display: inline-flex; } }
@media (min-width: 768px) { .site-header { padding-block: 12px; } }
@media (min-width: 1180px) { .header-phone { display: block; } }

/* Bez JS: podmenu cez hover a fokus, na mobile tmavý blok pod lištou */
@media (scripting: none) {
  .nav__toggle { display: none; }
  .nav__item:is(:hover, :focus-within) > .nav__sub { opacity: 1; visibility: visible; }
  .site-header__inner::before { border-color: var(--line); background: rgba(255, 255, 255, 0.9); box-shadow: var(--sh-1); }
}
@media (scripting: none) and (max-width: 1023.98px) {
  .site-header { position: static; }
  /* sklo len okolo lišty, tmavé menu nad ním (inak biely ovál cez odkazy) */
  .site-header__inner { grid-template-rows: 60px auto; height: auto; }
  .site-header__inner::before { bottom: auto; height: 60px; }
  .nav { position: static; z-index: 0; grid-area: 2 / 1 / 3 / -1; margin: 0 0 8px -10px; border-radius: var(--r-card); visibility: visible; clip-path: none; }
  .nav__list { padding-top: 0; }
  .nav__in { padding-top: 16px; }
  .nav__list > li, .nav__end { opacity: 1; translate: none; }
  .nav__sub { display: block; }
}
/* Obmedzený pohyb: len prelnutie 0,15 s (zvyšok vypína 90-pohyb.css) */
@media (max-width: 1023.98px) and (prefers-reduced-motion: reduce) {
  .nav { clip-path: none; opacity: 0; transition: opacity .15s, visibility 0s .15s !important; }
  .nav--open .nav { opacity: 1; transition-delay: 0s !important; }
}
/* ===== 45. Krokový formulár (initKroky v 00-jadro.js; dizajn-system 6.2 bod 6) ===== */
/* Za 17 (gap .form__grid) a 04 (dlaždica je .btn--secondary) */
.form__tiles { gap: 8px; }
.form__tile { justify-content: flex-start; min-height: 56px; padding: 12px 16px; border-radius: var(--r-s); font-size: 1rem; font-weight: var(--fw-display); text-align: left; }
.form__tile[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--card); }
.form__pruh { flex: 1; height: 4px; border-radius: var(--r-pill); background: linear-gradient(var(--ink), var(--ink)) 0 / var(--p, 0%) 100% no-repeat var(--line); transition: background-size var(--t-2) var(--ease); }
.form__error { color: var(--err); font-size: var(--fs-small); font-weight: var(--fw-strong); }
.form--kroky .form__check { font-size: var(--fs-micro); }
.form--kroky .form__hint { flex-basis: 100%; }
.form--kroky [data-krok] > .form__hint { margin-bottom: 12px; }
/* prechod krokov: cineFade, pri reduced-motion bez pohybu */
.form--kroky :is([data-krok], [data-krok-sprava-blok], [data-krok-cas-riadok]) { animation: cineFade var(--t-4) var(--ease-out); }
/* nepovinná správa pod doplňujúcou otázkou (krok 2) a Ďalej po návrate */
[data-krok-pokracuj] { margin-top: 6px; }
@keyframes cineFade { from { opacity: 0; translate: 0 16px; } }
@media (prefers-reduced-motion: reduce) { .form--kroky :is([data-krok], [data-krok-sprava-blok], [data-krok-cas-riadok]) { animation: none; } }

/* ===== 50. Služby na Domove, ARMOR (dizajn-system 4.20): živú podobu zapína JS triedou .is-live ===== */
/* Sklo kariet --dark-2 40 %: text aspoň 4,5:1 aj pri zrne a žiare */
.am-dots,.am-grain{display:none}
.am-origin{display:block;width:64px;height:6px;margin:-8px auto 0;border-radius:3px;background:var(--accent)}
.am-panel{--text-muted:var(--dark-soft);--box:#2B2F3866;margin:var(--head-gap) max(var(--edge),calc(50% - var(--panel-max)/2)) 0;border-radius:var(--r-panel);background:radial-gradient(120% 90% at 85% 12%,#50420E,#0000 60%),radial-gradient(90% 80% at 12% 88%,#332D16,#0000 65%),var(--ink)}
.am-cards{position:relative;max-width:calc(var(--content) + 2*var(--pad));margin:auto;padding:var(--panel-y) var(--pad)}
.am-panel .card{--i:clamp(56px,6vw,72px);position:relative;isolation:isolate;border:1px solid var(--glass-dark-line);transition:translate var(--t-3) var(--ease),border-color var(--t-3) var(--ease)}
.am-panel .card--finance{border-color:#FFD21E80}
/* žiara za kurzorom (--accent 8 %), --mx a --my nastavuje JS */
.am-panel .card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:radial-gradient(440px at var(--mx) var(--my),#FFD21E14,#0000 70%);opacity:0;transition:opacity var(--t-3)}
.am-panel .card__eyebrow{color:var(--accent)}
.am-panel :is(.card__eyebrow,.card__title){margin-right:calc(var(--i) + 8px)}
.am-panel .card__price-value{color:var(--ink)}
.am-panel .card__icon{position:absolute;top:24px;right:24px;width:var(--i);height:var(--i);margin:0;background:none;color:var(--card);opacity:.65;transition:scale var(--t-3),opacity var(--t-3)}
.am-panel .card__icon svg{width:100%;height:100%;stroke-width:4}
@media (hover:hover){
.am-panel .card:hover{translate:0 -6px;border-color:#FFD21E80}
.am-panel .card:hover::before,.am-panel .card:hover .card__icon{opacity:1}
.am-panel .card:hover .card__icon{scale:1.08}
}
/* kreslenie ikon: .am-ready a .is-drawn pridá JS */
.am-ready .am-stroke{stroke-dasharray:1 2;stroke-dashoffset:1.01}
.am-ready .am-fill{opacity:0}
.am-ready .is-drawn .am-stroke{stroke-dashoffset:0;transition:stroke-dashoffset 1.5s var(--ease)}
.am-ready .is-drawn .am-fill{opacity:1;transition:opacity .4s}
@media screen{
.is-live{padding-block:0}
.is-live .am-feature__sticky{position:sticky;top:var(--am-top);height:calc(100vh - var(--am-top));overflow:hidden;overflow:clip}
.is-live :is(.am-dots,.am-grain){display:block;position:absolute;inset:0;width:100%;height:100%}
.am-nogl .am-grain{display:none}
.is-live .am-intro{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center}
.is-live .am-origin{position:relative;z-index:2}
.is-live .am-panel{position:absolute;inset:0;z-index:1;margin:0;clip-path:inset(50%)}
.is-live .am-cards{transform-origin:50% 0;will-change:transform}
}
@media screen and (min-width:1000px){
.is-live .cards--services{grid-template-columns:1fr 1fr}
.is-live .cards--services .card{grid-column:auto;min-height:400px}
.is-live .cards--services .card:nth-child(even){margin:64px 0 -64px}
.is-live .cards--services .card--finance{grid-column:1/-1;min-height:0;margin-top:64px}
}
@media print{.am-cards{transform:none!important}.am-panel *{color:#000!important}.am-panel .card{border-color:#999}}
/* ===== 60. Tipalti: svetelné pásiky po mriežke (dizajn-system 4.5) ===== */
/* span.streak(.streak--v) s aria-hidden v paneli s mriežkou, na čiare 56 px */
.streak { position: absolute; z-index: -1; top: var(--y, 112px); left: 0; width: 40%; height: 1px; pointer-events: none; background: linear-gradient(90deg, #0000, var(--accent), #0000); box-shadow: 0 0 12px var(--accent); opacity: 0.6; transform: translateX(-100%); animation: streak 7s linear infinite; }
.streak--v { top: 0; left: 672px; left: round(down, 78%, 56px); width: 1px; height: 40%; background: linear-gradient(#0000, var(--accent), #0000); transform: translateY(-100%); animation: streak-v 9s -4s linear infinite; }
@keyframes streak { to { transform: translateX(260%); } }
@keyframes streak-v { to { transform: translateY(260%); } }
/* Domov: zvislý medzi textom a fotkou */
.hero--home > .streak { --y: 168px; }
.hero--home > .streak--v { left: round(down, 55%, 56px); }
.cta-final > .streak { --y: 56px; }
@media (max-width: 719px), (prefers-reduced-motion: reduce), print { .streak { display: none; } }
/* ===== 61. Prvky NEXIO: cineFade (4.8) a posuvník kariet (4.9) ===== */
/* cineFade: triedu pridá 61-prvky.js (nie pri reduced-motion) */
@keyframes cineFade { from { opacity: 0; transform: translateY(16px); } }
.is-cine { animation: cineFade var(--t-4) var(--ease-out); }

/* Posuvník: pás so scroll-snap pod 720 px (tlač ostáva mriežka) */
@media screen and (max-width: 719.98px) {
  .post-list { --bleed: var(--gutter); display: flex; margin-inline: calc(-1 * var(--bleed)); padding: 6px var(--bleed); margin-top: -6px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--bleed); scroll-behavior: smooth; scrollbar-width: none; }
  :is(.section--light, .section--dark) .post-list { --bleed: var(--pad); }
  .post-list::-webkit-scrollbar { display: none; }
  .post-list > .post { flex: 0 0 min(82vw, 360px); scroll-snap-align: start; }
  .post-list:has(+ .slider-ctl:not([hidden])) { margin-bottom: 16px; }
}
/* Ovládanie (Tipalti): lišta priebehu a šípky, len pri pretečení */
.slider-ctl { display: flex; align-items: center; gap: 8px; margin: 0 0 24px; }
.slider-ctl[hidden] { display: none; }
.slider-ctl__bar { display: flex; flex: 1 1 auto; gap: 6px; margin-right: 8px; }
.slider-ctl__bar span { flex: 1 1 0; height: 4px; border-radius: var(--r-pill); background: rgba(22, 24, 29, 0.15); transition: background-color var(--t-3) var(--ease); }
.slider-ctl__bar .is-on { background: var(--ink); }
.slider-ctl__btn { display: grid; place-items: center; flex: 0 0 auto; width: 48px; height: 48px; padding: 0; border: 0; border-radius: var(--r-s); background: rgba(22, 24, 29, 0.08); color: var(--ink); cursor: pointer; transition: background-color var(--t-2) var(--ease); }
.slider-ctl__btn::before { content: ""; width: 18px; height: 18px; background: currentColor; -webkit-mask: var(--arrow) center / contain no-repeat; mask: var(--arrow) center / contain no-repeat; }
.slider-ctl__btn--prev::before { transform: scaleX(-1); }
.slider-ctl__btn:hover { background: rgba(22, 24, 29, 0.14); }
.slider-ctl__btn[aria-disabled="true"] { background: rgba(22, 24, 29, 0.04); cursor: default; }
.slider-ctl__btn[aria-disabled="true"]::before { opacity: 0.5; }  /* fokus ostáva plný */
@media (prefers-reduced-motion: reduce) { .post-list { scroll-behavior: auto; } }
/* ===== 70. Kampaň /danove-priznanie/ a podstránky priznania (dizajn-system 5.2, 5.3) ===== */
/* Hero kampane: tlačidlá pri 390 x 844 v prvej obrazovke */
.page--kampan .hero { padding: clamp(32px, 1rem + 4vw, 72px) 0 var(--panel-y); }
.page--kampan .hero__grid { grid-template-columns: minmax(0, 1fr); }
.page--kampan .hero__eyebrow { justify-self: start; }
@media (max-width: 599px) { .page--kampan .hero > .container { padding-inline: 16px; } }
/* Dátumy na mobile: dátum a popis vedľa seba */
@media (max-width: 559px) {
  .page--kampan .date { grid-template-columns: 8.5rem minmax(0, 1fr); align-items: center; gap: 12px; padding: 12px 16px; }
  .page--kampan .date__day { font-size: 1.25rem; }
}
/* Od 1 024 px dátumy ako stĺpec vpravo */
@media (min-width: 1024px) {
  .page--kampan .hero__body { display: grid; grid-template-columns: minmax(0, 1fr) 280px; column-gap: clamp(48px, 6vw, 96px); }
  .page--kampan .hero__body > * { grid-column: 1; }
  .page--kampan .hero .dates { grid-column: 2; grid-row: 1 / span 7; align-self: center; grid-template-columns: minmax(0, 1fr); margin: 0; }
}

/* Kto vám priznanie urobí: menšia fotka na mobile */
@media (max-width: 799px) { .page--kampan #kto-robi .about__media { max-width: 240px; } }

.page--kampan #pre-koho .faq { margin-bottom: 40px; }

/* Kvíz na stred */
:is(.page--kampan, .page--danove-priznanie-kto-musi-podat) .quiz { max-width: 880px; margin-inline: auto; }

/* Po zaplatení: nadpis vľavo, kroky vpravo */
@media (min-width: 960px) {
  .page--kampan .after { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 16px var(--gap); align-items: start; margin-top: 64px; }
  .page--kampan .after__title { position: sticky; top: calc(var(--header-h) + 24px); margin: 0; padding-top: 8px; }
}

/* Podstránky priznania: odstup nadpisu za meta riadkom a calloutom */
[class*="page--danove-priznanie"] :is(.meta-line, .callout) + .section__title { margin-top: clamp(32px, 2rem + 2vw, 56px); }
/* ===== 71. Služby a podstránky služieb (dizajn-system 4.2, 4.3, 5.3) ===== */
/* Čo nie je v cene: sivý krúžok s čiarkou */
.checklist--minus .checklist__item::before { background: var(--line); }
.checklist--minus .checklist__item::after { left: 7px; top: 12px; width: 10px; height: 0; border: 0; border-top: 2px solid var(--ink); rotate: none; }

/* Čitateľná dĺžka riadka */
:is(.page--sluzby, .page--vedenie-uctovnictva, .page--danova-evidencia-szco, .page--mzdy-a-personalistika, .page--danova-optimalizacia, .page--zmena-uctovnika, .page--uctovnictvo-poprad, .page--financne-sluzby) .section > .container > p:not([class]) { max-width: 48rem; }

/* Dlaždice služieb mimo Domova (Domov má ARMOR v .am-cards) */
@media (min-width: 1000px) {
  .container > .cards--services > .card:nth-child(-n+2) .card__icon { width: 64px; height: 64px; }
  .container > .cards--services > .card:nth-child(-n+2) .card__icon svg { width: 36px; height: 36px; }
  .container > .cards--services > .card:nth-child(n+3) .card__price-note { flex-basis: 100%; }
}
/* 1000 až 1149 px: dva stĺpce (inak sa tlačidlo finančnej karty láme) */
@media (min-width: 1000px) and (max-width: 1149px) {
  .container > .cards--services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .container > .cards--services > .card { grid-column: auto; }
  .container > .cards--services > .card--finance { grid-column: 1 / -1; }
}
/* ===== 72. Podstránky (dizajn-system 5.4 až 5.6) ===== */
/* Nadpis vľavo (lepkavý), obsah vpravo */
@media (min-width: 960px) {
  .dvojstlpec, .page--faq .co-nerobime { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(48px, 6vw, 96px); align-items: start; }
  .dvojstlpec > * { grid-column: 2; }
  .dvojstlpec > .section__title { grid-column: 1; grid-row: 1 / span 9; position: sticky; top: calc(var(--header-h) + 24px); margin: 0; font-size: clamp(2rem, 1.25rem + 2vw, 2.75rem); }
  .dvojstlpec > .section__lead { margin-top: 0; }
  .page--faq .co-nerobime .callout--legal { grid-column: 2; }
}

/* Kroky v riadkoch s čiarami */
.steps--riadky { display: block; border-bottom: 1px solid var(--line-c); }
.steps--riadky .step { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 20px; padding: 24px 0; border-top: 1px solid var(--line-c); border-radius: 0; background: none; }
.steps--riadky .step::before { grid-row: 1 / span 2; margin: 0; }
.steps--riadky .step__title { margin: 9px 0 4px; }
@media (min-width: 960px) {
  .steps--riadky .step { grid-template-columns: 56px minmax(0, 4fr) minmax(0, 7fr); column-gap: 32px; padding: 32px 0; }
  .steps--riadky .step::before { grid-row: auto; }
  .steps--riadky .step__text { font-size: 0.9375rem; }
}
.page--ako-to-funguje .steps + h3, .page--cennik .table-wrap + h3 { margin-top: 48px; }

/* O nás: certifikáty v ráme, hodnoty 3 + 2 */
.page--o-nas #kvalifikacia .card img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; padding: 16px; border: 1px solid var(--line); border-radius: var(--r-s); background: var(--soft); }
.page--o-nas #kvalifikacia .card a:has(> img) { display: block; border-radius: var(--r-s); }
@media (min-width: 960px) {
  .page--o-nas #hodnoty .cards { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .page--o-nas #hodnoty .card { grid-column: span 2; }
  .page--o-nas #hodnoty .card:nth-child(n+4) { grid-column: span 3; }
}

/* Kontakt: telefón a e-mail väčšie */
.page--kontakt #kontakty .card__title + .card__text:has(> a) { color: var(--text); font-size: var(--fs-h4); font-weight: var(--fw-strong); letter-spacing: var(--ls-h4); }
.page--kontakt #kontakty .card__text > a { text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 5px; }
.page--kontakt #danove-priznanie { padding-block: clamp(32px, 4vw, 56px); }

/* FAQ: obsah ako pilulky */
.prose .obsah-odkazy { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; }
.obsah-odkazy li { margin: 0; }
.obsah-odkazy a { display: inline-flex; align-items: center; min-height: 44px; padding: 10px 18px; border-radius: var(--r-pill); background: var(--soft); font-weight: var(--fw-display); line-height: 1.3; text-decoration: none; }

/* Doklady: priečinky v dvoch stĺpcoch */
.page--doklady-kompletne fieldset.form__row { gap: 10px 24px; }
@media (min-width: 720px) { .page--doklady-kompletne fieldset:has([type="checkbox"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* 404 */
.hero--404 { display: flex; align-items: center; min-height: clamp(360px, 60vh, 600px); }
/* ===== 73. Blog a právne stránky (dizajn-system 5.7, 5.8) ===== */
/* Článok: zdroje drobné a tlmené */
.page--article .prose a[target="_blank"] { color: var(--text-muted); font-size: var(--fs-small); }
.page--article .prose a[target="_blank"]:hover { color: var(--hover); }
/* Callout s tlačidlom ako banner */
@media (min-width: 720px) {
  .page--article .callout:has(.btn--primary) { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-auto-flow: dense; align-items: center; gap: 4px 32px; }
  .page--article .callout:has(.btn--primary) > * { margin: 0; }
  .page--article .callout > :is(.btn, p:has(> .btn)) { grid-column: 2; grid-row: 1 / span 2; }
}
/* Porovnávacia tabuľka: od 1 000 px širšia ako stĺpec */
@media (min-width: 1000px) {
  .page--article .prose .table-wrap:has(.compare) { width: min(var(--content), 100vw - 2 * var(--gutter) - 16px); }
}

/* Právne stránky bez animácií */
.hero[data-anim="off"] .hero__body > * { animation: none; }
/* ===== 74. Domov (dizajn-system 5.1) ===== */
/* Hero: pri 1280 x 800 je v prvej obrazovke aj riadok 80+ klientov */
.hero--home { padding-top: clamp(3rem, 1rem + 3.2vw, 4rem); }
.hero--home .hero__title { margin-bottom: 20px; }
.hero--home .hero__actions { margin: 28px 0 0; }
/* ===== 24. Pohyb (dizajn-system 2.7) ===== */
@keyframes heroIn { from { opacity: 0; transform: translateY(26px); } }
@keyframes popMsg { 0% { opacity: 0; transform: translateY(28px) scale(0.7); } 70% { opacity: 1; transform: translateY(-5px) scale(1.05); } }
@keyframes floatY { 50% { transform: translateY(-7px); } }
@keyframes diamondFloat { 0%, 100% { transform: rotate(45deg); } 50% { transform: rotate(45deg) translateY(-9px); } }
/* GSAP (animacie.js): CSS nič neskrýva */
html.lenis { scroll-behavior: auto; }
.w-m, .w { display: inline-block; }
.w-m { clip-path: inset(-0.4em -0.3em -0.2em); }
/* paralaxa cez translate, skladá sa s transform */
html.anim :is(.hero-badge, .hero-diamond) { translate: 0 var(--py, 0px); }
.anim-zoom { overflow: hidden; border-radius: var(--r-s); }
:is(.persona--bok, .persona--hero, .personas *).anim-zoom { border-radius: var(--r-card); }
/* WCAG 2.2.2: samé sa hýbuce ozdoby sa zastavia do 5 s (jeden cyklus), potom stoja v pokojovej polohe */
.hero-badge--light, .hero-badge--dark { animation-iteration-count: 1, 1; }
.hero-diamond, .campaign-block__label, .streak { animation-iteration-count: 1; }
.streak:not(.streak--v) { animation-duration: 5s; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
/* ===== 25. Tlač ===== */
@media print {
  @page { margin: 15mm 14mm; }
  .site-header, .cookie-bar, .sticky-cta, .campaign-bar, .breadcrumbs, .skip-link, .btn, .hero__actions, .cta-final, .form, .site-footer, .hero-visual, .hero-clients, .campaign-block, .persona, .slider-ctl { display: none !important; }
  /* tmavé plochy biele, text čierny */
  * { --text: #000 !important; --text-muted: #333 !important; --line-c: #999 !important; --box: #fff !important; --hover: #000 !important; --bar: #000 !important; --label-c: #000 !important; }
  body { background: #fff; color: #000; font-size: 11pt; line-height: 1.45; }
  .site-card { overflow: visible; }
  .section { margin: 0 !important; padding: 12pt 0 !important; overflow: visible !important; border-radius: 0 !important; background: #fff !important; color: #000 !important; }
  .section::before, .section::after, .am-feature canvas { display: none !important; }
  .am-feature, .am-feature__sticky { position: static !important; height: auto !important; }
  .am-panel { clip-path: none !important; transform: none !important; background: #fff !important; color: #000 !important; }
  .text-zlato { background: none !important; color: #000 !important; -webkit-text-fill-color: currentColor !important; }
  .date { border-color: #999; }
  /* bez žltých plôch */
  .hero__eyebrow { text-decoration: none; font-weight: 600; }
  .answer { border: 1px solid #999; border-left-width: 4px; background: #fff; color: #000; }
  .table th { background: #fff; color: #000; }
  .table-wrap { overflow: visible; }
  .page--article .prose .table-wrap { width: auto !important; }
  .date__day, .price-card--featured :is(.price-card__new, .price-card__save) { color: #000; }
  .container, .container--narrow, .section > .container { max-width: none; padding: 0 !important; }
  .prose { max-width: none; }
  :is(h2, h3), .am-intro { break-after: avoid; break-inside: avoid; }
  .prose p, .prose li { orphans: 3; widows: 3; }
  .prose a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #444; }
  .faq-item { break-inside: avoid; }
  .faq-item summary { padding-right: 0; }
  .faq-item summary::after, .post::after { display: none; }
  .faq-item__body { display: block; color: #000; }
  /* zatvorené details: odpovede aj bez JS */
  .faq-item::details-content { content-visibility: visible; display: block; }
  .doplnit { border: 1px dashed #000; background: #fff; }
  .callout, .card, .step, .table tr { break-inside: avoid; }
  .callout, .card, .table-wrap, .step, .price-card { border: 1px solid #999; background: #fff !important; }
  *, *::before, *::after { animation: none !important; }
  /* poistka: inline štýly GSAP netlačiť prázdne */
  .anim [style*="opacity"]:not(.am-dots, .am-origin) { opacity: 1 !important; transform: none !important; }
}