/* web_066eebd919d04d11a0af816eb8ee69ae early-years.css */
/* Sekce Historie (symbol sekceHistorie). V editoru jsou milníky pod sebou, na webu je skript
   „Historie – časová osa (chování)" složí do přišpendlené osy řízené scrollem. */
.sekce-historie.ev-aktivni { padding-top: 0 !important; padding-bottom: 0 !important; }
.sekce-historie.ev-aktivni > .ev-data, .sekce-historie.ev-aktivni > .ev-hlavicka { display: none; }
.ev-stage, .ev-stage button, .ev-stage p { font-family: "URW Grotesk", sans-serif; }
.ev-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; display: flex; flex-direction: column; justify-content: center;
  padding-top: calc(88px + var(--aktuality-h, 0px)); }
@media (min-width: 768px) { .ev-stage { padding-top: calc(96px + var(--aktuality-h, 0px)); } }
.ev-stage .ev-kont { width: 100%; max-width: 1520px; margin: 0 auto; position: relative; }
.ev-stage .ev-hlavicka { display: block; }
/* nízké obrazovky (13" notebook, okno ~650–760 px): flex by pás roků stlačil a čísla usekl (Lukáš 22. 10.)
   → nic se nesmršťuje, roky a mezery se řídí i výškou okna */
