/* PROSVIT web – stránka SportKlub: ilustrace v hero (tři evidence → SportKlub → agendy), mřížka modulů, blok ceny.
   Barvy a základ: site.css s motivem data-motiv="zeleny". */
.sk-fig { margin: 0; min-width: 0; display: grid; gap: 14px; padding: 22px; border-radius: 22px; background: linear-gradient(160deg, #0E1F16, #07110B);
  box-shadow: 0 0 0 1px var(--line), 0 40px 90px rgba(0, 0, 0, .5); font-family: var(--f-head); }
.sk-src { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.sk-src span { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--card); border: 1px solid var(--line); font-weight: 700; font-size: 15px; color: var(--text); }
.sk-src small { font: 500 11.5px/1.2 var(--f-text); color: var(--mute); }
.sk-arrow { display: grid; grid-template-columns: repeat(3, 1fr); height: 22px; }
.sk-arrow i { display: block; justify-self: center; width: 2px; height: 100%; background: linear-gradient(var(--line2), var(--acc)); position: relative; }
.sk-arrow i::after { content: ""; position: absolute; left: -4px; bottom: -1px; width: 6px; height: 6px; border-right: 2px solid var(--acc); border-bottom: 2px solid var(--acc); transform: rotate(45deg); }
.sk-core { display: grid; gap: 8px; padding: 16px 18px; border-radius: 14px; background: var(--card2); border: 1px solid var(--acc); box-shadow: 0 0 40px rgba(34, 197, 94, .15); }
.sk-core b { font-size: 18px; color: #fff; letter-spacing: .02em; display: flex; align-items: center; gap: 8px; }
.sk-core b::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--acc); box-shadow: 0 0 0 3px rgba(34, 197, 94, .22); }
.sk-row { display: flex; align-items: center; gap: 10px; font: 500 14.5px/1.3 var(--f-text); color: var(--text2); }
.sk-row em { margin-left: auto; font: 700 18px/1 var(--f-led); font-style: normal; color: #fff; font-variant-numeric: tabular-nums; }
.sk-row i { width: 9px; height: 9px; border-radius: 50%; }
.sk-row i.ok { background: var(--acc); } .sk-row i.warn { background: #FFB000; }
.sk-out { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.sk-out span { padding: 9px 10px; border-radius: 10px; background: var(--acc-soft); border: 1px solid var(--line); font: 600 13px/1.2 var(--f-head); color: var(--acc2); text-align: center; }
@media (max-width: 479px) { .sk-src span { padding: 10px; font-size: 13.5px; } .sk-out { grid-template-columns: 1fr 1fr; } .sk-fig { padding: 16px; } }

.sk-grid { display: grid; gap: 16px; }
@media (min-width: 680px) { .sk-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .sk-grid { grid-template-columns: repeat(4, 1fr); } }
.sk-grid article { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 24px 22px; counter-increment: m; }
.sk-grid h3 { font-size: 19px; padding-top: 12px; position: relative; }
.sk-grid h3::before { content: ""; position: absolute; left: 0; top: 0; width: 34px; height: 3px; background: var(--acc); border-radius: 3px; }
.sk-grid p { color: var(--text2); font-size: 14.5px; margin-top: 10px; }

.sk-cena { text-align: center; max-width: 720px; display: grid; gap: 16px; justify-items: center; }
.sk-cena p { color: var(--text2); font-size: 18px; }
.sk-cena .btn { margin-top: 6px; }
