/* ═══════════════════════════════════════════════════════════════════
   SOURCING Z LINKEDINU — druhá buňka úrovně 1 výkladní skříně
   ───────────────────────────────────────────────────────────────────
   Příkaz č. 157. Stojí vedle sémantického hledání schválně: obě jsou
   o AKTIVNÍM vyhledávání, ne o čekání na přihlášku. První hledá uvnitř
   vlastní databáze, druhá venku na LinkedInu.

   Zaplňuje se tím pravá polovina úrovně 1, o které komentář
   u .skrin-peek v site.css píše, že „prázdná nezůstane" — do dneška
   prázdná byla.

   Vlastní prefix `zdroj-` podle pravidla č. 1 z přehledu příkazů;
   před nasazením ověřeno grepem, že je volný.

   NADŘÁDEK SI PŮJČUJE .skrin-nadradek. Je to týž prvek ve stejném
   bloku a ve stejné roli — druhá kopie téhož řezu by se jen rozešla.
   ═══════════════════════════════════════════════════════════════════ */

/* Široká dvojice: vlevo vizuál, vpravo text. Levý sloupec je širší —
   nese dva snímky profilu a ty musí zůstat čitelné. Při 1206px kontejneru
   vychází levý na ~640px, tedy 81 % původní šířky snímku. */
/* SLOUPCE 1:1, ne 1,12:1 (25. 8., třetí Jiřího připomínka na tutéž
   věc). Širší levý sloupec dělal snímky vyšší, a protože obě poloviny
   zavírá společná linka, ta výška se promítla do PRÁZDNA V PRAVÉM
   SLOUPCI. Snímky jsou při 1:1 široké ~590 px místo ~640 — pořád
   čitelné, a buňka je o 127 px nižší. */
.zdroj-duo {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  /* STRETCH, ne center. Vystředěný text se propadl doprostřed a nad
     nadpisem zůstala díra. Takhle začíná nadpis nahoře u prvního
     profilu a drobné písmo se opře o spodní hranu posledního —
     sloupce si sednou na obě linky místo na jednu. */
  gap: 44px; align-items: stretch;
}
.zdroj-duo > * { min-width: 0; }
/* .skrin-peek má 62 % šířky, protože dřív stálo samo v levé polovině
   a pravou nechávalo rukopisu. Uvnitř poloviční buňky by z toho byla
   třetina — omezení se ruší, ohraničené rodičem. */
.zdroj-duo .skrin-peek { max-width: none; }
.zdroj-duo .skrin-ilustrace { margin-bottom: 0; }

@media (max-width: 900px) {
  .zdroj-duo { grid-template-columns: 1fr; gap: 30px; }
}

/* ── pravá buňka ─────────────────────────────────────────────────────
   Žádná karta. Levá polovina je prostý text na bílé a orámovaná pravá
   by z dvojice udělala „text a k tomu box". Sloupce odděluje jedna
   linka — to stačí a nic to nepřebíjí. */
/* Sloupec končí tam, kde končí jeho obsah. Dorovnávat ho na výšku
   levého už není potřeba — obě poloviny zavírá společná linka
   v .zdroj-uzavreni. */
.zdroj { border-left: 0; padding-left: 0; }


.zdroj-nadpis {
  margin: 0 0 10px;
  font-family: var(--font-display);
  font-size: clamp(20px, 2.1vw, 26px);
  line-height: 1.16; letter-spacing: -.02em; font-weight: 750;
  color: var(--text); text-wrap: balance;
}
.zdroj-uvod { margin: 0; font-size: 15px; line-height: 1.65; color: var(--body); }

/* Odrážky dostaly vzduch. Není to výplň, aby se sloupce srovnaly —
   je to čitelnost: čtyři tvrzení nalepená na sebe se čtou jako výčet
   funkcí, s odstupem jako čtyři samostatné důvody. Sloupec tím
   zároveň přestane být o polovinu kratší než vizuál vedle. */
