/* TYPWEB1 (owner 20. 10. 2026, náčrt b3 = katalóg mockupov #125, PR #1516) — rozcestník domova „S čím začnete?“.
 * ROZCESTDOLE1 (owner 22. 10., mockup #132 v2+v3): nižšie na domove (miesto „Čím začnete?“), všetky jazyky, official; A/B (b2) zrušené.
 * Jeden kód pre PC aj telefón (< 760 px); usporiadanie robí static/ds/rozcestie.js cez data-rz-slot:
 *   big = 1 veľká · mid = 3 stredné (telefón: riadky zoznamu) · tile = malé (telefón: tlačidlá s ikonou pod „Ďalšie možnosti“)
 * Osobná karta .rz-me (návrh / partner) nahrádza veľkú. Pohyb (v2 b + v3 c): PC len posun šípky „→“ pri myši; Inšpirácia premena raz. */
.rz { padding: 36px 0 40px; background: var(--paper); }
.rz [hidden] { display: none !important; }
.ka .rz h2, .rz h2 { margin: 0 0 8px; font-size: 31px; line-height: 1.05; letter-spacing: -.045em; font-weight: 650; color: var(--ink); }
.rz-lead { margin: 0 0 14px; color: var(--muted); font-size: 15px; }
.rz-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

/* karta — základ */
.rz-c, .rz-me { position: relative; display: grid; grid-template-rows: auto 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); color: var(--ink); text-decoration: none; transition: border-color var(--t-fast), box-shadow var(--t-fast); }
.rz-c:hover, .rz-me:hover { border-color: var(--mint-2); box-shadow: 0 14px 30px -24px rgb(16 42 34 / .6); }
.rz-c:focus-visible, .rz-me a:focus-visible { outline: 3px solid var(--leaf); outline-offset: 3px; }
.rz-c__im { position: relative; display: block; height: 104px; overflow: hidden; background: radial-gradient(120% 100% at 50% 0%, #FFFDF6 0%, #E3EADB 100%); }
.rz-c__im img, .rz-c__im svg { display: block; width: 100%; height: 100%; object-fit: cover; }
.rz-c__im img.contain { object-fit: contain; transform: scale(1.18); }
.rz-c__im img.top { object-position: 50% 0; }
.rz-c__ic, .rz-c__ch, .rz-c__s { display: none; }
.rz-c__tx { display: grid; gap: 4px; align-content: start; padding: 12px 14px 14px; }
.rz-c__tx b { font-size: 18px; line-height: 1.2; }
.rz-c__tx small { color: var(--muted); font-size: 14px; line-height: 1.45; }
.rz-c__go { margin-top: 4px; color: var(--leaf-deep); font-size: 15px; font-weight: 650; }
.rz-c__tag { position: absolute; top: 12px; left: 12px; z-index: 2; justify-self: start; padding: 3px 10px; border-radius: 999px; background: var(--sun); color: var(--soil); font-size: 12.5px; font-weight: 700; box-shadow: 0 2px 8px rgb(8 56 43 / .14); }
.rz-c__tag.is-soft { background: var(--leaf-mist); color: var(--leaf-deep); }
.rz-more-h { grid-column: 1 / -1; margin: 8px 0 -2px; color: var(--muted); font-size: 14px; font-weight: 650; }

/* veľká karta + osobná (telefón: pod sebou) */
.rz-c[data-rz-slot="big"], .rz-me { grid-column: 1 / -1; border-radius: 20px; }
.rz-c[data-rz-slot="big"] .rz-c__im, .rz-me .rz-c__im { height: 190px; }
.rz-c[data-rz-slot="big"] .rz-c__tx, .rz-me .rz-c__tx { gap: 5px; padding: 14px 16px 16px; }
.rz-c[data-rz-slot="big"] .rz-c__tx b, .rz-me .rz-c__tx b { font-size: 23px; line-height: 1.12; letter-spacing: -.02em; }
.rz-c[data-rz-slot="big"] .rz-c__tx small, .rz-me .rz-c__tx small { color: var(--body); font-size: 15px; }
.rz-c[data-rz-slot="big"] .rz-c__go, .rz-me__go { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; margin-top: 6px; padding: 0 22px; border-radius: 999px; background: var(--leaf); color: #fff; font-size: 16px; font-weight: 650; text-decoration: none; }
.rz-me { border: 2px solid var(--leaf); }
.rz-me__go::after { content: ""; position: absolute; inset: 0; } /* celá karta = hlavný odkaz */
.rz-me__ey { color: var(--leaf-deep); font-size: 13.5px; font-weight: 650; }
.rz-me__lnk { position: relative; z-index: 1; justify-self: center; color: var(--leaf-deep); font-size: 14px; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.rz-me--b2b { border-color: var(--larch); }
.rz-me--b2b .rz-me__ey { color: var(--larch-ink); }
.rz-me--b2b .rz-me__go { background: var(--larch-ink); }

/* b · telefón: 3 riadky zoznamu */
.rz-c[data-rz-slot="mid"] { grid-column: 1 / -1; grid-template-rows: none; grid-template-columns: 68px 1fr 18px; gap: 12px; align-items: center; min-height: 84px; padding: 8px 12px 8px 8px; border-radius: 0; }
.rz-c[data-rz-slot="mid"]:not(.is-mid-first) { margin-top: -11px; }
.rz-c[data-rz-slot="mid"].is-mid-first { border-radius: 18px 18px 0 0; }
.rz-c[data-rz-slot="mid"].is-mid-last { border-radius: 0 0 18px 18px; }
.rz-c[data-rz-slot="mid"].is-mid-first.is-mid-last { border-radius: 18px; }
.rz-c[data-rz-slot="mid"] .rz-c__im { width: 68px; height: 68px; border-radius: 12px; }
.rz-c[data-rz-slot="mid"] .rz-c__im img.contain { transform: scale(1.25); }
.rz-c[data-rz-slot="mid"] .rz-c__tx { gap: 1px; padding: 0; }
.rz-c[data-rz-slot="mid"] .rz-c__tx b { font-size: 16.5px; line-height: 1.25; }
.rz-c[data-rz-slot="mid"] .rz-c__s { display: block; font-size: 13.5px; line-height: 1.35; }
.rz-c[data-rz-slot="mid"] .rz-c__p, .rz-c[data-rz-slot="mid"] .rz-c__go, .rz-c[data-rz-slot="mid"] .rz-c__tag { display: none; }
.rz-c[data-rz-slot="mid"] .rz-c__ch { display: block; color: var(--leaf-deep); font-size: 20px; font-weight: 700; }

/* b · telefón: „Ďalšie možnosti“ = tlačidlá s ikonou */
.rz-c[data-rz-slot="tile"] { grid-template-rows: none; grid-template-columns: 20px 1fr; gap: 8px; align-items: center; min-height: 52px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: 14px; color: var(--leaf-deep); }
.rz-c[data-rz-slot="tile"].is-odd-last { grid-column: 1 / -1; }
.rz-c[data-rz-slot="tile"] .rz-c__im, .rz-c[data-rz-slot="tile"] small, .rz-c[data-rz-slot="tile"] .rz-c__go, .rz-c[data-rz-slot="tile"] .rz-c__tag { display: none; }
.rz-c[data-rz-slot="tile"] .rz-c__ic { display: block; width: 20px; height: 20px; }
.rz-c[data-rz-slot="tile"] .rz-c__tx { padding: 0; }
.rz-c[data-rz-slot="tile"] .rz-c__tx b { font-size: 14.5px; font-weight: 650; line-height: 1.2; }

/* šípky: v texte karty (tlačidlo, odkaz) a pri názve malej dlaždice na PC; posun len na PC pri myši (v2 b: +3 px, 160 ms) */
.rz-arr { display: inline-block; transition: transform .16s ease-out; }
.rz-c__ta { display: none; color: var(--leaf-deep); }

/* Inšpirácia — premena raz (v3 c): .rz-ab__b = vizualizácia (statická, navrchu), .rz-ab__a = Studio 3D (vloží skript) */
.rz-ab { position: relative; }
.rz-ab .rz-ab__a { position: absolute; inset: 0; }
.rz-ab .rz-ab__b { position: relative; z-index: 1; }
.rz-ab.is-pre .rz-ab__b { opacity: 0; }
.rz-ab.is-pre.is-on .rz-ab__b { opacity: 1; transition: opacity .8s ease-in-out; }

@media (min-width: 760px) {
  .rz { padding: 56px 0 64px; }
  .ka .rz h2, .rz h2 { font-size: 48px; }
  .rz-lead { margin: 0 0 22px; font-size: 18px; }
  .rz-c:hover .rz-arr, .rz-me:hover .rz-arr { transform: translateX(3px); }
  .rz-grid { grid-template-columns: repeat(60, minmax(0, 1fr)); gap: 18px; }
  .rz-c, .rz-me { border-radius: 22px; }
  .rz-c__tx small { font-size: 15px; }

  /* b · veľká + osobná: obrázok vľavo, text vpravo */
  .rz-c[data-rz-slot="big"], .rz--b .rz-me { grid-template-rows: none; grid-template-columns: 1.35fr 1fr; min-height: 320px; border-radius: 26px; }
  .rz-c[data-rz-slot="big"] .rz-c__im, .rz--b .rz-me .rz-c__im { height: auto; }
  .rz-c[data-rz-slot="big"] .rz-c__im > img, .rz-c[data-rz-slot="big"] .rz-c__im > svg, .rz--b .rz-me .rz-c__im > img, .rz--b .rz-me .rz-c__im > svg { position: absolute; inset: 0; }
  .rz-c[data-rz-slot="big"] .rz-c__im img.contain { transform: scale(1.05); }
  .rz-c[data-rz-slot="big"] .rz-c__tx, .rz--b .rz-me .rz-c__tx { align-content: center; gap: 8px; padding: 30px 36px; }
  .rz-c[data-rz-slot="big"] .rz-c__tx b, .rz--b .rz-me .rz-c__tx b { font-size: 36px; line-height: 1.1; letter-spacing: -.025em; }
  .rz-c[data-rz-slot="big"] .rz-c__tx small, .rz--b .rz-me .rz-c__tx small { font-size: 18px; }
  .rz-c[data-rz-slot="big"] .rz-c__go, .rz--b .rz-me__go { justify-self: start; min-height: 48px; margin-top: 10px; }
  .rz-c[data-rz-slot="big"] .rz-c__tag { position: static; box-shadow: none; padding: 4px 12px; font-size: 13.5px; }
  .rz--b .rz-me__lnk { justify-self: start; font-size: 15px; }
  .rz-me__ey { font-size: 14px; }

  /* b · 3 stredné v rade */
  .rz-c[data-rz-slot="mid"] { grid-column: span 20; grid-template-rows: auto 1fr; grid-template-columns: none; gap: 0; align-items: stretch; min-height: 0; padding: 0; border-radius: 22px; }
  .rz-c[data-rz-slot="mid"]:not(.is-mid-first) { margin-top: 0; }
  .rz-c[data-rz-slot="mid"].is-mid-first, .rz-c[data-rz-slot="mid"].is-mid-last { border-radius: 22px; }
  .rz-c[data-rz-slot="mid"] .rz-c__im { width: auto; height: 180px; border-radius: 0; }
  .rz-c[data-rz-slot="mid"] .rz-c__im img.contain { transform: scale(1.18); }
  .rz-c[data-rz-slot="mid"] .rz-c__tx { gap: 4px; padding: 16px 18px 18px; }
  .rz-c[data-rz-slot="mid"] .rz-c__tx b { font-size: 20px; }
  .rz-c[data-rz-slot="mid"] .rz-c__s, .rz-c[data-rz-slot="mid"] .rz-c__ch { display: none; }
  .rz-c[data-rz-slot="mid"] .rz-c__p, .rz-c[data-rz-slot="mid"] .rz-c__go { display: block; }
  .rz-c[data-rz-slot="mid"] .rz-c__go { font-size: 15.5px; }

  /* b · Ďalšie možnosti: rad malých dlaždíc (obrázok + názov) */
  .rz-more-h { margin: 8px 0 -8px; font-size: 15px; }
  .rz-c[data-rz-slot="tile"] { grid-column: span 15; grid-template-rows: 96px auto; grid-template-columns: none; gap: 0; align-items: stretch; min-height: 0; padding: 0; border-color: var(--line); border-radius: 16px; color: var(--ink); }
  .rz[data-rz-tiles="5"] .rz-c[data-rz-slot="tile"], .rz[data-rz-tiles="5"] .rz-c[data-rz-slot="tile"].is-odd-last { grid-column: span 12; }
  .rz-c[data-rz-slot="tile"].is-odd-last { grid-column: span 15; }
  .rz[data-rz-tiles="3"] .rz-c[data-rz-slot="tile"], .rz[data-rz-tiles="3"] .rz-c[data-rz-slot="tile"].is-odd-last { grid-column: span 20; } /* bez Inšpirácie */
  .rz[data-rz-tiles="2"] .rz-c[data-rz-slot="tile"] { grid-column: span 30; }
  .rz[data-rz-tiles="1"] .rz-c[data-rz-slot="tile"].is-odd-last { grid-column: span 20; } /* official bez Záhona na mieru, AI aj Inšpirácie */
  .rz-c[data-rz-slot="tile"] .rz-c__im { display: block; height: 96px; }
  .rz-c[data-rz-slot="tile"] .rz-c__ic { display: none; }
  .rz-c[data-rz-slot="tile"] .rz-c__tx { padding: 10px 12px 12px; }
  .rz-c[data-rz-slot="tile"] .rz-c__tx b { font-size: 16px; line-height: 1.25; }
  .rz-c[data-rz-slot="tile"] .rz-c__ta { display: inline; }
}
@media (prefers-reduced-motion: reduce) {
  .rz-arr, .rz-ab.is-pre.is-on .rz-ab__b { transition: none; }
  .rz-c:hover .rz-arr, .rz-me:hover .rz-arr { transform: none; }
}