/* SURTEP popisy produktu v5 (10. 10. 2026) — DOPLNĚK k v4 (v Záhlaví zůstávají oba odkazy): tabulka, průvodce velikostí, FAQ. Jen CSS, bez skriptů. */
.sp-popis{--sp-k1:#ff8a3d;--sp-k2:var(--sp-a);--sp-k3:#18b38a}
.sp-popis .sp-tabulka h2{margin-bottom:16px}
.sp-popis .sp-tabulka p{margin:0 0 12px;color:var(--sp-m)}
.sp-popis .sp-tab-obal{overflow-x:auto}
.sp-popis .sp-tab{width:100%;border-collapse:separate;border-spacing:0 8px;font-size:15px}
.sp-popis .sp-tab th{font-family:var(--sp-h);font-weight:700;font-size:12px;line-height:1.3;text-transform:uppercase;letter-spacing:.05em;color:var(--sp-m);text-align:left;padding:0 14px 4px}
.sp-popis .sp-tab th.sp-k1{color:var(--sp-k1)}.sp-popis .sp-tab th.sp-k2{color:var(--sp-k2)}.sp-popis .sp-tab th.sp-k3{color:var(--sp-k3)}
.sp-popis .sp-tab th.sp-k1:before,.sp-popis .sp-tab th.sp-k2:before,.sp-popis .sp-tab th.sp-k3:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px}
.sp-popis .sp-tab td{background:#fff;padding:14px;color:var(--sp-ink);border-top:1px solid var(--sp-line);border-bottom:1px solid var(--sp-line);transition:background .2s}
.sp-popis .sp-tab td:first-child{border-left:1px solid var(--sp-line);border-radius:14px 0 0 14px}
.sp-popis .sp-tab td:last-child{border-right:1px solid var(--sp-line);border-radius:0 14px 14px 0}
.sp-popis .sp-tab tbody tr:hover td{background:#eef2ff;border-color:#cdd7ff}
.sp-popis .sp-vel{display:inline-grid;place-items:center;min-width:38px;height:38px;padding:0 8px;border-radius:12px;background:var(--sp-ink);color:#fff;font-family:var(--sp-h);font-weight:800;font-size:15px;transition:background .2s}
.sp-popis .sp-tab tbody tr:hover .sp-vel{background:var(--sp-a)}
.sp-popis .sp-velikosti{margin:10px 0;padding:36px;border-radius:24px;background:linear-gradient(135deg,var(--sp-tint),#fff 60%);border:1px solid var(--sp-line);position:relative;overflow:hidden}
.sp-popis .sp-velikosti:before{content:"";position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(77,110,252,.14),transparent 70%);pointer-events:none}
.sp-popis .sp-vel-hlava{max-width:640px;position:relative}
.sp-popis .sp-stitek{display:inline-block;font-family:var(--sp-h);font-weight:700;font-size:12px;line-height:1;letter-spacing:.08em;text-transform:uppercase;color:var(--sp-a);background:rgba(77,110,252,.1);padding:7px 12px;border-radius:99px}
.sp-popis .sp-vel-hlava h2{font-weight:800;font-size:30px;line-height:1.15;margin:14px 0 8px}
.sp-popis .sp-vel-hlava p{color:var(--sp-m)}
.sp-popis .sp-vel-telo{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:32px;align-items:center;margin-top:28px;position:relative}
.sp-popis .sp-vel-obr{margin:0;background:#fff;border-radius:20px;padding:16px 20px;box-shadow:0 10px 30px -12px rgba(29,36,51,.18)}
.sp-popis .sp-pes{position:relative;aspect-ratio:900/674}
.sp-popis .sp-pes img{display:block;width:100%;height:100%;object-fit:contain}
.sp-popis .sp-m{position:absolute;border:3px solid;border-radius:50%;box-shadow:0 1px 3px rgba(0,0,0,.18);transition:opacity .25s,border-width .25s;animation:spOdkryt 1s var(--sp-ease) both}
.sp-popis .sp-m1{left:63.6%;top:28.1%;width:6.9%;height:20.8%;border-color:var(--sp-k1);transform:rotate(-14deg)}
.sp-popis .sp-m2{left:49%;top:29.2%;width:9.1%;height:37.5%;border-color:var(--sp-k2);animation-delay:.5s}
.sp-popis .sp-m3{left:20.3%;top:23.4%;width:42.2%;height:0;border:0;border-top:3px solid var(--sp-k3);border-radius:0;transform-origin:left;animation:spNatahnout .9s var(--sp-ease) 1s both}
.sp-popis .sp-m3:before,.sp-popis .sp-m3:after{content:"";position:absolute;top:-10px;width:3px;height:17px;background:var(--sp-k3);border-radius:2px}
.sp-popis .sp-m3:before{left:0}.sp-popis .sp-m3:after{right:0}
.sp-popis .sp-mk{position:absolute;display:grid;place-items:center;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;border:2px solid #fff;color:#fff;font-family:var(--sp-h);font-weight:800;font-size:12px;line-height:1;box-shadow:0 2px 6px rgba(0,0,0,.18);animation:spObjev .4s ease both;transition:opacity .25s}
.sp-popis .sp-mk1{left:76.2%;top:52.6%;background:var(--sp-k1);animation-delay:.8s}
.sp-popis .sp-mk2{left:53.5%;top:71.4%;background:var(--sp-k2);animation-delay:1.3s}
.sp-popis .sp-mk3{left:41.4%;top:17.2%;background:var(--sp-k3);animation-delay:1.8s}
@keyframes spOdkryt{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(-30%)}}
@keyframes spNatahnout{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes spObjev{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.sp-popis .sp-vel-obr figcaption{display:grid;gap:6px;font-size:14px;color:var(--sp-m);margin-top:12px;line-height:1.4}
.sp-popis .sp-vel-obr figcaption p{margin:0 -6px;padding:3px 6px;display:flex;align-items:center;gap:8px;border-radius:10px;transition:background .2s}
.sp-popis .sp-vel-obr figcaption b{color:var(--sp-ink)}
.sp-popis .sp-vel-obr figcaption span,.sp-popis .sp-tip span{flex:none}
.sp-popis .sp-vel-obr figcaption span{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;color:#fff;font-family:var(--sp-h);font-weight:800;font-size:11px}
.sp-popis span.sp-k1{background:var(--sp-k1)}.sp-popis span.sp-k2{background:var(--sp-k2)}.sp-popis span.sp-k3{background:var(--sp-k3)}
.sp-popis .sp-leg-1:hover{background:#fff1e6}.sp-popis .sp-leg-2:hover{background:#eef2ff}.sp-popis .sp-leg-3:hover{background:#e7f8f2}
.sp-popis .sp-velikosti:has(.sp-leg-1:hover,th.sp-k1:hover) :is(.sp-m,.sp-mk):not(.sp-m1,.sp-mk1),.sp-popis .sp-velikosti:has(.sp-leg-2:hover,th.sp-k2:hover) :is(.sp-m,.sp-mk):not(.sp-m2,.sp-mk2),.sp-popis .sp-velikosti:has(.sp-leg-3:hover,th.sp-k3:hover) :is(.sp-m,.sp-mk):not(.sp-m3,.sp-mk3){opacity:.18}
.sp-popis .sp-velikosti:has(.sp-leg-1:hover,th.sp-k1:hover) .sp-m1,.sp-popis .sp-velikosti:has(.sp-leg-2:hover,th.sp-k2:hover) .sp-m2{border-width:5px;animation:spPulz 1s ease-in-out infinite alternate}
.sp-popis .sp-velikosti:has(.sp-leg-3:hover,th.sp-k3:hover) .sp-m3{border-top-width:5px;animation:spPulz 1s ease-in-out infinite alternate}
@keyframes spPulz{from{opacity:1}to{opacity:.5}}
.sp-popis .sp-tab-text{margin-top:10px;color:var(--sp-m);font-size:14px}
.sp-popis .sp-tip{display:flex;gap:10px;align-items:flex-start;margin:10px 0 0;padding:12px 14px;border-radius:14px;background:#fff8ec;color:#6b4d16;font-size:14px;line-height:1.5}
.sp-popis .sp-faq h2{margin-bottom:18px}
.sp-popis .sp-faq details{border:1px solid var(--sp-line);border-radius:16px;background:#fff;margin:0 0 10px;transition:box-shadow .25s,border-color .25s}
.sp-popis .sp-faq details[open]{border-color:#cdd7ff;box-shadow:0 12px 28px -16px rgba(77,110,252,.45)}
.sp-popis .sp-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;font-family:var(--sp-h);font-weight:700;font-size:17px;line-height:1.35;color:var(--sp-ink)}
.sp-popis .sp-faq summary::-webkit-details-marker{display:none}
.sp-popis .sp-faq summary:after{content:"";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sp-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234d6efc' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/16px no-repeat;transition:transform .3s var(--sp-ease),background-color .3s}
.sp-popis .sp-faq details[open] summary:after{transform:rotate(135deg);background-color:#e3e9ff}
.sp-popis .sp-faq details>div{padding:0 22px 18px;color:var(--sp-m);line-height:1.65;animation:spRozbal .35s var(--sp-ease)}
.sp-popis .sp-faq details>div p{margin:0 0 10px}
.sp-popis .sp-faq details>div h3{font-size:16px;margin:4px 0 8px;color:var(--sp-ink)}
.sp-popis .sp-faq details>div li{position:relative;padding-left:18px;margin:0 0 6px}
.sp-popis .sp-faq details>div li:before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--sp-a)}
@keyframes spRozbal{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:767px){.sp-popis .sp-velikosti{padding:22px 16px;border-radius:18px}.sp-popis .sp-vel-telo{grid-template-columns:1fr;gap:18px}.sp-popis .sp-vel-hlava h2{font-size:24px}.sp-popis .sp-tab{font-size:13px;border-spacing:0 6px}.sp-popis .sp-tab th{font-size:10px;padding:0 6px 4px;letter-spacing:.02em}.sp-popis .sp-tab td{padding:9px 6px}.sp-popis .sp-tab td:first-child{padding-left:8px}.sp-popis .sp-vel{min-width:30px;height:30px;border-radius:9px;font-size:13px}.sp-popis .sp-tab th:before{display:none}.sp-popis .sp-faq summary{padding:16px}}
@media (prefers-reduced-motion:reduce){.sp-popis :is(.sp-m,.sp-mk,.sp-faq details>div){animation:none!important}}