/* STAVPORTAL V5 – vizuálny systém (OWNER GO V5, revízia 2). Jedna vrstva za V4 (inc/v5.php); uzamknuté súbory R4.3
   sa nemenia. Všetko je v mennom priestore .v5 / .v5-* – okrem pätičky (.ftr), ktorá je spoločná pre celý web.
   Farby iba z tokenov R4.3 (--paper, --sunk, --surface, --ink, --ink-2, --muted, --line, --cu, --cu-ink, --night…)
   a V4 (--v4-ink, --v4-cu…), preto platí svetlý aj tmavý režim bez ďalších pravidiel. Značkové farby Ink · Copper · Warm White.
   Hlas: Bebas Neue (nadpisy), fakty: Poppins. Jediný ozdobný motív: krátka medená línia (bez pravítok, mierok a hľadáčikov).
   Kontrasty (WCAG 2.2 AA): Ink na Copper 5,12 : 1 · --cu iba pre text ≥ 24 px alebo grafiku, menší text --cu-ink. */

.v5, .v5-art {
  --v5-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --v5-gut: clamp(18px, 4vw, 48px);
  --v5-sec: clamp(72px, 8.5vw, 128px);
  --v5-t-hero: clamp(56px, 7vw, 108px);
  --v5-t-xl: clamp(52px, 6.4vw, 100px);
  --v5-t-l: clamp(48px, 6.6vw, 104px);
  --v5-t-m: clamp(40px, 5vw, 72px);
  --v5-t-s: clamp(28px, 2.8vw, 40px);
  --v5-t-lead: clamp(17px, 1.3vw, 20px);
  --v5-r: 18px;
  --v5-shadow: 0 1px 2px rgb(var(--shadow) / .06), 0 18px 40px -24px rgb(var(--shadow) / .3);
  --v5-on-ph: #fafaf9;
  --v5-ph-shade: rgb(13 13 14 / .82);
  overflow-x: clip;
}