.zdroj-body { list-style: none; margin: 30px 0 0; padding: 0; display: grid; gap: 34px; }
.zdroj-bod { display: grid; grid-template-columns: auto 1fr; gap: 11px; align-items: start; }
.zdroj-ik {
  flex: 0 0 auto; margin-top: 2px;
  width: 19px; height: 19px; border-radius: 50%;
  display: grid; place-items: center;
  background: rgba(124,58,237,.1); color: var(--violet7);
}
.zdroj-ik svg { display: block; width: 12px; height: 12px; }
.zdroj-bod b { display: block; font-size: 14.5px; font-weight: 650; color: var(--text); line-height: 1.35; }
.zdroj-bod span { display: block; margin-top: 5px; font-size: 13.5px; line-height: 1.62; color: var(--body); }

/* Patička buňky — dnešní stav: rozšíření dodáváme, v obchodu není.
   Až tam bude, mění se tenhle odstavec a přibývá odkaz (varianta A
   z odpovědi na bod 1 příkazu č. 157). Nic jiného v buňce se nemění. */
.zdroj-pata { margin: 0; font-size: 11.5px; line-height: 1.55; color: var(--muted); }

/* ── Ilustrace: tři profily, každý s vlastní kartou do ATS ──────────
   LOGO POSKYTOVATELE JE POVINNÉ (Jiří, 25. 8.) — u každé služby, kterou
   zmiňujeme, musí být její značka.

   KAŽDÝ PROFIL MÁ SVOU KARTU. Jedno okno pro tři lidi byla chyba:
   vypadalo to, že se ukládá jen ten vepředu. Najíždí se na konkrétního
   člověka a vyjede jeho záznam.

   V klidu z karty kouká jen spodní pruh — ten s výsledkem. Návštěvník
   tedy vidí, CO to udělá, a po najetí JAK. */
:root {
  --zdroj-zasun: 96px;    /* o kolik je karta ATS schovaná za profilem */
}

/* REZERVA NA VYJETÍ JEN TAM, KDE JE VYJETÍ TRVALÉ.
   Původně tu bylo padding-bottom: 96px vždycky — místo, kam vyjede
   okno posledního bloku. Jenže při myši je vyjetí OKAMŽIK, ne stav:
   96 px prázdna se drželo pořád kvůli něčemu, co je vidět vteřinu.
   Vysouvání dělá transform, ten layout nemění, takže vyjeté okno
   klidně přeteče přes spodní linku — je zvednuté z-indexem a je to
   hover, ne klid.

   Na dotyku jsou karty vysunuté NATRVALO (@media hover: none),
   a tam rezerva zůstává — jinak by okno leželo přes patičku. */
.zdroj-scena {
  display: grid; gap: 10px;
  margin: 20px 0 0;
  padding-bottom: 0;
}
/* REZERVA 28 PX, NE 96. Kodér 25. 8. našel, že úplné zrušení rezervy
   má cenu: vyjeté okno posledního bloku přeteče uzavírací linku
   a zakryje popisek pod ní — zrovna ten, který na najetí vyzývá
   („Ilustrace rozhraní. Najeďte myší na kteréhokoli z nich.").

   28 px je NAMĚŘENÁ hodnota, ne odhad: přesně o tolik okno linku
   přeteče. Ověřeno při 1200 / 1440 / 1893 px — všude 28.

   Pod zlomem 1100 px se buňka skládá do jednoho sloupce, tam okno
   linku nepřeteče vůbec (při 1024 px zbývá 61 px pod ním), takže
   se tam nerezervuje nic. */
@media (min-width: 1101px) { .zdroj-scena { padding-bottom: 28px; } }

.zdroj-blok {
  position: relative;
  cursor: pointer;
  border-radius: var(--r-md);
}
.zdroj-blok:focus-visible { outline: 2px solid var(--violet); outline-offset: 6px; }
/* Drobné schodiště — čte se to jako průchod lidmi, ne jako tabulka. */
.zdroj-blok-2 { margin-left: 26px; }