.ev-stage > *, .ev-stage .ev-kont > * { flex-shrink: 0; }
@media (max-height: 780px) {
  .ev-stage .ev-hlavicka > p:last-child { display: none; }   /* úvodní věta se nevejde, nadpis stačí */
  .ev-stage .ev-hlavicka h2 { font-size: clamp(1.75rem, 5.2vh, 3rem) !important; }
}
.ev-rail { margin-top: 56px; overflow: hidden; padding-bottom: .12em;
  -webkit-mask-image: linear-gradient(to right, #000 72%, transparent 100%); mask-image: linear-gradient(to right, #000 72%, transparent 100%); }
.ev-rail:focus-visible { outline: 2px solid #fbc736; outline-offset: 6px; }
@media (min-width: 768px) { .ev-rail { margin-top: clamp(28px, 9vh, 112px); } }
.ev-track { display: flex; align-items: baseline; width: max-content; will-change: transform; }
.ev-year { position: relative; flex: none; background: none; border: 0; padding: 0 .06em; cursor: pointer; font-weight: 600;
  letter-spacing: -.05em; line-height: .95; font-size: clamp(3.25rem, min(12vw, 19vh), 10.5rem); font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1; color: inherit; }
.ev-year-base { color: rgba(255,255,255,.07); }
.ev-year-on { position: absolute; left: .06em; top: 0; color: #fbc736; opacity: var(--on, 0); pointer-events: none; }
.ev-axis { position: relative; height: 2px; margin: 40px 8px 0; background: rgba(255,255,255,.14); }
@media (min-width: 768px) { .ev-axis { margin-top: clamp(24px, 5vh, 52px); } }
.ev-dot { position: absolute; top: 50%; translate: -50% -50%; width: 26px; height: 26px; border: 0; border-radius: 999px; background: none; display: grid; place-items: center; cursor: pointer; }
.ev-dot::after { content: ""; width: 7px; height: 7px; border-radius: 999px; background: rgba(255,255,255,.3); transition: background .4s, transform .4s cubic-bezier(.16,.84,.3,1); }
.ev-dot:hover::after { background: rgba(255,255,255,.75); transform: scale(1.25); }
.ev-ball { position: absolute; top: 50%; left: 0; translate: -50% -50%; width: 14px; height: 14px; border-radius: 999px; background: #fbc736; pointer-events: none; z-index: 2; }
.ev-spodek { position: relative; }
.ev-copy { position: relative; margin-top: 34px; min-height: 160px; padding-right: 104px; }
@media (min-width: 768px) { .ev-copy { margin-top: clamp(24px, 4.5vh, 48px); min-height: 130px; padding-right: 140px; } }
.ev-text { position: absolute; inset: 0; max-width: 40ch; text-wrap: pretty; font-size: 1.25rem; line-height: 1.45; letter-spacing: -.01em; font-weight: 300;
  color: rgba(255,255,255,.72); opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity .18s ease, transform .4s cubic-bezier(.16,.84,.3,1); }
@media (min-width: 768px) { .ev-text { font-size: 1.75rem; line-height: 1.35; } }
.ev-text strong { font-weight: 500; color: #fff; }
.ev-text.is-on { opacity: 1; transform: none; pointer-events: auto; transition: opacity .4s ease .14s, transform .55s cubic-bezier(.16,.84,.3,1) .14s; }
.ev-nav { position: absolute; top: 34px; right: 0; display: flex; gap: 8px; }
@media (min-width: 768px) { .ev-nav { top: clamp(24px, 4.5vh, 48px); gap: 12px; } }
.ev-navbtn { width: 44px; height: 44px; border: 0; border-radius: 12px; background: rgba(243,243,243,.1); display: grid; place-items: center; cursor: pointer; color: #fff; transition: background-color .25s, opacity .25s; }
@media (min-width: 768px) { .ev-navbtn { width: 52px; height: 52px; } }
.ev-navbtn:hover { background: rgba(243,243,243,.2); }
.ev-navbtn:disabled { opacity: .3; cursor: default; background: rgba(243,243,243,.08); }
.ev-navbtn svg { width: 20px; height: 20px; }
@media (prefers-reduced-motion: reduce) { .ev-track, .ev-ball, .ev-text { transition: none; } }
/* Osa se stupni (symbol Časová osa – stupeň): ikona + název + text místo věty milníku, tlačítka pod textem */
.ev-tlacitka:not(:has(*)) { display: none; }
.ev-copy--stupne { min-height: 130px; }
.ev-slide { max-width: none; font-size: inherit; line-height: inherit; }
.ev-slide .osa-radek { margin-top: 0 !important; }
.ev-spodek .ev-tlacitka { margin-top: 20px; max-width: none; margin-left: 0; margin-right: 0; }
@media (max-width: 767px) { .ev-copy--stupne { min-height: 190px; } }
/* nadpis osy je kopie původní hlavičky i se třídou objevování – kopie se nesleduje, musí být vidět hned */
.ev-stage .sc-reveal { opacity: 1; transform: none; }
/* Žebřík úrovní (symbol Žebřík úrovní – sloupec v kontejneru .st-row) */
.st-wrap { overflow-x: auto; scrollbar-width: none; }
.st-wrap::-webkit-scrollbar { display: none; }
.st-row { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(180px, 1fr); gap: 18px; align-items: end; height: 420px; min-width: 100%; }
@media (min-width: 768px) { .st-row { height: 557px; } }
.st-row.st-aktivni .st-col { height: 0; transition: height 1.8s cubic-bezier(.16,.84,.3,1); }
.st-row.st-aktivni .st-in { min-height: 0; }
.st-row.st-aktivni .st-in > span { opacity: 0; transition: opacity .5s ease; }
.st-row.st-aktivni .st-col.is-on .st-in > span { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .st-row.st-aktivni .st-col, .st-row.st-aktivni .st-in > span { transition: none; } }

/* Časté otázky (symbol Častá otázka) */
.faq-plus::before, .faq-plus::after { content: ""; position: absolute; top: 50%; left: 50%; translate: -50% -50%; background: #1a1a1a; }
.faq-plus::before { width: 16px; height: 1.5px; }
.faq-plus::after { width: 1.5px; height: 16px; }
.faq-plus { transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.faq-item.is-open .faq-plus { transform: rotate(45deg); }
.faq-q > span:first-child { transition: opacity .25s ease; }
.faq-q:hover > span:first-child { opacity: .6; }
.faq-q:focus-visible { outline: 2px solid #fbc736; outline-offset: -2px; }
.faq-js .faq-a-wrap { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .45s cubic-bezier(.16,.84,.3,1); }
.faq-js .faq-item.is-open .faq-a-wrap { grid-template-rows: 1fr; }
.faq-js .faq-a { opacity: 0; transition: opacity .3s ease; }
.faq-js .faq-item.is-open .faq-a { opacity: 1; transition-delay: .12s; }
@media (prefers-reduced-motion: reduce) { .faq-a-wrap, .faq-a, .faq-plus { transition: none !important; } }
/* Profil dítěte (symbol Profil dítěte – bublina): cestička se kreslí scrollem (skript), aktivní bublina se zvětší,
   rozzáří a z jejích hran vybuchne třpyt v barvě bubliny (V2, schváleno 21.–22. 10.; kreslí skript do plátna .prof-prach) */
.prof--modra { --c: #3d7cc4; } .prof--ruzova { --c: #d4506f; } .prof--zelena { --c: #4a9a48; } .prof--tyrkysova { --c: #2c948a; }
.prof--fialova { --c: #8a5fc0; } .prof--oranzova { --c: #e2823a; } .prof--zluta { --c: #d9a300; }
.prof-path { position: absolute; top: 0; bottom: 0; left: 6px; width: 28px; height: 100%; overflow: visible; pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 160px, #000 calc(100% - 160px), transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 160px, #000 calc(100% - 160px), transparent); }
.prof-path path { fill: none; stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.prof-path-base { stroke: #e6e2d6; }
.prof-path-fill { stroke: #fbc736; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset .15s linear; }
.prof-card { position: relative; transform: scale(1); transform-origin: left center; transition: transform .6s cubic-bezier(.16,.84,.3,1), box-shadow .9s ease; }
/* aktivní bublina: zvětšení a velká měkká záře v barvě bubliny – dvě vrstvy, blízká sytá a velká jemná (21. 10.) */
.prof-step.is-on .prof-card { transform: scale(1.045);
  box-shadow: 0 18px 40px -18px rgba(26,26,26,.22), 0 0 0 1px color-mix(in srgb, var(--c) 22%, transparent),
              0 0 60px 4px color-mix(in srgb, var(--c) 30%, transparent),
              0 0 160px 40px color-mix(in srgb, var(--c) 23%, transparent); }
/* plátno s třpytem přesahuje bublinu o 90 px na každou stranu */
.prof-prach { position: absolute; left: -90px; top: -90px; width: calc(100% + 180px); height: calc(100% + 180px); pointer-events: none; z-index: 3; }
@media (min-width: 768px) {
  .prof-path { left: 50%; width: 140px; margin-left: -70px; }
  .prof-l .prof-card { transform-origin: right center; }
  .prof-r .prof-card { transform-origin: left center; }
}
@media (prefers-reduced-motion: reduce) {
  .prof-card, .prof-step.is-on .prof-card { transform: none; }
  .prof-card, .prof-path-fill { transition: none; }
  .prof-path-fill { stroke-dashoffset: 0; }
}
/* Nepravidelné „bubliny“ profilu dítěte – v editoru je zaoblení jednoduché (48 px), na webu každá bublina jinak */
.prof--modra .prof-card { border-radius: 34px 58px 40px 62px / 52px 38px 60px 42px !important; }
.prof--ruzova .prof-card { border-radius: 60px 36px 56px 44px / 40px 58px 36px 56px !important; }
.prof--zelena .prof-card { border-radius: 44px 52px 62px 38px / 56px 40px 50px 58px !important; }
.prof--tyrkysova .prof-card { border-radius: 58px 40px 42px 60px / 38px 56px 60px 40px !important; }
.prof--fialova .prof-card { border-radius: 40px 62px 50px 46px / 60px 42px 52px 38px !important; }
.prof--oranzova .prof-card { border-radius: 54px 38px 60px 42px / 42px 60px 38px 56px !important; }
.prof--zluta .prof-card { border-radius: 48px 56px 38px 62px / 58px 40px 56px 44px !important; }
/* Mateřská škola – Cesta za Sluncem: nálepky (text se vysune zespodu, až je blok vidět) + bublina s ocáskem k Losíkovi */
.losik-hello.ceka .sticker > span { transform: translateY(115%); }
.losik-hello .sticker > span { display: block; transition: transform 1s cubic-bezier(.16,.84,.3,1); }
.losik-hello .sticker-2 > span { transition-delay: .14s; }
.sticker { overflow: clip; white-space: nowrap; font-size: clamp(1.05rem, 6.9vw, 2.115rem) !important; }
.losik-bubble { position: relative; }
.losik-bubble::before { content: ""; position: absolute; border-style: solid; border-color: transparent; top: -22px; left: 48px; border-width: 0 20px 22px 20px; border-bottom-color: #fff; }
@media (min-width: 1024px) { .losik-bubble::before { top: 50%; left: -26px; transform: translateY(-50%); border-width: 22px 26px 22px 0; border-bottom-color: transparent; border-right-color: #fff; } }

/* Losíkův rok – vějíř přes celou šířku okna, oblouk podle vzdálenosti od středu (--d nastavuje skript) */
.fan-wrap { overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; cursor: grab; margin-inline: calc(50% - 50vw); }
.fan-wrap::-webkit-scrollbar { display: none; }
.fan-wrap.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.fan-wrap.is-dragging .fan-item { transition: none; }
.fan-row { width: max-content; padding: 0 40px 7rem; }
@media (min-width: 768px) { .fan-row { padding: 0 120px 8rem; } }
@media (min-width: 1600px) { .fan-row { padding-inline: 180px; } }
.fan-item { --d: 0; --x: 0px; --delay: 0s; scroll-snap-align: center; transform: translate3d(var(--x), calc(var(--d) * var(--d) * 96px), 0); transition: transform .35s cubic-bezier(.16,.84,.3,1); }
.fan-wrap.is-stacked .fan-item, .fan-wrap.is-stacked .fan-tile { transition: none; }
.fan-wrap.is-stacked .fan-cap { opacity: 0; }
.fan-wrap.is-open .fan-item { transition: transform 1s cubic-bezier(.16,.84,.3,1); transition-delay: var(--delay); }
.fan-wrap.is-open .fan-tile { transition: transform 1s cubic-bezier(.16,.84,.3,1), box-shadow .4s ease; transition-delay: var(--delay); }
.fan-cap { transition: opacity .5s ease; transition-delay: var(--delay); }
.fan-tile { transform: rotate(calc(var(--d) * 16deg)); transform-origin: center bottom; transition: transform .35s cubic-bezier(.16,.84,.3,1), box-shadow .4s ease; }
.fan-item:hover .fan-tile { transform: rotate(calc(var(--d) * 16deg)) translateY(-14px) scale(1.04); box-shadow: 0 26px 56px rgba(26,26,26,.2); }
.fan-sub:empty { display: none; }
@media (max-width: 767px) {
  .fan-item { transform: translateY(calc(var(--d) * var(--d) * 26px)); }
  .fan-tile, .fan-item:hover .fan-tile { transform: rotate(calc(var(--d) * 6deg)); }
}
@media (prefers-reduced-motion: reduce) { .fan-item, .fan-tile { transition: none; transform: none; } .losik-hello.ceka .sticker > span { transform: none; } }

/* Kniha ŠVP – listování jako v knize (stránky, list a šipky staví skript) */
.kn-plocha { position: relative; perspective: 2800px; }
.kn-kniha { position: relative; margin: 0 auto; width: min(100%, 980px); aspect-ratio: 1800 / 1278; transform-style: preserve-3d; filter: drop-shadow(0 26px 46px rgba(26,26,26,.16)); }
.kn-pul { position: absolute; top: 0; width: 50%; height: 100%; background: #fff; overflow: hidden; }
.kn-pul--l { left: 0; } .kn-pul--p { right: 0; }
.kn-pul img, .kn-tvar img { display: block; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.kn-pul[hidden] { display: none; }
.kn-pul::after { content: ''; position: absolute; top: 0; bottom: 0; width: 42px; pointer-events: none; }
.kn-pul--l::after { right: 0; background: linear-gradient(to left, rgba(26,26,26,.16), rgba(26,26,26,0)); }
.kn-pul--p::after { left: 0; background: linear-gradient(to right, rgba(26,26,26,.16), rgba(26,26,26,0)); }
.kn-list { position: absolute; top: 0; left: 50%; width: 50%; height: 100%; transform-origin: left center; transform-style: preserve-3d; transition: transform .68s cubic-bezier(.45,.05,.25,1); z-index: 4; visibility: hidden; }
.kn-kniha.je-list .kn-list { visibility: visible; }
.kn-tvar { position: absolute; inset: 0; backface-visibility: hidden; background: #fff; overflow: hidden; }
.kn-tvar--zad { transform: rotateY(180deg); }
.kn-tvar::after { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .68s; }
.kn-tvar--pred::after { background: linear-gradient(to right, rgba(26,26,26,.22), rgba(26,26,26,0) 38%); }
.kn-tvar--zad::after { background: linear-gradient(to left, rgba(26,26,26,.22), rgba(26,26,26,0) 38%); }
.kn-kniha.je-list .kn-tvar::after { opacity: 1; }
.kn-zona { position: absolute; top: 0; width: 50%; height: 100%; z-index: 6; background: none; border: 0; cursor: pointer; }
.kn-zona--l { left: 0; } .kn-zona--p { right: 0; }
.kn-zona:disabled { cursor: default; }
.kn-btn { width: 52px; height: 52px; border-radius: 999px; border: 1px solid rgba(26,26,26,.2); background: transparent; color: #1a1a1a; display: grid; place-items: center; cursor: pointer; transition: background-color .3s, color .3s, border-color .3s, opacity .3s; }
.kn-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.kn-btn:hover:not(:disabled) { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
.kn-btn:disabled { opacity: .3; cursor: default; }
.kn-sipka { position: absolute; top: 50%; transform: translateY(-50%); z-index: 7; }
.kn-sipka--zpet { left: 0; } .kn-sipka--vpred { right: 0; }
@media (max-width: 1100px) {
  .kn-plocha { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
  .kn-kniha { flex: 0 0 100%; order: 1; margin-bottom: 20px; }
  .kn-sipka { position: static; transform: none; }
  .kn-sipka--zpet { order: 2; } .kn-sipka--vpred { order: 3; }
}
@media (max-width: 767px) {
  .kn-kniha { aspect-ratio: 900 / 1278; width: min(100%, 420px); }
  .kn-pul--l { display: none; }
  .kn-pul--p { right: 0; width: 100%; }
  .kn-pul--p::after { display: none; }
  .kn-list { left: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .kn-list { transition: none; } }
/* Texty MŠ se píšou v editoru jako odstavce; tady jen vzhled, který editor neumí */
/* nálepky „Ahojte, děti!“: vnitřní odstavec přebírá písmo nálepky a vysouvá se zespodu */
.losik-hello .sticker > p { display: block; margin: 0; font: inherit !important; color: inherit !important; letter-spacing: inherit !important; line-height: inherit !important;
  transition: transform 1s cubic-bezier(.16,.84,.3,1); }
.losik-hello.ceka .sticker > p { transform: translateY(115%); }
.losik-hello .sticker-2 > p { transition-delay: .14s; }
/* zaoblení jako na lokále: nálepky 8 px, bublina s textem 12 px */
.losik-hello .sticker { border-radius: 8px; }
.losik-bubble { border-radius: 12px; }
/* závěrečná věta profilu: kurzíva = žlutý text bez sklonu */
.zaver-nadpis em { font-style: normal; color: #fbc736; }
/* výpis pěti paprsků: kurzíva = žluté číslo, tučně = tlumený anglický název */
.paprsky-vypis em { font-style: normal; font-weight: 600; color: #fbc736; margin-right: .35em; font-variant-numeric: tabular-nums; }
.paprsky-vypis strong { font-weight: inherit; color: rgba(255,255,255,.45); }
/* malý mobil (výška do 740 px): úvod s výpisem paprsků se nevešel do přišpendlené obrazovky → výpis ve dvou sloupcích, menší písmo (22. 10.) */
@media (max-width: 639px) and (max-height: 740px) {
  .paprsky-vypis { grid-template-columns: 1fr 1fr !important; column-gap: 14px !important; row-gap: 6px !important; margin-top: 18px !important; }
  .paprsky-vypis > p { font-size: .875rem !important; }
}
/* oblasti rozvoje: názvy na kartách na střed (feedback MŠ 20. 10.) */
.sc-rada-karet--sest .sc-flip-face:not(.sc-flip-back) h3 { text-align: center; }
@media (prefers-reduced-motion: reduce) { .losik-hello.ceka .sticker > p { transform: none; } }