/* ---------- rozloženie ---------- */
.v5-wrap { max-width: calc(var(--wrap, 1280px) + 2 * var(--v5-gut)); margin-inline: auto; padding-left: max(var(--v5-gut), env(safe-area-inset-left, 0px)); padding-right: max(var(--v5-gut), env(safe-area-inset-right, 0px)); }
.v5-sec { padding-block: var(--v5-sec); }
.v5-sec-s { padding-block: clamp(48px, 6vw, 88px); }
.v5-sunk { background: var(--sunk); }
.v5-stack { display: grid; gap: 24px; align-content: start; min-width: 0; }
.v5-stack-s { display: grid; gap: 12px; align-content: start; min-width: 0; }
.v5-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.v5-split.v5-top { align-items: start; }
.v5-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.v5-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.v5-grid4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.v5-sec-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto); gap: 20px 48px; align-items: end; margin-bottom: clamp(36px, 4.5vw, 56px); }
.v5-sec-head > * { min-width: 0; }
.v5-sec-head .v5-lead { max-width: 44ch; }
.v5-sec-head.v5-center { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.v5-sec-head.v5-center .v5-lead { margin-inline: auto; }
.v5-mt, .v5 .v5-mt { margin-top: 24px; } /* .v5 p { margin: 0 } nesmie zrušiť rozostup */
.v5-mt-l, .v5 .v5-mt-l { margin-top: clamp(32px, 4vw, 56px); }
@media (max-width: 1080px) { .v5-grid4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .v5-split, .v5-grid3, .v5-sec-head { grid-template-columns: minmax(0, 1fr); }
  .v5-sec-head { align-items: start; }
}
@media (max-width: 640px) { .v5-grid2, .v5-grid4 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- typografia ---------- */
.v5 :is(.v5-d-hero, .v5-d-xl, .v5-d-l, .v5-d-m, .v5-d-s) { font-family: var(--v5-display); font-weight: 400; font-synthesis: none; letter-spacing: .005em; text-transform: uppercase; text-wrap: balance; margin: 0; color: inherit; }
.v5 .v5-d-hero { font-size: var(--v5-t-hero); line-height: .88; }
.v5 .v5-d-xl { font-size: var(--v5-t-xl); line-height: .88; }
.v5 .v5-d-l { font-size: var(--v5-t-l); line-height: .9; }
.v5 .v5-d-m { font-size: var(--v5-t-m); line-height: .92; }
.v5 .v5-d-s { font-size: var(--v5-t-s); line-height: .95; }
.v5 .v5-cu { color: var(--cu); }
.v5 h3 { font: 600 clamp(18px, 1.4vw, 20px)/1.3 var(--font); letter-spacing: -.005em; margin: 0; }
.v5 p { margin: 0; }
.v5-lead { font: 400 var(--v5-t-lead)/1.55 var(--font); color: var(--ink-2); max-width: 46ch; }
.v5-small { font-size: 13.5px; line-height: 1.55; color: var(--muted); }
.v5-small a, .v5-micro a, .v5-lead a, .v5-pv-line a, .v5-card a:not(.btn) { color: inherit; text-underline-offset: 4px; }
.v5-micro { font-size: 14px; color: var(--muted); }
.v5-micro a { color: var(--ink); font-weight: 500; }
/* kicker: krátka medená línia */
.v5-kicker { display: inline-flex; align-items: center; gap: 12px; margin: 0; font: 600 12px/1.2 var(--font); letter-spacing: .18em; text-transform: uppercase; color: var(--cu-ink); }
.v5-kicker::before { content: ""; flex: none; width: 28px; height: 2px; background: var(--cu); }
.v5-center .v5-kicker { justify-content: center; }
.v5 .crumbs { font-size: 13px; }

/* ---------- tlačidlá: systém V4 (Primary = data-open, ostatné Secondary) ---------- */
.v5-btns { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.v5 .btn .arr { transition: transform .15s; }
.v5 .btn:hover .arr { transform: translateX(3px); }
@media (max-width: 520px) { .v5-btns > .btn { flex: 1 1 100%; } }
/* úvod, hero (variant A, audity V5): „Zadať dopyt“ je jediné tlačidlo, „Orientačná cena“ sekundárny odkaz */
.v5-link-sec { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 6px; font: 600 16px/1.2 var(--font); color: var(--ink); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 6px; text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); }
.v5-link-sec:hover { text-decoration-color: currentColor; }
.v5-link-sec:focus-visible { outline: 2.5px solid var(--v4-focus, var(--cu)); outline-offset: 2px; border-radius: 6px; }
.v5-link-sec svg { width: 18px; height: 18px; }
@media (max-width: 520px) { .v5-btns > .v5-link-sec { flex: 1 1 100%; justify-content: center; } }

/* ---------- karty: jeden komponent pre výhody, cesty, pravidlá ---------- */
.v5-card { display: grid; gap: 12px; align-content: start; padding: clamp(22px, 2.4vw, 30px); border-radius: var(--v5-r); background: var(--surface); border: 1px solid var(--line); border-color: color-mix(in srgb, var(--ink) 12%, transparent); color: var(--ink); min-width: 0; }
.v5-card p { color: var(--ink-2); }
.v5-card::before { content: ""; width: 28px; height: 2px; background: var(--cu); }
.v5-card.v5-plain::before { display: none; }
.v5-sunk .v5-card { background: var(--paper); }
.v5-card .v5-ico { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--cu-wash); color: var(--cu-ink); }
.v5-card .v5-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v5-card:has(.v5-ico)::before, .v5-card:has(> .v5-kicker:first-child)::before { display: none; }
.v5-list { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 8px; }
.v5-list li { position: relative; padding-left: 22px; color: var(--ink-2); font-size: 15px; }
.v5-list li::before { content: ""; position: absolute; left: 0; top: .72em; width: 12px; height: 2px; background: var(--cu); }
.v5-card-cta { margin-top: auto; padding-top: 8px; }
.v5-grid2 > .v5-card, .v5-grid3 > .v5-card, .v5-grid4 > .v5-card { height: 100%; }
.v5-card.v5-flex { display: flex; flex-direction: column; }
.v5-card.v5-flex > * + * { margin-top: 12px; }

/* ---------- fotografie: jedna fotografia jedného projektu, bez ozdôb ---------- */
.v5-ph { position: relative; margin: 0; overflow: hidden; border-radius: var(--v5-r); background: var(--sunk); }
.v5-ph img { display: block; width: 100%; height: 100%; object-fit: cover; filter: var(--img-filter); }
.v5-r-4x5 { aspect-ratio: 4 / 5; }
.v5-r-4x3 { aspect-ratio: 4 / 3; }
.v5-ph figcaption { position: absolute; inset: auto 0 0; z-index: 2; padding: 48px 22px 18px; background: linear-gradient(transparent, var(--v5-ph-shade)); color: var(--v5-on-ph); font: 500 13px/1.4 var(--font); }
.v5-ph figcaption b { display: block; margin-bottom: 2px; font: 600 15px/1.3 var(--font); }

/* ---------- úvod: hero ---------- */
.v5-hero { padding-block: clamp(28px, 4.5vw, 72px) clamp(56px, 7vw, 104px); }
.v5-hero-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.v5-hero-copy { display: grid; gap: 26px; min-width: 0; }
.v5-hero-ph.v5-r-4x3 { max-height: 600px; }
@media (max-width: 900px) { .v5-hero-grid { grid-template-columns: minmax(0, 1fr); } }

/* tri prínosy pod hero */
.v5-gains { border-block: 1px solid var(--line); }
.v5-gains-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.v5-gain { display: grid; gap: 8px; align-content: start; padding: clamp(24px, 3vw, 36px) clamp(18px, 2.4vw, 32px) clamp(24px, 3vw, 36px) 0; }
.v5-gain + .v5-gain { padding-left: clamp(18px, 2.4vw, 32px); border-left: 1px solid var(--line); }
.v5-gain::before { content: ""; width: 28px; height: 2px; background: var(--cu); margin-bottom: 6px; }
/* balík 001–016 (002): ikona namiesto medenej linky, nadpisy h3 */
.v5-gain:has(.v5-ico)::before { display: none; }
.v5-gain .v5-ico { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--cu-wash); color: var(--cu-ink); margin-bottom: 4px; }
.v5-gain .v5-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v5-gain :is(h2, h3) { font: 600 clamp(18px, 1.5vw, 21px)/1.3 var(--font); letter-spacing: -.01em; margin: 0; }
.v5-gain p { color: var(--ink-2); font-size: 15px; max-width: 36ch; }
@media (max-width: 760px) {
  .v5-gains-grid { grid-template-columns: minmax(0, 1fr); }
  .v5-gain { padding: 22px 0; }
  .v5-gain + .v5-gain { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
}

/* ---------- Čo vám spolupráca prinesie (záložky R4.3 data-biz) ---------- */
.v5-ben { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.v5-ben-ph { position: sticky; top: 104px; }
.v5-ben-ph .v5-ph { max-height: 620px; }
.v5-ben-ph figure[hidden] { display: none; }
/* Ilustračná ukážka portálu (OWNER, archív „Ilustrácia portálov“): grafická vizualizácia skutočných funkcií ERP s fiktívnymi údajmi,
   nie snímka obrazovky. Bez veľkej podkladovej plochy: karty portálu ležia priamo na ploche sekcie, oddelené iba jemnou
   hranou, tieňom a nenápadným medeným nádychom. Meď ako akcent. Rozloženie podľa šírky plochy (kontajner).
   Investor aj Majster sú v tej istej bunke mriežky – prepnutie záložky nemení výšku sekcie. */
.v5-ben-ph { display: grid; }
.v5-ben-ph > .v5-pi, .v5-ben-ph > .v5-pi[hidden] { grid-area: 1 / 1; display: grid !important; }
.v5-ben-ph > .v5-pi[hidden] { visibility: hidden; }
.v5-pi { margin: 0; gap: 12px; align-content: start; min-width: 0; }
.v5-pi figcaption { font-size: 13px; line-height: 1.5; color: var(--muted); max-width: 60ch; }
.v5-pi figcaption b { color: var(--ink); font-weight: 600; }
.v5-pi-stage { container-type: inline-size; position: relative; display: grid; gap: 16px; padding: 4px 0 8px; color: var(--ink); }
/* jemný tónový nádych za kartami – prechod do priehľadna vnútri prvku, bez hrán a bez orezania */
.v5-pi-stage::before { content: ""; position: absolute; inset: 6% -4% 0 18%; border-radius: 50%; background: radial-gradient(closest-side, color-mix(in srgb, var(--cu) 14%, transparent), transparent); pointer-events: none; }
.v5-pi-top { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 10px 12px; flex-wrap: wrap; }
.v5-pi-kick { display: inline-flex; align-items: center; gap: 10px; font: 600 12px/1.2 var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--cu-ink); }
.v5-pi-kick::before { content: ""; width: 24px; height: 2px; background: var(--cu); }
/* štítok musí byť čitateľný na ploche sekcie v oboch režimoch */
.v5-pi-ill { font: 600 11.5px/1 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); border: 1px solid var(--line-2); border-radius: 999px; padding: 6px 10px; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.v5-pi-grid { position: relative; display: grid; gap: 12px; }
.v5-pi-card { min-width: 0; border-radius: 14px; background: var(--surface); color: var(--ink); border: 1px solid color-mix(in srgb, var(--ink) 9%, transparent); box-shadow: 0 1px 2px rgb(0 0 0 / .05), 0 18px 36px -22px rgb(0 0 0 / .28); }
.v5-pi-bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); border-radius: 14px 14px 0 0; box-shadow: inset 0 2px 0 var(--cu); }
.v5-pi-mark { font: 400 22px/1 var(--v5-display); letter-spacing: .03em; }
.v5-pi-logo { display: block; height: 20px; width: auto; filter: var(--logo-filter); } /* 003: skutočné logo, v tmavom režime invertované */
.v5-pi-sep { width: 1px; height: 18px; background: var(--line-2); }
.v5-pi-role { font: 600 11px/1.2 var(--font); letter-spacing: .14em; text-transform: uppercase; border: 1px solid var(--line-2); border-radius: 6px; padding: 3px 7px 2px; }
.v5-pi-body { display: grid; gap: 3px; padding: 16px; }
.v5-pi-no { font: 500 12px/1.4 ui-monospace, "SF Mono", Menlo, Consolas, monospace; color: var(--ink-2); }
.v5-pi-title { font: 600 19px/1.25 var(--font); }
.v5-pi-mu { display: block; font-size: 13px; line-height: 1.4; color: var(--ink-2); }
.v5-pi-steps { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.v5-pi-steps li { position: relative; padding-top: 18px; font-size: 12.5px; line-height: 1.3; color: var(--ink-2); }
.v5-pi-steps li::before { content: ""; position: absolute; top: 5px; left: 0; right: -6px; height: 2px; background: var(--line); }
.v5-pi-steps li:last-child::before { right: 0; }
.v5-pi-steps li::after { content: ""; position: absolute; top: 0; left: 0; width: 12px; height: 12px; box-sizing: border-box; border-radius: 50%; background: var(--surface); border: 2px solid var(--line-2); }
.v5-pi-steps .is-done::before, .v5-pi-steps .is-done::after { background: var(--cu); border-color: var(--cu); }
.v5-pi-steps .is-now { color: var(--ink); font-weight: 600; }
.v5-pi-steps .is-now::after { border-color: var(--cu); box-shadow: 0 0 0 4px var(--cu-wash); }
.v5-pi-dates { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 14px 0 0; }
.v5-pi-dates div { background: color-mix(in srgb, var(--ink) 6%, var(--surface)); border-radius: 10px; padding: 10px 12px; }
.v5-pi-dates dt { font-size: 12.5px; line-height: 1.3; color: var(--ink-2); }
.v5-pi-dates dd { margin: 2px 0 0; font-size: 15px; font-weight: 600; font-variant-numeric: tabular-nums; }
.v5-pi-dec, .v5-pi-doc { display: grid; gap: 10px; align-content: start; padding: 16px; }
.v5-pi-h { font: 600 12px/1.3 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--cu-ink); }
.v5-pi-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.v5-pi-row b { display: block; font-size: 14px; font-weight: 600; }
.v5-pi-badge { flex: none; font: 600 11.5px/1 var(--font); padding: 5px 9px; border-radius: 999px; background: var(--cu-wash); color: var(--cu-ink); white-space: nowrap; }
.v5-pi-badge-n { background: transparent; color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--line-2); }
.v5-pi-btn { display: flex; align-items: center; justify-content: center; min-height: 40px; border-radius: 10px; background: var(--ink); color: var(--on-ink); font: 600 13.5px/1.2 var(--font); padding: 8px 12px; text-align: center; }
.v5-pi-doc ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.v5-pi-doc li { display: flex; align-items: center; gap: 10px; font-size: 13.5px; line-height: 1.3; }
.v5-pi-ico { flex: none; width: 32px; height: 32px; border-radius: 8px; background: var(--sunk); color: var(--ink-2); display: grid; place-items: center; font: 700 10.5px/1 var(--font); letter-spacing: .04em; }
.v5-pi-ico svg { width: 17px; height: 17px; }
/* Portál majstra: obchodná príležitosť (nové dopyty) je zvýraznená, úloha ostáva pokojná */
.v5-pi-hl { box-shadow: 0 0 0 2px var(--cu), 0 18px 36px -22px rgb(0 0 0 / .28); }
.v5-pi-cap { margin-top: 16px; font: 600 11.5px/1.3 var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-2); }
.v5-pi-list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 8px; }
.v5-pi-list li { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 10px; padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--ink) 6%, var(--surface)); }
.v5-pi-list b { font-size: 14px; font-weight: 600; line-height: 1.3; min-width: 0; }
.v5-pi-list .v5-pi-mu { grid-column: 1 / -1; }
.v5-pi-num { flex: none; display: grid; place-items: center; min-width: 30px; height: 30px; padding: 0 8px; border-radius: 999px; background: var(--cu); color: #0D0D0E; font: 700 14px/1 var(--font); }
.v5-pi-task { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.v5-pi-task b { display: block; font-size: 13.5px; font-weight: 600; line-height: 1.3; }
.v5-pi-chev { width: 16px; height: 16px; color: var(--ink-2); }
@container (max-width: 439px) {
  .v5-pi-body, .v5-pi-dec, .v5-pi-doc { padding: 14px; }
  .v5-pi-bar { padding: 10px 14px; }
  .v5-pi-steps, .v5-pi-dates { margin-top: 12px; }
  .v5-pi-doc ul { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v5-pi-doc li { flex-direction: column; align-items: flex-start; gap: 6px; font-size: 12.5px; }
}
@media (max-width: 600px) {
  /* na mobile nesie označenie štítok „Ilustračná ukážka portálu“; popis ostáva ako prístupný názov obrázka */
  .v5-pi figcaption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .v5 .v5-biz .biz-list { margin: 20px 0 24px; }
  .v5 .v5-biz .biz-item { padding: 16px 0; }
}
@container (min-width: 440px) {
  .v5-pi-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0; }
  .v5-pi-app { grid-column: 1 / -1; position: relative; z-index: 1; }
  .v5-pi-app .v5-pi-body { padding-bottom: 54px; }
  .v5-pi-dec { grid-column: 4 / -1; margin-top: -38px; position: relative; z-index: 2; }
  .v5-pi-doc { grid-column: 1 / span 8; margin-top: -14px; position: relative; z-index: 3; }
}
@container (min-width: 640px) {
  .v5-pi-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; align-items: start; }
  .v5-pi-app { grid-column: 1; grid-row: 1 / span 2; }
  .v5-pi-app .v5-pi-body { padding-bottom: 16px; }
  .v5-pi-dec { grid-column: 2; grid-row: 1; margin: 0; }
  .v5-pi-doc { grid-column: 2; grid-row: 2; margin: 0; }
}
.v5 .v5-biz { margin: 0; padding: 0; background: none; color: var(--ink); border-radius: 0; box-shadow: none; gap: 0;
  /* V4 dáva paneli .biz tmavé tokeny tlačidiel (assets/v4-hlavicka.css); vo svetlej sekcii V5 platia tokeny stránky */
  --v4-focus: inherit; --v4-sec-fg: inherit; --v4-sec-bd: inherit; --v4-sec-hover: inherit; --v4-seg-on-bg: inherit; --v4-seg-on-fg: inherit; }
.v5 .v5-biz .biz-top { margin-bottom: 28px; }
.v5 .v5-biz .biz-top > .mono { display: none; }
/* 004 (OWNER F1, STRICT LOCK prepínača povolený): segmentový ovládač – vybraná voľba plnou farbou, dotyková plocha 44 px */
.v5 :is(.v5-biz .biz-switch, .pv .pv-switch) { display: inline-flex; gap: 4px; padding: 4px; background: var(--cu-wash); border: 1px solid var(--line); border-radius: 999px; box-shadow: none; }
.v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button { min-height: 44px; padding: 0 22px; border-radius: 999px; background: none; color: var(--ink-2); font: 600 15px/1 var(--font); box-shadow: none; transition: background-color .15s, color .15s; }
.v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button:hover { color: var(--ink); background: color-mix(in srgb, var(--cu) 14%, transparent); }
.v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button[aria-selected="true"] { color: var(--paper); background: var(--cu-ink); box-shadow: 0 1px 3px rgb(0 0 0 / .18); }
@media (max-width: 600px) { .v5 :is(.v5-biz .biz-switch, .pv .pv-switch) { display: flex; width: 100%; } .v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button { flex: 1; padding: 0 10px; } }
@media (prefers-reduced-motion: reduce) { .v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button { transition: none; } }
.v5 :is(.v5-biz .biz-switch, .pv .pv-switch) button:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 2px; }
.v5 .v5-biz .biz-title { font: 400 var(--v5-t-s)/.95 var(--v5-display); letter-spacing: .005em; text-transform: uppercase; color: var(--ink); margin: 0 0 12px; }
.v5 .v5-biz .biz-intro { color: var(--ink-2); font-size: var(--v5-t-lead); line-height: 1.55; max-width: 48ch; }
.v5 .v5-biz .biz-list { margin: 24px 0 28px; border-top: 1px solid var(--line); }
.v5 .v5-biz .biz-item { grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line); background: none; }
.v5 .v5-biz .biz-item .mono { grid-row: auto; width: 36px; height: 36px; border: 0; border-radius: 10px; display: grid; place-items: center; background: var(--cu-wash); font: 400 20px/1 var(--v5-display); color: var(--cu-ink); letter-spacing: .02em; }
.v5 .v5-biz .biz-item h3 { color: var(--ink); font-size: clamp(17px, 1.35vw, 19px); }
.v5 .v5-biz .biz-item p { color: var(--ink-2); font-size: 15.5px; max-width: 48ch; margin-top: 4px; }
.v5 .v5-biz .biz-badge { border-color: var(--line-2); color: var(--cu-ink); }
.v5 .v5-biz .biz-cta { gap: 12px; }
.v5 .v5-biz .biz-cta .btn:not([data-open]) { background: transparent; color: var(--v4-sec-fg); border-color: var(--v4-sec-bd); }
.v5 .v5-biz .biz-cta .btn:not([data-open]):hover { background: var(--v4-sec-hover); border-color: var(--v4-sec-fg); }
.v5 .v5-pv-line { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: baseline; margin-top: clamp(40px, 4.5vw, 64px); padding: 18px 22px; border: 1px solid var(--line); border-left: 3px solid var(--cu); border-radius: 12px; background: var(--surface); font-size: 15px; color: var(--ink-2); }
.v5-pv-line .mono { color: var(--cu-ink); text-transform: uppercase; }
.v5-pv-line b { color: var(--ink); }
@media (max-width: 900px) {
  .v5-ben { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .v5-ben-ph { position: relative; top: 0; }
  .v5-ben-ph .v5-r-4x5 { aspect-ratio: 3 / 2; }
  /* mobil a tablet: prepínač Investor / Realizátor nad ilustráciou, pod ňou text, výhody a CTA */
  .v5 .v5-ben > .v5-biz { display: contents; }
  .v5 .v5-ben > .v5-biz .biz-top { order: 1; margin-bottom: 0; }
  .v5 .v5-ben > .v5-ben-ph { order: 2; }
  .v5 .v5-ben > .v5-biz [data-biz-body] { order: 3; }
}
/* hlavná akcia sekcie ostáva medená aj na mobile (v4-system.css ju pod 760 px mení na Secondary) */
@media (max-width: 760px) { .v5 .v5-biz .biz-cta a.btn[data-open="intake"] { background: var(--v4-cu); color: var(--v4-ink); border-color: transparent; } }

/* ---------- Ako prebieha zákazka (R4.3 data-flow) v systéme V5 – svetlá sekcia ---------- */
.v5 .flow { gap: 24px; }
.v5 .flow-rail::before { background: var(--line-2); top: 19px; }
.v5 .flow-rail::after { background: var(--v4-cu); top: 19px; }
.v5 .flow-rail button { color: var(--muted); font: 600 14px/1.3 var(--font); gap: 12px; min-height: 44px; }
.v5 .flow-rail button:hover, .v5 .flow-rail button[aria-selected="true"] { color: var(--ink); }
.v5 .flow-rail button .mono { width: 40px; height: 40px; border-radius: 12px; background: var(--paper); border: 1.5px solid var(--line-2); color: var(--ink-2); font: 400 20px/1 var(--v5-display); letter-spacing: .02em; transform: none; }
.v5-sunk .flow-rail button .mono { background: var(--sunk); }
.v5 .flow-rail button.is-done .mono { border-color: var(--cu); color: var(--cu-ink); }
.v5 .flow-rail button[aria-selected="true"] .mono { background: var(--v4-cu); border-color: var(--v4-cu); color: var(--v4-ink); transform: none; }
.v5 .flow-rail button:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; border-radius: 6px; }
.v5 .flow .flow-stage { background: var(--surface); border: 1px solid var(--line); border-color: color-mix(in srgb, var(--ink) 12%, transparent); border-radius: var(--v5-r); padding: clamp(22px, 3vw, 36px); gap: 22px; min-height: 0; box-shadow: var(--v5-shadow); color: var(--ink); }
.v5 .flow .fs-head h3 { font: 400 var(--v5-t-s)/.95 var(--v5-display); text-transform: uppercase; letter-spacing: .005em; color: var(--ink); gap: 10px; }
.v5 .flow .fs-head h3 .mono { font: 600 12px/1.2 var(--font); letter-spacing: .18em; color: var(--cu-ink); }
.v5 .flow .fs-what { color: var(--ink-2); font-size: var(--v5-t-lead); }
.v5 .flow .fs-cols { border-top: 1px solid var(--line); }
.v5 .flow .fs-cols > div + div { border-left-color: var(--line); }
.v5 .flow .fs-cols .mono, .v5 .flow .fs-cols > div:first-child .mono, .v5 .flow .fs-cols > .fs-sp .mono { font: 600 11.5px/1.2 var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--cu-ink); }
.v5 .flow .fs-cols p, .v5 .flow .fs-cols > div:first-child p, .v5 .flow .fs-cols > .fs-sp p { color: var(--ink-2); font-size: 15.5px; }
.v5 .flow .fs-gain { background: var(--cu-wash); border: 0; border-radius: 12px; }
.v5 .flow .fs-gain .mono { font: 600 11.5px/1.2 var(--font); letter-spacing: .14em; text-transform: uppercase; color: var(--cu-ink); }
.v5 .flow .fs-gain p { color: var(--ink); }
.v5 .flow .fs-state { background: var(--sunk); border-color: var(--line); color: var(--ink); }
.v5 .flow .fs-state:last-of-type { border-color: var(--cu); color: var(--cu-ink); }
.v5 .flow .fs-states > .mono, .v5 .flow .fs-arrow { color: var(--muted); }
.v5 .flow-ctl .btn { --v4-sec-fg: var(--ink); }
.v5 .fineprint { margin-top: 20px; font: 400 13px/1.5 var(--font); color: var(--muted); }