/* Značka poskytovatele na každé kartě. Banner z profilu odpadl kvůli
   výšce a kvůli tomu, že byl u všech tří stejný — logo v rohu udrží
   pravidlo „u každé služby její značka" a nestojí to 80 px na kartu. */
.zdroj-znacka {
  position: absolute; z-index: 3; top: 14px; right: 16px;
  width: 20px; height: 20px; border-radius: 4px; display: block;
}
.zdroj-karta {
  position: relative; z-index: 2;
  display: block; width: 100%; height: auto;
  border-radius: var(--r-md); border: 1px solid var(--line);
  background: var(--card);
  box-shadow: 0 12px 30px -18px rgba(15,23,42,.6);
}

/* Karta ATS: v klidu zasunutá za profil, po najetí vyjede a jde nahoru,
   aby překryla to, co je pod ní. Zasunutí dělá záporný margin (mění
   layout, takže sloupec je v klidu kompaktní), vysunutí transform
   (layout nemění, takže nic nepodskočí). */
.zdroj-okno {
  position: relative; z-index: 1;
  margin: calc(-1 * var(--zdroj-zasun)) 0 0 26px;
  padding: 13px 15px 14px; border-radius: var(--r-md);
  background: var(--card);
  border: 1px solid rgba(124,58,237,.28);
  box-shadow: 0 14px 34px -18px rgba(15,23,42,.5), 0 0 0 4px rgba(124,58,237,.06);
  transition: transform .32s cubic-bezier(.22,.9,.3,1), box-shadow .32s ease;
  will-change: transform;
}
.zdroj-blok:hover .zdroj-okno,
.zdroj-blok:focus-visible .zdroj-okno {
  transform: translateY(var(--zdroj-zasun));
  z-index: 6;
  box-shadow: 0 26px 54px -22px rgba(15,23,42,.6), 0 0 0 4px rgba(124,58,237,.14);
}
.zdroj-blok:hover, .zdroj-blok:focus-visible { z-index: 6; }

.zdroj-usko {
  position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%);
  width: 34px; height: 3px; border-radius: 2px;
  background: rgba(124,58,237,.3);
  transition: opacity .2s ease;
}
.zdroj-blok:hover .zdroj-usko { opacity: 0; }

.zdroj-okno-hlava {
  display: flex; align-items: center; gap: 8px;
  padding: 0 0 9px; margin-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.zdroj-okno-hlava img { height: 14px; width: auto; display: block; }
.zdroj-okno-hlava span {
  font-size: 10px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted);
}

.zdroj-pole { margin: 0; display: grid; gap: 5px; }
.zdroj-pole > div { display: grid; grid-template-columns: 76px 1fr; align-items: baseline; gap: 10px; }
.zdroj-pole dt { font-size: 11px; color: var(--muted); }
.zdroj-pole dd { margin: 0; font-size: 12.5px; font-weight: 600; color: var(--text); }
.zdroj-pole dd i {
  font-style: normal; font-size: 10.5px; font-weight: 700;
  color: var(--violet7); background: rgba(124,58,237,.1);
  padding: 1px 6px; border-radius: var(--r-full); margin-left: 5px;
}

.zdroj-hotovo {
  display: flex; align-items: center; gap: 8px;
  margin: 11px 0 0; padding: 7px 10px; border-radius: 9px;
  background: rgba(16,185,129,.09);
  font-size: 12.5px; color: var(--text);
}
.zdroj-hotovo b { color: var(--violet7); font-weight: 700; }
.zdroj-fajfka {
  flex: 0 0 auto; width: 17px; height: 17px; border-radius: 50%;
  display: grid; place-items: center; color: #fff; background: #10B981;
}
.zdroj-fajfka svg { display: block; width: 11px; height: 11px; }

.zdroj-drobne { margin: 8px 0 0; font-size: 11px; line-height: 1.5; color: var(--muted); }

