/* /system («Система») — поверх olimp-v2.css: свои блоки с префиксом sy- */

/* первый экран: парень с дипломом на синем круге (как основатель на «Олимпологии») */
.sy-hero .ov-person.sy-person{right:0;bottom:0;width:min(80%,310px);max-width:none}
@media (max-width:599px){
  .sy-hero .ov-hero-visual{height:300px}
  .sy-hero .ov-glow{right:4%;bottom:4%;width:min(68%,260px)}
}
@media (min-width:600px) and (max-width:999px){
  .sy-hero .ov-person.sy-person{width:420px;right:0}
  .sy-hero .ov-glow{width:340px;right:40px;bottom:4%}
}
@media (min-width:1000px){
  .sy-hero .ov-photo{top:-6%;left:-6%;right:-6%}
  .sy-hero .ov-person.sy-person{left:50%;right:auto;transform:translateX(-50%);bottom:-2%;height:auto;width:100%}
  .sy-hero .ov-glow{width:88%;top:14%}
}

/* заголовки блоков: короткие — в одну строку, длинные — сбалансированы; выделение не переносится принудительно */
.sy .ov-h2{text-wrap:balance}
.sy .ov-h2 b{display:inline}
/* заголовок всё равно в 2 строки — выделение отдельной строкой */
.sy .ov-h2.sy-h2-split b{display:block}

/* общие мелочи */
.sy-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.sy-list li{display:flex;gap:8px;align-items:flex-start;font-size:14.5px;line-height:1.4}
.sy-list svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--primary)}

/* для кого */
.sy-whos{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:16px}
.sy-who-c{padding:18px;border-radius:22px;background:var(--card);border:1px solid var(--card-line)}
.sy-who-c:first-child{background:var(--primary-soft);border-color:transparent}
.sy-who-k{margin:0;font-size:13px;font-weight:700;color:var(--accent-small)}
.sy-who-c h3{margin:4px 0 14px;font-size:19px;font-weight:800;line-height:1.2;text-wrap:balance}