/* ---------- Príklad z praxe (R4.3 data-pv) v systéme V5 ---------- */
/* príklad je vsadený priamo do sekcie – bez veľkej karty s tieňom; vrstvy nesú iba zvýraznené kroky a deliace čiary */
.v5 .pv { min-width: 0; padding: 0; border-radius: 0; gap: 18px; background: none; border: 0; box-shadow: none; }
.v5 .pv-top { box-shadow: inset 0 -1px 0 var(--line); align-items: end; }
/* Mobil: prepínač Investor / Realizátor je na celú šírku, deliaca čiara pod ním je zbytočná. */
@media (max-width: 600px) { .v5 .pv-top { box-shadow: none; } }
.v5 .pv-top > .mono { font: 600 12px/1.2 var(--font); letter-spacing: .18em; text-transform: uppercase; color: var(--cu-ink); padding-bottom: 14px; }
.v5 .pv-job b { font: 400 clamp(24px, 2.2vw, 30px)/1 var(--v5-display); text-transform: uppercase; letter-spacing: .01em; }
.v5 .pv-job span { font-size: 14px; }
.v5 .pv-story::before { left: 15px; background: var(--line); }
.v5 .pv-story li, .v5 .pv-story li.hl { padding-left: 48px; }
.v5 .pv-story li::before { width: 32px; height: 32px; top: 9px; border-radius: 10px; background: var(--paper); border: 1.5px solid var(--line-2); color: var(--ink-2); font: 400 18px/1 var(--v5-display); }
.v5 .pv-story li.hl { padding: 12px 14px 12px 72px; border-radius: 12px; background: var(--cu-wash); }
.v5 .pv-story li.hl::before { left: 12px; background: var(--v4-cu); border-color: var(--v4-cu); color: var(--v4-ink); }
.v5 .pv-story li:last-child::before { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.v5 .pv-story li b { font-weight: 600; }
.v5 .pv-story li small { font-size: 14.5px; color: var(--ink-2); }
.v5 .pv-note { font: 400 12.5px/1.4 var(--font); color: var(--muted); }

/* ---------- pre koho ---------- */
.v5-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.v5-duo-card { display: block; aspect-ratio: 4 / 3; text-decoration: none; color: var(--v5-on-ph); }
.v5-duo-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(to bottom,
    transparent 15%,
    rgb(13 13 14 / .12) 35%,
    rgb(13 13 14 / .55) 65%,
    rgb(13 13 14 / .92) 100%);
}
.v5-duo-card img { transition: transform .5s var(--ease); }
.v5-duo-card:hover img { transform: scale(1.03); }
.v5-duo-ov { position: absolute; inset: auto 0 0; z-index: 3; display: grid; gap: 12px; justify-items: start; padding: clamp(22px, 2.8vw, 36px); background: none; }
.v5-duo-ov .v5-kicker { color: #e6ad78; }
.v5-duo-ov .v5-kicker::before { background: #e6ad78; }
.v5-duo-p { color: #e4e3e7; max-width: 36ch; font-size: 15px; }
.v5-duo-go { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 22px; border: 1.5px solid #8a8a8f; border-radius: 999px; font: 600 15px/1 var(--font); }
.v5-duo-go svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.v5-duo-card:hover .v5-duo-go { border-color: #fafaf9; background: rgb(250 250 249 / .08); }
.v5-duo-card:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 4px; }
@media (max-width: 760px) { .v5-duo { grid-template-columns: minmax(0, 1fr); } .v5-duo-card { aspect-ratio: 4 / 4.2; } }

/* ---------- realizácie: mozaika zo zverejnených príspevkov ---------- */
.v5-mosaic { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1.35fr 1fr 1fr; grid-template-rows: repeat(2, minmax(220px, 290px)); gap: 14px; }
.v5-mosaic > li { min-width: 0; }
.v5-mosaic > li:first-child { grid-row: span 2; }
.v5-mosaic a { display: block; height: 100%; text-decoration: none; color: var(--v5-on-ph); }
.v5-mosaic a img { transition: transform .5s var(--ease); }
.v5-mosaic a:hover img { transform: scale(1.03); }
.v5-mosaic a:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; }
.v5-cap { position: absolute; inset: auto 0 0; z-index: 2; padding: 40px 18px 14px; background: linear-gradient(transparent, var(--v5-ph-shade)); font: 500 12.5px/1.4 var(--font); }
.v5-cap b { display: block; margin-bottom: 2px; font: 600 15px/1.3 var(--font); }
@media (max-width: 900px) {
  .v5-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
  .v5-mosaic > li { aspect-ratio: 4 / 3.4; }
  .v5-mosaic > li:first-child { grid-column: span 2; grid-row: auto; aspect-ratio: 16 / 10; }
}
@media (max-width: 480px) { .v5-mosaic > li:not(:first-child) { aspect-ratio: 1; } }

/* ---------- referencie (karty q-v3): citát, medené hviezdičky, monogram Ink ---------- */
.v5 .v5-quotes { margin-top: 0; gap: 0; }
.v5 .v5-quotes .q-head { margin-bottom: clamp(32px, 4vw, 56px); }
.v5 .v5-quotes .q.q-v3 { position: relative; overflow: hidden; padding: 28px 28px 24px; gap: 16px; border-radius: var(--v5-r); box-shadow: var(--v5-shadow); }
.v5 .v5-quotes .q-v3 blockquote.q-text { position: relative; font-size: clamp(17px, 1.3vw, 19px); line-height: 1.55; }
.v5 .v5-quotes .q-id:not(.q-id-logo) { background: var(--ink); color: var(--paper); border: 0; font: 400 22px/1 var(--v5-display); letter-spacing: .04em; }
/* päť medených hviezdičiek – rovnaká veľkosť, farba a miesto (medzi autorom a citátom) na všetkých kartách */
.v5 .v5-quotes .q-stars { display: block; margin: 0; color: var(--v4-cu); font-size: 18px; letter-spacing: .16em; line-height: 1; white-space: nowrap; }
.v5 .v5-quotes .gal-btn:focus-visible { outline: 2.5px solid var(--v4-focus); }

/* ---------- podstránky: hero ---------- */
.v5-sub-hero { padding-block: clamp(24px, 3.5vw, 56px) clamp(56px, 7vw, 96px); }
.v5-sub-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.v5-sub-grid > * { min-width: 0; }
.v5-sub-hero .v5-ph.v5-r-4x5 { max-height: 600px; }
.v5-sub-hero > .v5-wrap.v5-stack .v5-d-xl { max-width: 16ch; }
@media (max-width: 900px) { .v5-sub-grid { grid-template-columns: minmax(0, 1fr); } .v5-sub-hero .v5-ph.v5-r-4x5 { aspect-ratio: 4 / 3.2; } }

.v5-links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.v5-links li { display: inline-flex; }
.v5-links a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; color: var(--ink); text-decoration: none; border-radius: 999px; border: 1px solid var(--line-2); }
.v5-links a:hover { border-color: var(--ink); }
.v5-links a:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 2px; }
.v5 .onpage { background: var(--paper); }
.v5 .pv-prog { max-width: none; margin-top: clamp(24px, 3vw, 40px); border-radius: var(--v5-r); border-left-width: 3px; }
.v5 .pv-prog .mono { text-transform: uppercase; }
.v5 .pv-prog h3 { font: 400 var(--v5-t-s)/.95 var(--v5-display); letter-spacing: .005em; text-transform: uppercase; }

/* portál investora: zoznam funkcií */
.v5-feat { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; border-top: 1px solid var(--line); }
.v5-feat li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 16px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.v5-feat .v5-ico { grid-row: span 2; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--cu-wash); color: var(--cu-ink); }
.v5-feat .v5-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.v5-feat b { font-weight: 600; font-size: 16.5px; }
.v5-feat span { color: var(--ink-2); font-size: 15px; }

