/* Dla edukacji — style tylko dla tej podstrony. Tokeny i komponenty bazowe z site.css. */

/* hero: zdjęcie placówki o zmierzchu, powolny najazd */
.hero--edu .hero-h1{max-width:12ch}
.hero--edu .hero__sub{max-width:46ch}
.hero--edu .film img{object-position:50% 55%;transform-origin:50% 60%;animation:kb 42s ease-in-out infinite alternate}
@keyframes kb{to{scale:1.08}}

/* sytuacje: zakładki z pięcioma zdaniami, panel z punktem startu */
.sit{display:grid;gap:clamp(1.25rem,3vw,2.5rem);grid-template-columns:1fr;margin-top:clamp(2.5rem,4vw,3.5rem);align-items:start}
@media (min-width:900px){.sit{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}
.sit__tabs{display:grid;gap:.25rem}
.sit__tab{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;text-align:left;padding:1rem 1.1rem;border:1px solid transparent;border-radius:var(--r-md);background:none;color:var(--fg-muted);font:inherit;font-size:clamp(1.0625rem,1.4vw,1.25rem);font-weight:500;letter-spacing:-.014em;line-height:1.3;cursor:pointer;transition:background var(--d-hover) var(--ease-soft),color var(--d-hover) var(--ease-soft),border-color var(--d-hover) var(--ease-soft)}
.sit__tab:hover{color:var(--fg);background:var(--surface)}
.sit__tab[aria-selected="true"]{color:var(--fg);background:var(--surface);border-color:var(--hairline)}
.sit__tab::after{content:"";width:9px;height:9px;border-radius:50%;border:1px solid rgb(250 250 250 / .3);flex:none;transition:background var(--d-hover) var(--ease-soft),border-color var(--d-hover) var(--ease-soft),box-shadow var(--d-hover) var(--ease-soft)}
.sit__tab[aria-selected="true"]::after{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 4px rgb(115 96 223 / .18)}
.sit__panel{border:1px solid var(--hairline);border-radius:var(--r-lg);background:#0E0F12;box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);padding:clamp(1.5rem,3vw,2.5rem);display:none;gap:1.25rem;align-content:start;animation:panel-in 480ms var(--ease-out)}
.sit__panel.is-on{display:grid}
@keyframes panel-in{from{opacity:0;translate:0 8px;filter:blur(6px)}}
.sit__q{font-size:clamp(1.25rem,2vw,1.75rem);font-weight:500;letter-spacing:-.022em;line-height:1.22;color:var(--fg);max-width:24ch;text-wrap:pretty}
.sit__a{padding-top:1.1rem;border-top:1px solid var(--hairline)}
.sit__a span{display:block;font-size:var(--t-label);letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--fg-faint);margin-bottom:.5rem}
.sit__a p{max-width:52ch}
.sit__start{display:flex;gap:.5rem .75rem;flex-wrap:wrap;align-items:center;font-size:.875rem;color:var(--fg-faint);max-width:none}
.sit__start b{font-weight:500;color:var(--fg);padding:.3rem .75rem;border:1px solid rgb(115 96 223 / .55);border-radius:var(--r-pill);font-size:.8125rem}

/* arkusz: tekst + żywy arkusz zapisów (lejek rośnie, wiersze wjeżdżają) */
.sheetwrap{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.sheetwrap{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.sheetwrap__text{position:sticky;top:calc(16px + 62px + 2.5rem)}}
.sheetwrap__text p+p{margin-top:1rem}
.sheet{margin:0;border:1px solid var(--hairline);border-radius:var(--r-lg);background:#0E0F12;box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);overflow:hidden}
.sheet__head{display:flex;justify-content:space-between;gap:1rem;padding:.9rem 1.25rem;border-bottom:1px solid var(--hairline);font-size:.8125rem;color:var(--fg-faint)}
.sheet__head span:first-child{color:var(--fg);font-weight:500;font-size:.9375rem}
.funnel{display:grid;gap:.65rem;padding:1.25rem}
.funnel div{display:grid;grid-template-columns:6rem minmax(0,1fr) 2.5rem;align-items:center;gap:.75rem;font-size:.875rem}
.funnel span{color:var(--fg-muted)}
.funnel i{display:block;height:10px;border-radius:5px;background:rgb(255 255 255 / .07);overflow:hidden}
.funnel i::after{content:"";display:block;height:100%;width:0;border-radius:5px;background:var(--accent);transition:width 1100ms var(--ease-out)}
.funnel div:nth-child(2) i::after{transition-delay:120ms}.funnel div:nth-child(3) i::after{transition-delay:240ms}.funnel div:nth-child(4) i::after{transition-delay:360ms}
.sheet.is-in .funnel i::after{width:var(--w)}
.funnel b{font-weight:500;text-align:right;font-variant-numeric:tabular-nums}
.sheet__rows{border-top:1px solid var(--hairline)}
.srow{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:.75rem;align-items:center;padding:.7rem 1.25rem;border-top:1px solid rgb(255 255 255 / .06);font-size:.875rem}
.srow:first-child{border-top:0}
.srow span{color:var(--fg);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:639px){.srow{grid-template-columns:minmax(0,1fr) auto;gap:.35rem .75rem}.srow span{white-space:normal;grid-column:1 / -1}.srow time{grid-column:1}.srow .pill{grid-column:2;justify-self:end;grid-row:2}}
.srow time{color:var(--fg-faint);font-size:.8125rem;font-variant-numeric:tabular-nums}
.pill{font-style:normal;font-size:.75rem;padding:.2rem .6rem;border-radius:var(--r-pill);border:1px solid var(--hairline);color:var(--fg-muted);white-space:nowrap}
.pill--ok{border-color:rgb(115 96 223 / .55);color:var(--fg)}
.sheet__note{padding:.8rem 1.25rem 1rem;border-top:1px solid var(--hairline);font-size:.8125rem;color:var(--fg-faint)}

/* proces: oś z datami, linia rysuje się przy przewijaniu, punkty się zapalają */
.rail{list-style:none;position:relative;margin:clamp(3rem,5vw,4.5rem) 0 0;padding:.25rem 0 0 2.25rem;display:grid;gap:2rem 1.5rem;grid-template-columns:1fr}
.rail::before,.rail__line{position:absolute;left:5px;top:.25rem;bottom:.25rem;width:1px}
.rail::before{content:"";background:var(--hairline)}
.rail__line{background:var(--fg);opacity:.4;transform-origin:top}
@supports (animation-timeline:view()){.rail__line{opacity:1;scale:1 0;animation:rail-v linear both;animation-timeline:view();animation-range:cover 8% cover 68%}}
@keyframes rail-v{to{scale:1 1}}
@keyframes rail-h{to{scale:1 1}}
.rail__step{position:relative}
.rail__dot{position:absolute;left:calc(-2.25rem + 1px);top:.35rem;width:9px;height:9px;border-radius:50%;background:var(--bg);border:1px solid rgb(250 250 250 / .38);transition:background 500ms var(--ease-soft),border-color 500ms var(--ease-soft),box-shadow 700ms var(--ease-out)}
.rail__step.is-on .rail__dot{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 5px rgb(115 96 223 / .18)}
.rail__when{display:block;font-size:var(--t-label);letter-spacing:var(--tr-label);text-transform:uppercase;color:var(--fg-faint)}
.rail__step h3{font-size:1.25rem;letter-spacing:-.018em;margin-top:.5rem}
.rail__step p{margin-top:.5rem;font-size:.9375rem;max-width:30ch}
.rail__step h3,.rail__step p,.rail__when{opacity:.45;translate:0 6px;transition:opacity 640ms var(--ease-out),translate 640ms var(--ease-out)}
.rail__step.is-on h3,.rail__step.is-on p,.rail__step.is-on .rail__when{opacity:1;translate:0 0}
@media (min-width:900px){
  .rail{grid-template-columns:repeat(5,1fr);padding:2rem 0 0;gap:0 1.5rem}
  .rail::before,.rail__line{left:0;right:0;top:4px;bottom:auto;width:auto;height:1px}
  .rail__line{transform-origin:left}
  @supports (animation-timeline:view()){.rail__line{scale:0 1;animation-name:rail-h;animation-range:cover 2% cover 42%}}
  .rail__dot{left:0;top:-2rem}
  .rail__step:nth-child(3) .rail__dot{transition-delay:120ms}.rail__step:nth-child(4) .rail__dot{transition-delay:240ms}.rail__step:nth-child(5) .rail__dot{transition-delay:360ms}.rail__step:nth-child(6) .rail__dot{transition-delay:480ms}
  .rail__step:nth-child(3) :is(h3,p,.rail__when){transition-delay:120ms}.rail__step:nth-child(4) :is(h3,p,.rail__when){transition-delay:240ms}.rail__step:nth-child(5) :is(h3,p,.rail__when){transition-delay:360ms}.rail__step:nth-child(6) :is(h3,p,.rail__when){transition-delay:480ms}
}

/* pakiet: cztery części + macierz modułów */
.pkg{list-style:none;margin:clamp(2.5rem,4vw,3.5rem) 0 0;padding:0;display:grid;gap:0;grid-template-columns:1fr;border-top:1px solid var(--hairline)}
@media (min-width:768px){.pkg{grid-template-columns:repeat(2,1fr);gap:0 clamp(1.5rem,3vw,3rem)}}
@media (min-width:1100px){.pkg{grid-template-columns:repeat(4,1fr)}}
.pkg li{padding:1.4rem 0 1.6rem;border-bottom:1px solid var(--hairline)}
.pkg b{display:block;font-weight:500;font-size:clamp(1.125rem,1.5vw,1.3125rem);letter-spacing:-.018em;line-height:1.25}
.pkg p{margin-top:.6rem;font-size:.9375rem;max-width:none}
.matrix{margin-top:clamp(2.5rem,4vw,3.5rem);border:1px solid var(--hairline);border-radius:var(--r-lg);background:#0E0F12;box-shadow:inset 0 1px 0 rgb(255 255 255 / .06);overflow:hidden}
.matrix__head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.5rem;padding:1rem 1.25rem;border-bottom:1px solid var(--hairline)}
.matrix__head b{font-weight:500}
.matrix__head span{font-size:.8125rem;color:var(--fg-faint)}
.matrix__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mx{width:100%;min-width:720px;border-collapse:collapse;font-size:.9375rem}
.mx th,.mx td{padding:.95rem 1.25rem;text-align:left;border-top:1px solid rgb(255 255 255 / .06);vertical-align:top;font-weight:400}
.mx thead th{border-top:0;font-weight:500;color:var(--fg);line-height:1.3}
.mx thead th span{display:block;font-weight:400;font-size:.8125rem;color:var(--fg-faint);margin-top:.3rem}
.mx th:first-child{width:24%}
.mx tbody th{font-weight:500;color:var(--fg)}
.mx tbody th a{border-bottom:1px solid var(--hairline);transition:border-color var(--d-hover) var(--ease-soft)}
.mx tbody th a:hover{border-bottom-color:rgb(255 255 255 / .5)}
.mx td{color:var(--fg-muted);font-size:.875rem;line-height:1.4}
.mx tbody tr:hover td,.mx tbody tr:hover th{background:rgb(255 255 255 / .025)}
.mk-on,.mk-opt,.mk-no{position:relative;padding-left:1.35rem}
.mk-on::before,.mk-opt::before,.mk-no::before{content:"";position:absolute;left:0;top:.35em;width:9px;height:9px;border-radius:50%}
.mx .mk-on,.mx .mk-opt,.mx .mk-no{padding-left:2.55rem}
.mx .mk-on::before,.mx .mk-opt::before,.mx .mk-no::before{left:1.25rem;top:calc(.95rem + .35em)}
.mk-on::before{background:var(--accent)}
.mk-on{color:var(--fg)}
.mk-opt::before{border:1px solid rgb(250 250 250 / .45)}
.mk-no::before{border:1px solid rgb(250 250 250 / .2);background:repeating-linear-gradient(45deg,transparent 0 2px,rgb(250 250 250 / .25) 2px 3px)}
.mk-no{color:var(--fg-faint)}
.matrix__legend{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;padding:.85rem 1.25rem;border-top:1px solid var(--hairline);font-size:.8125rem;color:var(--fg-faint);max-width:none}
.matrix__legend .mk-on{color:var(--fg-muted)}

/* rolki: warianty nagrywania + telefon z rolką */
.reels{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.reels{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.reels__phone{position:sticky;top:calc(16px + 62px + 2.5rem)}}
.seg{display:inline-flex;flex-wrap:wrap;gap:.25rem;margin-top:clamp(1.5rem,2.5vw,2rem);padding:.25rem;border:1px solid var(--hairline);border-radius:var(--r-pill);background:var(--surface)}
.seg__btn{border:0;background:none;color:var(--fg-muted);font:inherit;font-size:.875rem;font-weight:500;padding:.55rem .95rem;border-radius:var(--r-pill);cursor:pointer;transition:background var(--d-hover) var(--ease-soft),color var(--d-hover) var(--ease-soft)}
.seg__btn:hover{color:var(--fg)}
.seg__btn[aria-selected="true"]{background:rgb(255 255 255 / .1);color:var(--fg)}
.seg__desc{margin-top:1.25rem;min-height:4.5rem}
.seg__desc p{max-width:52ch;animation:panel-in 420ms var(--ease-out)}
.proof{list-style:none;margin:clamp(2rem,3vw,2.5rem) 0 0;padding:0;display:grid;gap:1rem;grid-template-columns:1fr;border-top:1px solid var(--hairline)}
@media (min-width:640px){.proof{grid-template-columns:repeat(3,1fr);gap:1.5rem}}
.proof li{padding-top:1rem}
.proof b{display:block;font-weight:500;font-size:clamp(1.5rem,2.4vw,2rem);letter-spacing:-.028em;line-height:1.05;font-variant-numeric:tabular-nums}
.proof span{display:block;margin-top:.4rem;font-size:.8125rem;color:var(--fg-faint);max-width:22ch}
.reels__text .btn--ghost{margin-top:1.75rem}
.phone{width:min(100%,250px);aspect-ratio:9/17;margin-inline:auto;border-radius:32px;border:1px solid rgb(255 255 255 / .16);background:radial-gradient(120% 70% at 50% 0%,rgb(115 96 223 / .35),transparent 60%),linear-gradient(170deg,#1B1838,#0B0C10 72%);position:relative;overflow:hidden;box-shadow:0 30px 60px -30px rgb(0 0 0 / .8),inset 0 1px 0 rgb(255 255 255 / .08)}
.phone__top{position:absolute;top:14px;left:50%;translate:-50% 0;width:64px;height:6px;border-radius:3px;background:rgb(255 255 255 / .14)}
.phone__ring{position:absolute;left:50%;top:42%;translate:-50% -50%;width:64px;height:64px;border-radius:50%;border:1px solid rgb(255 255 255 / .4);background:rgb(8 9 10 / .25);backdrop-filter:blur(4px)}
.phone__ring::after{content:"";position:absolute;left:26px;top:20px;border-left:16px solid var(--fg);border-top:11px solid transparent;border-bottom:11px solid transparent}
.phone__cap{position:absolute;left:18px;right:18px;bottom:30px;display:grid;gap:.35rem}
.phone__cap b{font-weight:500;font-size:1.0625rem;line-height:1.25;letter-spacing:-.014em;text-wrap:pretty;animation:panel-in 420ms var(--ease-out)}
.phone__cap span{font-size:.75rem;color:rgb(250 250 250 / .62)}
.phone__bar{position:absolute;left:18px;right:18px;bottom:16px;height:2px;background:rgb(250 250 250 / .16);overflow:hidden}
.phone__bar i{display:block;height:100%;width:42%;background:var(--fg);animation:ph-bar 9s linear infinite}
@keyframes ph-bar{from{translate:-100% 0}to{translate:240% 0}}

/* wyniki: cztery liczby z nazwą placówki */
.res{display:grid;gap:clamp(1.5rem,2vw,2rem);margin-top:clamp(3rem,5vw,4.5rem);grid-template-columns:1fr}
@media (min-width:640px){.res{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1100px){.res{grid-template-columns:repeat(4,1fr)}}
.res__i{padding-top:1.25rem;border-top:1px solid var(--hairline)}
.res__who{font-size:.8125rem;color:var(--fg-faint)}
.res__num{display:block;font-weight:500;font-size:clamp(2rem,3.4vw,2.875rem);letter-spacing:-.03em;line-height:1.05;margin-top:.75rem;font-variant-numeric:tabular-nums}
.res__i p{margin-top:.75rem;font-size:.9375rem;max-width:none}
.res__more{margin-top:clamp(2rem,3vw,2.5rem)}

/* pytania: nagłówek z boku, lista z site.css */
.faq{display:grid;gap:clamp(1.5rem,4vw,4rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.faq{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}.faq__text{position:sticky;top:calc(16px + 62px + 2.5rem)}}
.faq .qa{margin-top:0}
.faq .qa summary{font-size:clamp(1rem,1.3vw,1.125rem)}

/* zakończenie: rozmowa + cztery zasady w skrócie */
.end{display:grid;gap:clamp(2.5rem,6vw,5rem);grid-template-columns:1fr;align-items:start}
@media (min-width:900px){.end{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}}
.end__actions{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;margin-top:2rem}
.end__actions .btn--ghost{font-size:1.0625rem;font-variant-numeric:tabular-nums}
.end__meta{margin-top:1.25rem;font-size:.9375rem;color:var(--fg-faint);max-width:none}
.end__meta a{color:var(--fg-muted)}
.end__meta a:hover{color:var(--fg)}
.end__facts{list-style:none;margin:0;padding:0;border-top:1px solid var(--hairline)}
@media (min-width:900px){.end__facts{margin-top:.6rem}}
.end__facts li{padding:1.1rem 0;border-bottom:1px solid var(--hairline);display:grid;gap:.2rem}
.end__facts b{font-weight:500;letter-spacing:-.014em}
.end__facts span{font-size:.9375rem;color:var(--fg-muted)}

@media (prefers-reduced-motion:reduce){
  .hero--edu .film img{animation:none}
  .rail__line{animation:none;scale:1 1;opacity:.4}
  .rail__step h3,.rail__step p,.rail__when{opacity:1;translate:0 0;transition:none}
  .rail__dot{background:var(--accent);border-color:var(--accent);box-shadow:none}
  .funnel i::after{transition:none;width:var(--w)}
  .sit__panel,.seg__desc p,.phone__cap b{animation:none}
  .phone__bar i{animation:none}
}