/* программа: список уроков по этапам слева, описание справа; на телефоне — аккордеон */
.sy-lt-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;margin-top:16px}
.sy-lt-h{margin:12px 0 2px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-small)}
.sy-lt-h:first-child{margin-top:0}
.sy-lt{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:12px 14px;border:1px solid var(--card-line);border-radius:14px;background:var(--card);color:var(--fg);font:inherit;font-size:15px;font-weight:700;line-height:1.25;text-align:left;cursor:pointer}
.sy-lt small{flex:none;font-size:12.5px;font-weight:600;color:var(--muted)}
.sy-lt[aria-expanded="true"]{background:var(--primary);border-color:var(--primary);color:#fff}
.sy-lt[aria-expanded="true"] small{color:rgba(255,255,255,.8)}
.sy-lp{display:grid;grid-template-columns:minmax(0,1fr);border-radius:20px;background:var(--card);border:1px solid var(--card-line);overflow:hidden}
.sy-lp[hidden]{display:none}
/* картинка урока: настоящий слайд из видеоурока в «плеере» + страницы PDF веером (как на /materials) */
.sy-lp-pic{display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#d6edf9,#eaf6fc);overflow:hidden}
html.dark .sy-lp-pic{background:linear-gradient(160deg,rgba(0,152,219,.28),rgba(0,152,219,.08))}
.sy-st{position:relative;width:100%;aspect-ratio:1/.8;container-type:inline-size}
.sy-st img{display:block}
/* «плеер» 16:9: кадр видеоурока целиком, как в исходнике (спикер слева, слайд справа, поля сверху и снизу) */
.sy-pl{position:absolute;left:4cqw;top:4cqw;width:92cqw;aspect-ratio:16/9;border-radius:1.6cqw;overflow:hidden;background:#0d1114;box-shadow:0 16px 32px -16px rgba(0,30,50,.65),0 0 0 1px rgba(0,30,50,.08);z-index:2}
.sy-pl img{width:100%;height:100%;object-fit:cover}
.sy-pl-btn{position:absolute;left:50%;top:50%;width:11cqw;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:#0098db;box-shadow:0 6px 18px -6px rgba(0,40,70,.7)}
.sy-pl-btn::after{content:"";position:absolute;left:54%;top:50%;transform:translate(-50%,-50%);border-style:solid;border-width:2cqw 0 2cqw 3.3cqw;border-color:transparent transparent transparent #fff}
.sy-pl-bar{position:absolute;left:0;right:0;bottom:0;height:6cqw;background:linear-gradient(transparent,rgba(0,0,0,.5))}
.sy-pl-bar i{position:absolute;left:3cqw;right:3cqw;bottom:1.8cqw;height:.7cqw;border-radius:1cqw;background:rgba(255,255,255,.4)}
.sy-pl-bar i::before{content:"";position:absolute;left:0;top:0;bottom:0;width:34%;border-radius:inherit;background:#0098db}
/* только видео: кадр ниже, над ним веером непрозрачные слайды презентации того же урока (заходят только на верхнее поле кадра) */
.sy-st-v .sy-pl{top:24cqw}
.sy-bk{position:absolute;top:4cqw;width:46cqw;aspect-ratio:16/9;object-fit:cover;border-radius:1.2cqw;box-shadow:0 12px 26px -12px rgba(0,30,50,.6),0 0 0 1px rgba(0,30,50,.08)}
.sy-bk.b1{left:7cqw;transform:rotate(-4deg);z-index:1}
.sy-bk.b2{right:7cqw;transform:rotate(4deg);z-index:1}
.sy-st-v .sy-bk:only-of-type{left:27cqw;transform:rotate(-3deg)}
/* страницы PDF: веер под кадром, заходит только на нижнее поле кадра */
.sy-pp{position:absolute;inset:0;z-index:3;pointer-events:none}
.sy-pp img{position:absolute;top:50cqw;width:18cqw;height:auto;border-radius:.7cqw;background:#fff;box-shadow:0 12px 26px -12px rgba(0,30,50,.6),0 0 0 1px rgba(0,30,50,.1)}
.sy-pp.n3 .p0{left:26cqw;transform:rotate(-7deg) translateY(1.5cqw);z-index:1}
.sy-pp.n3 .p1{left:41cqw;z-index:3}
.sy-pp.n3 .p2{left:56cqw;transform:rotate(7deg) translateY(1.5cqw);z-index:2}
.sy-pp.n2 .p0{left:33cqw;transform:rotate(-5deg) translateY(1cqw);z-index:2}
.sy-pp.n2 .p1{left:49cqw;transform:rotate(5deg) translateY(1.5cqw);z-index:1}
.sy-pp.n1 .p0{left:41cqw;transform:rotate(3deg)}
.sy-lp-b{display:flex;flex-direction:column;padding:14px 16px 16px}
.sy-lp-k{margin:0;font-size:13px;font-weight:700;color:var(--accent-small)}
.sy-lp h3{margin:4px 0 12px;font-size:19px;font-weight:800;line-height:1.2;text-wrap:balance}
.sy-lp .sy-list{margin-bottom:14px}
.sy-lp .sy-list li{font-size:14px}
.sy-ls-m{display:flex;flex-wrap:wrap;gap:6px;margin:auto 0 0}
.sy-lp-nav{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:16px;font-size:13px;font-weight:700;color:var(--muted)}
.sy-lp-arr{display:grid;place-items:center;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid var(--card-line);background:var(--bg);color:var(--fg);cursor:pointer}
.sy-lp-arr svg{width:18px;height:18px}
.sy-lp-arr[data-d="1"] svg{transform:scaleX(-1)}
.sy-lp-arr:hover:not(:disabled){border-color:var(--primary);color:var(--primary)}
.sy-lp-arr:disabled{opacity:.35;cursor:default}
.sy-lt:focus-visible,.sy-lp-arr:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
.sy-ls-m span{padding:4px 9px;border-radius:8px;background:var(--primary-soft);color:var(--accent-small);font-size:12.5px;font-weight:700}

/* «Видеоуроки»: теги разделов; «Консультация»: созвон из двух окон */
.vz-vis .sy-vtags{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.vz-vis .sy-vtags span{padding:4px 7px;border-radius:8px;background:var(--card);font-weight:700;white-space:nowrap}
.vz-vis .vz-tiles.sy-tiles2{grid-template-columns:1fr 1fr}
.vz-vis .vz-tiles.sy-tiles2 span{height:auto;aspect-ratio:4/3;min-width:0}
@media (max-width:999px){.sy #ov-pane1 .ov-pane-img.vz-vis{height:auto;overflow:visible}}

/* результат: карточки с иконками */
.sy-rss{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin-top:16px}
.sy-rs{display:grid;grid-template-columns:48px minmax(0,1fr);column-gap:14px;padding:16px;border-radius:22px;background:var(--card);border:1px solid var(--card-line)}
.sy-rs-ic{grid-row:span 2;display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:var(--primary-soft)}
.sy .sy-rs-ic .ov-ic{width:40px;height:40px}
.sy-rs h3{margin:2px 0 0;font-size:18px;font-weight:800;line-height:1.2;text-wrap:balance}
.sy-rs p{margin:6px 0 0;font-size:14.5px;line-height:1.45;color:var(--muted)}

/* автор */
.sy-au{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:16px}
.sy-au-card{padding:18px;border-radius:24px;background:var(--card);border:1px solid var(--card-line)}
.sy-au-h{display:flex;gap:14px;align-items:center;margin-bottom:16px}
.sy-au-card img{flex:none;display:block;width:88px;height:88px;border-radius:50%;object-fit:cover}
.sy-au-card h3{margin:0;font-size:19px;font-weight:800;line-height:1.2}
.sy-au-r{margin:4px 0 0;font-size:13.5px;font-weight:600;line-height:1.35;color:var(--accent-small)}
.sy-au-text p{margin:0 0 10px;font-size:15px;line-height:1.5}
.sy-quote{margin:14px 0;padding:16px 18px;border-radius:20px;background:var(--primary-soft);border-left:4px solid var(--primary)}
.sy-quote b{display:block;font-size:17px;line-height:1.3;text-wrap:balance}
.sy-quote p{margin:8px 0 0;font-size:14.5px;color:var(--muted)}
.sy-au-mentor{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.sy-au-mentor svg{flex:none;width:24px;height:24px;color:var(--primary)}
.sy-au-cta{margin-top:16px}
.sy-au-cta .ov-btn{width:100%}

/* цена */
.ov-tfs.sy-tfs{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;margin:16px 0 0;padding:0;overflow:visible}
.sy-tf{display:flex;flex-direction:column;padding:20px;border-radius:24px;background:var(--bg);border:1px solid var(--primary);box-shadow:inset 0 0 0 1px var(--primary),0 18px 40px -24px rgba(0,152,219,.55)}
.sy-tf-h h3{margin:0;font-size:22px;font-weight:800}
.sy-tf-k{margin:4px 0 0;font-size:13.5px;font-weight:700;color:var(--accent-small)}
.sy-tf-p{margin:14px 0 16px}
.sy-tf-p b{font-size:38px;font-weight:800;letter-spacing:-.02em;line-height:1}
.sy-tf-n{margin:14px 0 18px;font-size:13.5px;line-height:1.45;color:var(--muted)}
.sy-tf .ov-btn{width:100%}
.sy-guar p+p{margin-top:8px}
@media (min-width:1000px){.ov-pg.sy-guar{justify-content:flex-start}}

/* отзывы о «Системе» */
.sy-reviews .ov-rv-x{-webkit-line-clamp:9}

/* финал */
.sy-final-in{padding:22px 18px;border-radius:26px;background:var(--primary-soft)}
.sy-final-in p{margin:12px 0 0;font-size:15px;line-height:1.5}
.sy-final-big{font-size:22px!important;line-height:1.15!important;font-weight:800;color:var(--accent);text-wrap:balance}
.sy-final-q{font-style:italic;color:var(--muted)}
.sy-final .ov-sec-cta{flex-wrap:wrap}

@media (min-width:700px){
  .ov-tfs.sy-tfs{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (min-width:1000px){


  .sy-lt-grid{grid-template-columns:340px minmax(0,1fr);grid-auto-rows:auto;column-gap:24px;row-gap:4px;margin-top:30px;align-items:start}
  .sy-lt-grid>.sy-lt-h,.sy-lt-grid>.sy-lt{grid-column:1}
  .sy-lt-grid>.sy-lp{grid-column:2;grid-row:1/span 12;align-self:stretch;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-radius:28px}
  .sy-lt{padding:10px 14px;font-size:16px;border-color:transparent;background:transparent}
  .sy-lt:hover{background:var(--card)}
  .sy-lt[aria-expanded="true"],.sy-lt[aria-expanded="true"]:hover{background:var(--primary)}
  .sy-lt-h{margin-top:14px}
  .sy-lp-pic{height:auto}
  .sy-lp-b{padding:32px 32px 28px;justify-content:center}
  .sy-lp-k{font-size:14px}
  .sy-lp h3{font-size:28px;margin:6px 0 18px}
  .sy-lp .sy-list li{font-size:16px}
  .sy-lp .sy-ls-m{margin-top:20px}
  .sy-rss{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:32px}
  .sy-rs{display:block;padding:26px;border-radius:26px}
  .sy-rs-ic{width:64px;height:64px;border-radius:18px}
  .sy .sy-rs-ic .ov-ic{width:54px;height:54px}
  .sy-rs h3{margin-top:20px;font-size:21px}
  .sy-rs p{font-size:15.5px}
  .sy-whos{gap:16px;margin-top:32px}
  .sy-who-c{padding:30px;border-radius:28px}
  .sy-who-k{font-size:15px}
  .sy-who-c h3{font-size:26px;margin-bottom:20px}
  .sy-list{gap:12px}
  .sy-list li{font-size:16px}
  .sy-list svg{width:20px;height:20px}



  .sy-au{grid-template-columns:400px minmax(0,1fr);gap:40px;margin-top:32px;align-items:center}
  .sy-au-card{padding:28px;border-radius:28px}
  .sy-au-card img{width:110px;height:110px}
  .sy-au-card h3{font-size:22px}
  .sy-au-r{font-size:14.5px}
  .sy-au-card .sy-list li{font-size:15px}
  .sy-au-text p{font-size:18px}
  .sy-quote{padding:22px 26px;margin:22px 0}
  .sy-quote b{font-size:22px}
  .sy-quote p{font-size:16px}
  .sy-au-mentor span{font-size:16px}
  .sy-au-cta .ov-btn{width:auto}

  /* цена на всю ширину: карточка 2/3 (слева цена и кнопка, справа состав), гарантия 1/3 */
  .ov-tfs.sy-tfs{grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;margin-top:32px}
  .sy-tf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px;align-content:start}
  .sy-tf>*{grid-column:1}
  .sy-tf>.sy-list{grid-column:2;grid-row:1/span 3;align-self:start;margin-top:4px}
  .sy-tf>.sy-tf-n{grid-column:2;grid-row:4;margin-bottom:0}
  .sy-tf>.ov-btn{align-self:end}
  .sy-tf{padding:30px;border-radius:28px}
  .sy-tf-h h3{font-size:28px}
  .sy-tf-k{font-size:15px}
  .sy-tf-p b{font-size:52px}
  .sy-tf-n{font-size:14.5px}
  .sy-guar{justify-content:center}

  .sy-final-in{padding:56px 60px;border-radius:32px;text-align:center}
  .sy-final-in .ov-h2{margin:0 auto;max-width:980px}
  .sy-final-big{font-size:34px!important}
  .sy-final-in p{font-size:19px;max-width:820px;margin:16px auto 0}
  .sy-final .ov-sec-cta{justify-content:center}
}