/* ── ZAKONČENÍ BUŇKY ────────────────────────────────────────────────
   Jeden řádek přes obě poloviny a nad ním vlasová linka. Řeší tři věci
   najednou, které spolu souvisely víc, než bylo vidět:

   1) Buňka neměla spodní hranu. Sloupce sice končily na téže lince,
      ale byla to linka POMYSLNÁ — bílo pod posledním obrázkem vlevo
      a bílo pod poslední odrážkou vpravo nemělo čím skončit.
   2) Obě drobné poznámky držel na dně margin-top: auto. Vzdálenost
      k vlastnímu obsahu tím vyrostla na 157 px vpravo a 123 px vlevo,
      zatímco pod buňkou bylo 0 px. Poznámka pak patří tomu, co je
      blíž — a blíž byl Microsoft.
   3) Linka mění význam toho bíla: nad ní je vzduch uvnitř buňky,
      pod ní začíná přechod k další výloze.

   Není to nový prvek. Přesně tohle zakončení má .skrin-zaver (č. 178)
   (site.css) i .dukaz (dukaz.css) — margin, padding, vlasová linka
   var(--line). Tahle buňka ho jako jediná v celé skříni neměla. */
.zdroj-uzavreni {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr);
  gap: 44px; align-items: start;
  margin-top: 24px; padding-top: 20px;
  border-top: 1px solid var(--line);
}
.zdroj-uzavreni p { margin: 0; font-size: 11.5px; line-height: 1.55; color: var(--muted); }
.zdroj-popisek { margin: 0 !important; }

/* ── ODSTUP OD DALŠÍ VÝLOHY ─────────────────────────────────────────
   Sousedské selektory rytmu v dukaz.css vyjmenovávají .duo a .vyloha:

     .skrin .duo + .duo, .skrin .duo + .vyloha,
     .skrin .vyloha + .duo { margin-top: 64px; }

   .zdroj-duo je vlastní prefix (pravidlo 1 z přehledu příkazů), takže
   do žádného z nich nespadá a mezera pod buňkou byla PŘESNĚ 0 px —
   karta Microsoftu začínala na tomtéž pixelu, kde buňka končila.
   Komentář u toho pravidla přitom popisuje tutéž chybu o jedno kolo
   dřív („poslední věta dosud narazila rovnou do karty Microsoftu").

   Cena za vlastní prefix je tahle: nový blok vypadne ze všech
   existujících sousedských selektorů a musí se do rytmu přihlásit sám.
   Proto obě strany — ať přežije i příští přeskládání pořadí. */
.skrin .duo + .zdroj-duo,
.skrin .vyloha + .zdroj-duo { margin-top: 72px; }
/* .zdroj-duo končí textem, ne kartou → bez stínu, který by mezeru
   ukrojil. */
.skrin .zdroj-duo + .duo,
.skrin .zdroj-duo + .vyloha { margin-top: 56px; }
@media (max-width: 900px) {
  .skrin .zdroj-duo + .duo,
  .skrin .zdroj-duo + .vyloha,
  .skrin .duo + .zdroj-duo,
  .skrin .vyloha + .zdroj-duo { margin-top: 44px; }
  .zdroj-uzavreni { grid-template-columns: 1fr; gap: 10px; }
}

/* Na dotyku se nenajíždí — karty jsou vysunuté vždycky. */
@media (hover: none) {
  /* Tady je vyjetí trvalý stav, takže se pod scénu vrací rezerva. */
  .zdroj-scena { padding-bottom: var(--zdroj-zasun); }
  .zdroj-okno { transform: translateY(var(--zdroj-zasun)); }
  .zdroj-usko { display: none; }
  .zdroj-blok { cursor: default; }
  /* Na telefonu není myš a karty jsou vysunuté rovnou — pokyn
     „najeďte myší" by tam byl návod k něčemu, co nejde udělat. */
  .zdroj-navod { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .zdroj-okno { transition: none; }
}

@media (max-width: 520px) {
  .zdroj-blok-2 { margin-left: 0; }
  .zdroj-okno { margin-left: 12px; }
  .zdroj-pole > div { grid-template-columns: 64px 1fr; }
}