/* Animace firemních workshopů (Školení B2B). Vše scopované třídou .ws-anim.
   JS: js/workshop-animace.js. Respektuje prefers-reduced-motion. */
.ws-anim{max-width:960px;margin:0 auto}
.ws-card{
  container-type:inline-size;
  position:relative;overflow:hidden;border-radius:28px;
  aspect-ratio:16/10;min-height:340px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(60% 55% at 50% 48%, rgba(255,138,61,.16), transparent 70%),
    radial-gradient(90% 80% at 85% 10%, rgba(255,255,255,.05), transparent 60%),
    linear-gradient(180deg,#1B1813 0%,#14120F 55%,#0E0C0A 100%);
  box-shadow:0 30px 80px -30px rgba(20,18,15,.55);
}
.ws-card canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.ws-slides{position:absolute;inset:0;display:grid;place-items:center;padding:clamp(20px,5vw,56px);text-align:center;pointer-events:none}
.ws-slide{grid-area:1/1;width:100%;max-width:820px;opacity:0;visibility:hidden}
.ws-slide.je-aktivni{visibility:visible;opacity:1}
.ws-slide h2{margin:0;font:700 clamp(30px,8.4cqw,68px)/1.02 var(--head,"Crimson Pro",Georgia,serif);letter-spacing:-.015em;color:#fff;text-wrap:balance}
.ws-slide h2 em{display:block;font-style:normal;color:var(--oranz-na-tmave,#FF8A3D)}
.ws-slide p{margin:clamp(14px,2vw,22px) auto 0;max-width:34ch;font:400 clamp(15px,2.3cqw,22px)/1.5 var(--sans,"IBM Plex Sans",Arial,sans-serif);color:rgba(255,255,255,.82);text-shadow:0 1px 14px rgba(14,12,10,.8)}

/* vstup a výstup textu: řádky vyjedou zespodu, jeden po druhém */
.ws-slide .r{display:block;opacity:0;transform:translateY(22px);filter:blur(6px)}
.ws-slide.je-aktivni .r{animation:ws-vstup .8s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i)*.12s + .1s)}
.ws-slide.odchazi{visibility:visible;opacity:1}
.ws-slide.odchazi .r{opacity:1;transform:none;filter:none;animation:ws-vystup .45s ease forwards;animation-delay:calc(var(--i)*.04s)}
@keyframes ws-vstup{to{opacity:1;transform:none;filter:blur(0)}}
@keyframes ws-vystup{to{opacity:0;transform:translateY(-14px);filter:blur(4px)}}

.ws-pauza{
  position:absolute;right:clamp(14px,2.4vw,24px);bottom:clamp(14px,2.4vw,24px);
  width:46px;height:46px;border-radius:50%;
  border:1px solid rgba(255,255,255,.22);background:rgba(20,18,15,.55);
  backdrop-filter:blur(6px);color:#fff;cursor:pointer;display:grid;place-items:center;
  transition:background .2s,border-color .2s;
}
.ws-pauza:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.4)}
.ws-pauza:focus-visible,.ws-krok:focus-visible{outline:3px solid var(--oranz-na-tmave,#FF8A3D);outline-offset:3px}
.ws-pauza svg{width:16px;height:16px;fill:currentColor}
.ws-pauza .i-play{display:none}
.ws-pauza[aria-pressed="true"] .i-play{display:block}
.ws-pauza[aria-pressed="true"] .i-pauza{display:none}

/* ukazatel pod kartou: pět úseků s popisky */
.ws-kroky{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:clamp(8px,1.6vw,18px);margin-top:18px}
.ws-krok{all:unset;text-align:center;box-sizing:border-box;cursor:pointer;display:block;padding-top:14px;position:relative}
.ws-krok::before,.ws-krok::after{content:"";position:absolute;left:0;top:0;height:3px;border-radius:3px}
.ws-krok::before{right:0;background:rgba(20,18,15,.14)}
.ws-krok::after{width:calc(var(--vypln,0)*100%);background:var(--oranz,#F25C05)}
.ws-krok span{font:500 14px/1.3 var(--sans);color:#6b675e;transition:color .2s;text-align:center;display:block}
.ws-krok[aria-current="true"] span,.ws-krok:hover span{color:var(--ink,#14120F)}
.ws-krok[aria-current="true"] span{font-weight:600}
@media (max-width:640px){
  .ws-card{aspect-ratio:4/5}
  .ws-krok span{font-size:12px}
  .ws-krok:not([aria-current="true"]) span{display:none}
}
@media (prefers-reduced-motion:reduce){
  .ws-slide.je-aktivni .r{animation:none;opacity:1;transform:none;filter:none}
  .ws-slide.odchazi .r{animation:none;opacity:0}
}

/* V hero na Školení B2B sedí karta ve sloupci vedle textu, je užší a vyšší. */
.d6 .hero-anim{align-self:center;min-width:0}
.ws-anim{min-width:0}
.d6 .hero-anim .ws-card{aspect-ratio:4/3.4;min-height:0}
@media (max-width:640px){.d6 .hero-anim .ws-card{aspect-ratio:4/5}}

/* Obsah slidů navíc: před → po, čísla, svislá osa (Moje první video) */
.ws-slide .ws-popis{margin:0 auto 6px;font:500 clamp(16px,2.8cqw,26px)/1.3 var(--sans);color:rgba(255,255,255,.85)}
.ws-slide .ws-pred-po{display:flex;align-items:baseline;justify-content:center;gap:clamp(10px,2cqw,22px);margin:clamp(10px,1.6vw,18px) 0 0;max-width:none;font:700 clamp(28px,8cqw,62px)/1.05 var(--head,"Crimson Pro",Georgia,serif);flex-wrap:wrap}
.ws-slide .ws-pred-po s{color:rgba(255,255,255,.4);text-decoration:none;position:relative}
.ws-slide .ws-pred-po s::after{content:"";position:absolute;left:-4%;right:-4%;top:54%;height:3px;background:var(--oranz-na-tmave,#FF8A3D);transform:scaleX(0);transform-origin:left}
.ws-slide.je-aktivni .ws-pred-po s::after{animation:ws-skrtni .6s ease .9s forwards}
.ws-slide .ws-pred-po i{font-style:normal;font-family:var(--sans);font-weight:400;color:rgba(255,255,255,.6)}
.ws-slide .ws-pred-po b{color:var(--oranz-na-tmave,#FF8A3D)}
@keyframes ws-skrtni{to{transform:scaleX(1)}}
.ws-slide .ws-cisla{display:flex;justify-content:center;gap:clamp(12px,3.4cqw,48px);flex-wrap:nowrap;margin:clamp(18px,3vw,32px) 0 0;max-width:none}
.ws-slide .ws-cisla div{text-align:center}
.ws-slide .ws-cisla b{display:block;font:700 clamp(22px,5.6cqw,56px)/1 var(--head,"Crimson Pro",Georgia,serif);color:var(--oranz-na-tmave,#FF8A3D)}
.ws-slide .ws-cisla span{display:block;margin-top:8px;font:600 clamp(9px,1.5cqw,13px)/1.3 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.ws-slide .ws-osa{list-style:none;margin:clamp(14px,2.4vw,26px) auto 0;padding:0;max-width:none;position:relative;display:grid;gap:clamp(10px,2.4cqw,20px);justify-items:start;width:max-content}
.ws-slide .ws-osa::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:1px;background:rgba(255,255,255,.22)}
.ws-slide .ws-osa li{position:relative;padding-left:42px;font:700 clamp(20px,4.6cqw,34px)/1.1 var(--head,"Crimson Pro",Georgia,serif);color:#fff;opacity:.35;text-align:left}
.ws-slide .ws-osa li::before{content:"";position:absolute;left:5px;top:50%;width:13px;height:13px;margin-top:-6px;border-radius:50%;background:var(--oranz-na-tmave,#FF8A3D);box-shadow:0 0 0 5px rgba(255,138,61,.16)}
.ws-slide.je-aktivni .ws-osa li{animation:ws-osa 4.8s ease forwards;animation-delay:calc(var(--k)*.9s + .6s)}
@keyframes ws-osa{0%{opacity:.35}12%,100%{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .ws-slide .ws-pred-po s::after{transform:scaleX(1)}
  .ws-slide .ws-osa li{opacity:1;animation:none!important}
}

/* Slide s horou: text nahoře, hora zespodu */
.ws-slide[data-scena="hora"]{align-self:start;padding-top:clamp(4px,1.6vw,20px)}