/* Dočaska · stránka „Je to pro mě?“ a sekce „Komu dočaska pomáhá“ (2026-11-05)
   Vlastní vrstva, načítá se po style.css a redesign.css. */

/* Tři strany: zvíře, ty, spolek */
.komu{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:28px 0 0;padding:8px 8px 8px;list-style:none;
 background:var(--grain),var(--mottle-dark),var(--les);color:var(--krem);border-radius:var(--r);overflow:hidden}
.komu>li{padding:24px 28px 28px;position:relative}
.komu>li+li{border-left:1px solid rgba(244,228,197,.14)}
.komu .komu-art{display:block;width:96px;height:96px;object-fit:contain;mix-blend-mode:lighten;margin:0 0 8px}
.komu .kdo{display:block;font:700 12px/1 'Manrope',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ruz);margin:0 0 8px}
.komu h3{margin:0 0 14px;font-size:28px;line-height:1.1;color:var(--krem)}
.komu ul{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.komu ul li{padding-left:22px;position:relative;font-size:15.5px;line-height:1.5;opacity:.92}
.komu ul li::before{content:"♥";position:absolute;left:0;top:1px;font-size:12px;color:var(--ruz)}
.komu strong{color:var(--krem-hi,#FFF9EC)}
.komu-cta{display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;margin:22px 0 0}
.komu-cta p{margin:0;font-size:17px}
@media(max-width:820px){
 .komu{grid-template-columns:1fr}
 .komu>li+li{border-left:0;border-top:1px solid rgba(244,228,197,.14)}
 .komu>li{padding:22px 20px 24px}
}

/* Stránka Je to pro mě? */
.zk-sec{margin-top:80px}
.zk-sec:first-child{margin-top:0}
.zk-sec>h2{margin:0 0 8px}
.zk-sec>.intro{margin:0 0 4px;max-width:62ch;font-size:17px}
.zk-tri{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0 0;padding:0;list-style:none}
.zk-tri>li{background:var(--mottle),var(--card);border:1.5px solid var(--linka);border-radius:var(--r);padding:22px 22px 24px;box-shadow:var(--sh-1)}
.zk-tri h3{margin:0 0 6px;font-size:24px}
.zk-tri p{margin:0;font-size:15.5px}
@media(max-width:820px){.zk-tri{grid-template-columns:1fr}}

/* Kvíz */
.kviz{background:var(--mottle),var(--card);border:1.5px solid var(--linka);border-radius:var(--r);padding:8px 24px 24px;margin-top:22px;box-shadow:var(--sh-1)}
.kviz fieldset{border:0;border-bottom:1px solid var(--card-line);margin:0;padding:18px 0}
.kviz legend{float:left;width:100%;padding:0;margin:0 0 12px;font:400 22px/1.25 'Gilda Display',serif}
.kviz legend small{display:block;font:400 14.5px/1.45 'Manrope',sans-serif;opacity:.75;margin-top:4px}
.kviz .volby{clear:both;display:flex;flex-wrap:wrap;gap:8px}
.kviz label{position:relative}
.kviz input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.kviz label span{display:inline-block;padding:9px 18px;border:1.5px solid var(--linka);border-radius:999px;font:600 15px 'Manrope',sans-serif;background:var(--krem-hi,#FFF9EC);cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.kviz input:checked+span{background:var(--les);color:var(--krem);border-color:var(--les)}
.kviz input:focus-visible+span{outline:3px solid var(--ruz);outline-offset:2px}
.kviz .tip-k{display:none;margin:12px 0 0;padding:12px 14px;border-left:3px solid var(--ruz);background:rgba(240,116,172,.08);border-radius:0 10px 10px 0;font-size:15px}
.kviz fieldset[data-a="ne"] .tip-k.ne,.kviz fieldset[data-a="nevim"] .tip-k.nevim{display:block}
.kviz-vysledek{margin-top:22px;padding:22px 24px;border-radius:var(--r);background:var(--grain),var(--mottle-dark),var(--les);color:var(--krem)}
.kviz-vysledek[hidden]{display:none}
.kviz-vysledek h3{margin:0 0 6px;font-size:26px;color:var(--krem)}
.kviz-vysledek p{margin:0 0 14px}
.kviz-vysledek .actions{display:flex;flex-wrap:wrap;gap:10px}
.kviz-vysledek .btn.ghost{color:var(--krem);border-color:var(--krem)}
.kviz-stav{margin:16px 0 0;font-size:14.5px;opacity:.75}

/* Malé kroky */
.kroky-male{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:22px 0 0;padding:0;list-style:none}
.kroky-male>li{background:var(--mottle),var(--card);border:1.5px solid var(--linka);border-radius:var(--r);padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px}
.kroky-male img{width:84px;height:84px;object-fit:contain;margin:-8px 0 -4px -8px}
.kroky-male h3{margin:0;font-size:22px}
.kroky-male p{margin:0;font-size:15px;flex:1}
.kroky-male a{font-weight:700}
.kroky-male .narocnost{font:700 11.5px 'Manrope',sans-serif;letter-spacing:.12em;text-transform:uppercase;opacity:.6}

/* Průběh */
.prubeh{list-style:none;margin:24px 0 0;padding:0;counter-reset:p;position:relative}
.prubeh::before{content:"";position:absolute;left:23px;top:8px;bottom:64px;width:2px;background:var(--linka)}
.prubeh>li{counter-increment:p;position:relative;padding:0 0 24px 72px;min-height:48px}
.prubeh>li::before{content:counter(p);position:absolute;left:0;top:0;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--les);color:var(--krem);font:400 24px/1 'Gilda Display',serif}
.prubeh>li:last-child::before{background:var(--ruz);color:var(--les)}
.prubeh h3{margin:0 0 4px;font-size:23px;padding-top:9px}
.prubeh .kdy{display:inline-block;font:700 12px 'Manrope',sans-serif;letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-bottom:4px}
.prubeh p{margin:0;font-size:15.5px;max-width:62ch}

/* Kdo co dělá */
.kdo-co{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:22px 0 0}
.kdo-co>div{background:var(--mottle),var(--card);border:1.5px solid var(--linka);border-radius:var(--r);padding:20px 22px 22px}
.kdo-co>div.ty{background:var(--grain),var(--mottle-dark),var(--les);color:var(--krem);border-color:var(--les)}
.kdo-co>div.ty h3{color:var(--krem)}
.kdo-co h3{margin:0 0 10px;font-size:24px}
.kdo-co ul{margin:0;padding-left:18px;display:grid;gap:6px;font-size:15.5px}
@media(max-width:820px){.kdo-co{grid-template-columns:1fr}}

.na-jak-dlouho{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
.na-jak-dlouho>div{background:var(--mottle),var(--card);border:1.5px solid var(--linka);border-radius:var(--r);padding:20px 22px}
.na-jak-dlouho h3{margin:0 0 6px;font-size:22px}
.na-jak-dlouho p{margin:0;font-size:15.5px}
@media(max-width:820px){.na-jak-dlouho{grid-template-columns:1fr}}

.zk-faq details.tpl p{margin:0 0 18px;font-size:15.5px;max-width:66ch}
.zk-zaver{margin-top:80px}