/* FAQ */
.v5 .v5-faq { max-width: none; }
.v5 .v5-faq summary { padding-block: 22px; font: 600 clamp(16px, 1.3vw, 18px)/1.4 var(--font); }
.v5 .v5-faq summary::after { font: 300 30px/1 var(--font); color: var(--cu-ink); }
.v5 .v5-faq summary:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 2px; }
.v5 .v5-faq details p + p { padding-top: 0; }

/* pred / po – rovnaký projekt, porovnateľný pohľad */
.v5-ba { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--v5-r); user-select: none; touch-action: pan-y; background: var(--sunk); }
.v5-ba img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--img-filter); }
.v5-ba-after { position: absolute; inset: 0; clip-path: inset(0 0 0 var(--x, 50%)); }
.v5-ba-handle { position: absolute; top: 0; bottom: 0; left: var(--x, 50%); z-index: 3; width: 2px; margin-left: -1px; background: #fafaf9; pointer-events: none; }
.v5-ba-handle::after { content: ""; position: absolute; top: 50%; left: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); border-radius: 999px; background: var(--v4-cu) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d0d0e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 7-5 5 5 5M15 7l5 5-5 5'/%3E%3C/svg%3E") center/22px no-repeat; box-shadow: 0 4px 18px rgb(0 0 0 / .35); }
.v5-ba-lab { position: absolute; bottom: 14px; z-index: 4; padding: 7px 11px; border-radius: 8px; background: rgb(13 13 14 / .7); color: #fafaf9; font: 600 12px/1 var(--font); letter-spacing: .08em; text-transform: uppercase; pointer-events: none; }
.v5-ba-l { left: 14px; }
.v5-ba-r { right: 14px; }
.v5-ba input { position: absolute; inset: 0; z-index: 5; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.v5-ba:has(input:focus-visible) { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; }
.v5-ba-cap { margin-top: 12px; font-size: 13.5px; color: var(--muted); }

/* kroky (Ako sa pridať) */
.v5-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; counter-reset: v5s; }
.v5-steps li { display: grid; gap: 10px; align-content: start; padding: 24px; border-radius: var(--v5-r); background: var(--surface); border: 1px solid var(--line); border-color: color-mix(in srgb, var(--ink) 12%, transparent); counter-increment: v5s; }
.v5-steps li::before { content: counter(v5s); width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: var(--v4-cu); color: var(--v4-ink); font: 400 22px/1 var(--v5-display); }
.v5-steps p { color: var(--ink-2); font-size: 15px; }
@media (max-width: 900px) { .v5-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .v5-steps { grid-template-columns: minmax(0, 1fr); } }

/* upútavka (kalkulačky, stratený odkaz) */
.v5-teaser { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 32px; align-items: center; padding: clamp(26px, 3vw, 40px); border-radius: 22px; background: var(--night); color: #f3f1ee; box-shadow: 0 0 0 1px var(--night-edge); }
.v5-teaser p { color: #d1ccc6; max-width: 58ch; }
.v5-teaser .v5-kicker { color: var(--cu-hi); }
.v5-teaser .v5-d-s { color: #fff; }
@media (max-width: 760px) { .v5-teaser { grid-template-columns: minmax(0, 1fr); } }

/* Kontakt a Prístup do portálu */
.v5-contact-big { display: grid; gap: 10px; justify-items: start; }
.v5-contact-big a { font: 400 clamp(40px, 5.4vw, 84px)/.9 var(--v5-display); letter-spacing: .01em; color: var(--ink); text-decoration: none; overflow-wrap: anywhere; }
.v5-contact-big a.v5-mail { font-size: clamp(30px, 3.6vw, 56px); }
.v5-contact-big a:hover { color: var(--cu-ink); }
.v5-contact-big a:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; }
a.v5-card { text-decoration: none; transition: border-color .15s, transform .15s; }
a.v5-card:hover { border-color: var(--cu); transform: translateY(-2px); }
a.v5-card:focus-visible { outline: 2.5px solid var(--v4-focus); outline-offset: 3px; }
.v5-go { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 6px; font-weight: 600; color: var(--ink); }
.v5-go svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; }
.v5-company { margin: 20px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; font-size: 14.5px; }
.v5-company dt { margin-bottom: 8px; font: 600 11px/1.2 var(--font); letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.v5-company dd { margin: 0; }
@media (max-width: 900px) { .v5-company { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 480px) { .v5-company { grid-template-columns: minmax(0, 1fr); } }

/* 404 */
.v5-e404 .v5-sub-grid { min-height: 52vh; }
.v5-e404-n { font: 400 clamp(140px, 24vw, 320px)/.8 var(--v5-display); color: var(--cu); }

/* ---------- Realizácie (archív R4.3 s filtrom a stránkovaním) a článok realizácie ---------- */
.v5-archive .sub-hero h1, .v5-art .cs-head h1 { font-family: var(--v5-display); font-weight: 400; font-synthesis: none; text-transform: uppercase; letter-spacing: .005em; line-height: .9; font-size: var(--v5-t-xl); text-wrap: balance; }
.v5-art .cs-head h1 { font-size: clamp(42px, 5.2vw, 80px); max-width: 18ch; }
.v5-archive .sub-hero .kicker, .v5-art .cs-head .kicker { display: inline-flex; align-items: center; gap: 12px; font: 600 12px/1.2 var(--font); letter-spacing: .18em; text-transform: uppercase; color: var(--cu-ink); }
.v5-archive .sub-hero .kicker::before, .v5-art .cs-head .kicker::before { content: ""; flex: none; width: 28px; height: 2px; background: var(--cu); }
.v5-archive .post-card, .v5-art .post-card { border-radius: var(--v5-r); }
.v5-archive .post-card h3, .v5-art .post-card h3 { font: 600 clamp(17px, 1.4vw, 19px)/1.3 var(--font); letter-spacing: -.01em; text-transform: none; }
.v5-archive .post-card .mono, .v5-art .post-card .mono { color: var(--cu-ink); }

/* ---------- záverečné CTA: medený pás oddelený od pätičky (Ink na Copper 5,12 : 1) ---------- */
.v5-final { position: relative; overflow: hidden; padding-block: clamp(72px, 9vw, 128px); background: var(--v4-cu); color: var(--v4-ink);
  --v4-focus: #0d0d0e; --v4-sec-fg: #0d0d0e; --v4-sec-bd: #0d0d0e; --v4-sec-hover: rgb(13 13 14 / .08); }
.v5-final .v5-wrap { --v5-gut: clamp(18px, 4vw, 48px); max-width: calc(1280px + 2 * var(--v5-gut)); margin-inline: auto; padding-left: max(var(--v5-gut), env(safe-area-inset-left, 0px)); padding-right: max(var(--v5-gut), env(safe-area-inset-right, 0px)); }
.v5-final-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 32px 56px; align-items: end; }
.v5-final .v5-d-l { margin: 0; color: var(--v4-ink); max-width: 15ch; font: 400 clamp(46px, 6.2vw, 96px)/.9 "Bebas Neue", Impact, "Arial Narrow", sans-serif; font-synthesis: none; letter-spacing: .005em; text-transform: uppercase; text-wrap: balance; }
.v5-final p { margin: 20px 0 0; max-width: 44ch; color: var(--v4-ink); font: 500 clamp(17px, 1.3vw, 20px)/1.5 var(--font); }
.v5-final-cta { display: grid; gap: 16px; justify-items: start; }
.v5-final .v5-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.v5-final a.btn[data-open] { background: var(--v4-ink); color: #fafaf9; border-color: var(--v4-ink); }
.v5-final a.btn[data-open]:hover { background: var(--v4-graphite); border-color: var(--v4-graphite); }
/* Secondary výslovne – na kalkulačkách sa vrstva V4 nenačíta a .btn-line R4.3 by v tmavom režime mal svetlý text */
.v5-final .btn:not([data-open]) { background: transparent; color: var(--v4-ink); border-color: var(--v4-ink); }
.v5-final .btn:not([data-open]):hover { background: rgb(13 13 14 / .08); }
.v5-final .btn .arr { width: 18px; height: 18px; }
.v5-final .v5-final-tel { margin: 0; font-size: 15px; }
.v5-final .v5-final-tel a { color: var(--v4-ink); font-weight: 600; text-underline-offset: 4px; }
.v5-final :focus-visible { outline: 2.5px solid var(--v4-ink); outline-offset: 3px; }
@media (max-width: 860px) { .v5-final-grid { grid-template-columns: minmax(0, 1fr); } .v5-final .v5-btns .btn { flex: 1 1 100%; } }

/* ---------- pätička (celý web): #0D0D0E, logo rovnako veľké ako v hlavičke, slogan s medenou čiarkou ---------- */
.ftr { background: #0d0d0e; }
.ftr .ftr-brand { gap: 16px; }
.ftr .ftr-brand img { width: 240px; height: auto; } /* rovnako ako logo v hlavičke (assets/header.css) */
@media (max-width: 1259px) { .ftr .ftr-brand img { width: 215px; } }
@media (max-width: 720px) { .ftr .ftr-brand img { width: 180px; } }
.ftr .ftr-claim { display: flex; align-items: center; gap: 10px; margin-top: 0; }
.ftr .ftr-claim::before { content: ""; flex: none; width: 22px; height: 2px; background: var(--cu); }
.ftr .ftr-claim b { display: inline; font-size: 15px; font-weight: 500; letter-spacing: 0; color: #b9b8bd; }
@media (max-width: 760px) { .ftr .ftr-brand { grid-column: 1 / -1; } }

/* ---------- dialóg dopytu (F-2, audity V5): rozpracovaný dopyt, zrušenie, kratší krok 1 na mobile ---------- */
.dlg #in-draft { margin: 0; }
.dlg .in-cancel { margin: -6px 0 0; text-align: center; }
.dlg .in-cancel .link-btn { font-size: 14px; color: var(--muted); }
.dlg [data-in-msg] .chip { margin: 2px 4px 2px 0; vertical-align: middle; }
@media (max-width: 600px) {
  .dlg [data-in-step="1"] .seg4 small { font-size: 12px; line-height: 1.35; }
  .dlg [data-in-step="1"] .file-fld + .hint { font-size: 12.5px; }
  .dlg [data-in-step="1"] .file-ui { flex-wrap: nowrap; padding-block: 8px; }
  .dlg [data-in-step="1"] .file-sum { min-width: 0; font-size: 13px; line-height: 1.3; }
  .dlg .in-cancel { margin-top: 0; }
}

/* ---------- pohyb ---------- */
@media (prefers-reduced-motion: reduce) {
  .v5 *, .v5-final * { transition: none !important; }
  .v5-duo-card:hover img, .v5-mosaic a:hover img, a.v5-card:hover { transform: none; }
}

/* Balík 001–016 (R1/B, OWNER GO 30. 10. 2026) */
.v5-val { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 22px; }
.v5-val li { display: grid; gap: 2px; font-size: 14.5px; color: var(--ink-2); padding-left: 14px; border-left: 2px solid var(--cu); }
.v5-val b { color: var(--ink); font-weight: 600; }
@media (max-width: 600px) { .v5-val { grid-template-columns: minmax(0, 1fr); } }
.v5-terms { margin-top: 28px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 14px; background: var(--cu-wash); }
.v5-terms h3 { margin: 0 0 12px; font: 600 18px/1.3 var(--font); color: var(--ink); }
.v5-terms dl { margin: 0; display: grid; gap: 10px; }
.v5-terms dt { font-weight: 600; color: var(--ink); }
.v5-terms dd { margin: 0; color: var(--ink-2); font-size: 14.5px; }
.v5-soon { display: inline-block; margin-left: 8px; padding: 3px 9px; border-radius: 999px; border: 1px solid currentColor; font: 600 11px/1.3 var(--font); letter-spacing: .08em; text-transform: uppercase; vertical-align: middle; }


/* Timeline V5: jednotne zarovnanie a suvisla spojovacia ciara */
.v5 .pv-story {
  position: relative;
  isolation: isolate;
}

.v5 .pv-story::before {
  display: block;
  left: 28px;
  top: 18px;
  bottom: 18px;
  width: 2px;
  background: var(--line-2);
  z-index: 2;
  pointer-events: none;
}

.v5 .pv-story li,
.v5 .pv-story li.hl {
  position: relative;
  z-index: 3;
  margin: 4px 0;
  padding: 12px 14px 12px 60px;
  border-radius: 12px;
}

.v5 .pv-story li:not(.hl) {
  background: transparent;
}

.v5 .pv-story li.hl {
  background: var(--cu-wash);
}

.v5 .pv-story li::before,
.v5 .pv-story li.hl::before {
  left: 12px;
  top: 12px;
  z-index: 3;
}

.v5 .pv-story li {
  z-index: 3;
}
.v5 .pv-story li::before {
  z-index: 4;
}

/* H03: kompaktne vertikalne rozostupy sekcii na mobile */
@media (max-width: 760px) {
  .v5 { --v5-sec: 48px; }
}