/* Вебинары: /olymp_eng_web, /web (лендинги) и /olymp_eng_reg, /web_reg («куда прислать ссылку»).
   Стиль «Олимпологии» (olimp-v2.css), здесь только своё: префикс wb- */

/* ---------- первый экран лендинга ---------- */
.wb-hero{padding:18px 0 36px;background:linear-gradient(180deg,var(--paper) 0%,var(--bg) 100%);overflow:hidden}
.wb-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}
.wb-hero-text{display:flex;flex-direction:column;min-width:0}
.wb-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.wb-meta .ov-brand{font-size:16px}
.wb .wb-when{margin:0}
.wb-when li{gap:6px;padding:6px 10px;font-size:13px}
.wb-when svg{width:15px;height:15px;flex:none}
.wb .wb-h1{margin-top:14px}
.wb .wb-h1 b{display:block}  /* в первом экране выделение — своей строкой */
.wb-sub{margin:12px 0 0;font-size:15.5px;line-height:1.45;font-weight:600;color:var(--muted);text-wrap:balance}
.wb-sub b{color:var(--accent-small);font-weight:700}
.wb-sub-row{display:flex;align-items:center;gap:14px;margin-top:14px}
.wb-sub-row img{flex:none;width:96px;height:auto}
.wb-sub-row .wb-sub{margin:0;color:var(--fg)}
.wb-note{text-wrap:balance;margin:6px 0 0;font-size:12.5px;line-height:1.4;font-weight:600;color:var(--muted)}
.wb-who{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:16px 0 0;font-size:13px;font-weight:700;line-height:1.2}
.wb-who span{margin-right:4px;color:var(--muted)}
.wb-who i{font-style:normal;padding:6px 10px;border-radius:99px;background:var(--primary-soft);color:var(--fg)}
html:not(.dark) .wb-who i{background:#e3f2fa}
.wb-cta{display:flex;margin-top:24px}
.wb-cta .ov-btn{flex:1}

/* визуал: фирменный круг, человек из снимка, вокруг — фото учеников и дипломы */
.wb-vis{position:relative;order:-1;height:250px;min-width:0}
.wb-glow{position:absolute;left:50%;bottom:0;width:230px;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:var(--primary);opacity:.92}
html.dark .wb-glow{opacity:.75}
.wb-man{position:absolute;left:50%;bottom:0;height:100%;width:auto;transform:translateX(-50%);z-index:2}
.wb-vis-eng img:not(.wb-man){position:absolute;width:64px;height:auto;border-radius:12px;box-shadow:0 12px 26px -14px rgba(0,30,50,.6);z-index:1}
.wb-vis-eng .t1{left:4%;top:6%}
.wb-vis-eng .t2{right:4%;top:2%}
.wb-vis-eng .t3{left:12%;top:52%;z-index:3}
.wb-vis-eng .t4{right:10%;top:44%;z-index:3}
.wb-vis-eng .t5,.wb-vis-eng .t6,.wb-vis-eng .t7,.wb-vis-eng .t8{display:none}
.wb-collage{position:absolute;left:50%;top:0;height:100%;width:auto;transform:translateX(-50%)}

/* ---------- разделы ---------- */
.wb .wb-sec{min-height:0}
.wb-h2c{text-align:left}

/* что будет на вебинаре: номер + текст */
.wb-steps{list-style:none;margin:18px 0 0;padding:0;display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
.wb-step{display:flex;gap:14px;align-items:baseline;padding:16px 18px;border-radius:20px;background:var(--card);border:1px solid var(--card-line)}
.wb-step b{flex:none;font-size:22px;line-height:1;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums}
.wb-step p{margin:0;font-size:15px;line-height:1.4;font-weight:600}

/* скидка на «Олимпологию» */
.wb-bonus{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:6px;padding:22px 20px 0;border-radius:24px;background:linear-gradient(135deg,#e3f2fa 0%,#f3f9fc 70%);border:1px solid var(--card-line);overflow:hidden}
html.dark .wb-bonus{background:linear-gradient(135deg,rgba(0,152,219,.2) 0%,rgba(0,152,219,.05) 70%)}
.wb-bonus .ov-h2{font-size:21px}
.wb-bonus p{margin:12px 0 0;font-size:14.5px;line-height:1.5;color:var(--muted)}
.wb-bonus p strong{color:var(--fg);font-weight:700}
.wb-bonus-vis{position:relative;height:190px}
.wb-box{position:absolute;left:50%;bottom:-6px;height:100%;width:auto;transform:translateX(-46%)}
.wb-pct{position:absolute;left:8%;bottom:22%;width:58px;height:auto;transform:rotate(-8deg);z-index:2}
.wb-pct2{position:absolute;right:6%;top:10%;width:70px;height:auto;transform:rotate(12deg);opacity:.9}
.wb-sec-cta{display:flex;justify-content:center;margin-top:22px}
.wb-sec-cta .ov-btn{flex:1}

/* регистрация: тема и дата слева, анкета GetCourse справа (у анкеты своя тёмная заливка — рамкой не обводим) */
.wb-form-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:center}
.wb-form-text,.wb-form{min-width:0}
.wb-form-text .ov-h2{margin-top:12px}
.wb-form-text .ov-h2 b{display:block}
.wb-gc{color-scheme:dark;background:#111214;border-radius:24px;overflow:hidden;min-height:420px;box-shadow:var(--shadow-soft)}
.wb-gc iframe{display:block;width:100%!important;border:0}
.wb-lf{min-height:420px}
.wb-lf iframe{display:block;width:100%;border:0;background:transparent}
.wb-lf-nojs{margin:12px;text-align:center}

/* телефон: под последним блоком место для закреплённой кнопки */
@media (max-width:999px){.wb .wb-form-sec{padding-bottom:84px}}

/* ---------- «куда прислать ссылку» ---------- */
.wb-reg-hero{padding:22px 0 48px;background:linear-gradient(180deg,var(--paper) 0%,var(--bg) 100%);overflow:hidden}
.wb-reg-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;align-items:center}
.wb-reg-text{min-width:0}
.wb-reg-vis{position:relative;order:1;height:210px;display:flex;justify-content:center;align-items:center}
.wb-reg-vis img{position:relative;height:100%;width:auto;max-width:100%;object-fit:contain}
.wb-reg-vis .wb-glow{bottom:auto;left:56%;top:50%;transform:translate(-50%,-50%);width:200px}
.wb-chs{display:grid;gap:10px;margin-top:24px}
.wb-ch{display:flex;align-items:center;gap:14px;padding:12px 16px 12px 12px;border-radius:18px;background:var(--bg);border:1px solid var(--line);box-shadow:var(--shadow-soft);color:var(--fg);text-decoration:none;transition:transform .15s,border-color .15s}
.wb-ch:hover{transform:translateY(-1px);border-color:var(--primary)}
.wb-ch b{flex:1;font-size:17px;font-weight:800}
.wb-ch-ic{flex:none;display:flex;width:44px;height:44px;border-radius:50%;overflow:hidden}
.wb-ch-ic svg{width:100%;height:100%}
.wb-ch-vk .wb-ch-ic{background:#0077FF;align-items:center;justify-content:center}
.wb-ch-vk .wb-ch-ic svg{width:66%;height:66%}

/* ---------- планшет ---------- */
@media (min-width:600px){
  .wb-vis{height:330px}
  .wb-glow{width:300px}
  .wb-vis-eng img:not(.wb-man){width:84px}
  .wb-vis-eng .t5{display:block;left:22%;top:0}
  .wb-vis-eng .t6{display:block;right:22%;top:72%;z-index:3}
  .wb-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wb-step{flex-direction:column;gap:12px}
  .wb-cta .ov-btn,.wb-sec-cta .ov-btn{flex:none;padding:17px 34px}
  .wb-chs{grid-template-columns:repeat(2,minmax(0,1fr));max-width:560px}
  .wb-reg-vis{height:300px}
  .wb-reg-vis .wb-glow{width:290px}
}

/* ---------- ноутбук ---------- */
@media (min-width:1000px){
  .wb-hero{padding:0;min-height:min(calc(100svh - 112px),760px);display:flex;flex-direction:column;justify-content:center}
  .wb-hero>.wrap{width:100%}
  .wb-hero-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:40px;align-items:center}
  .wb .wb-h1{font-size:54px;margin-top:22px}
  .wb-meta .ov-brand{font-size:18px}
  .wb-when li{font-size:14px;padding:7px 12px}
  .wb-sub{margin-top:18px;font-size:19px;max-width:600px}
  .wb-sub-row{margin-top:22px;gap:18px}
  .wb-sub-row img{width:160px}
  .wb-note{font-size:14px}
  .wb-who{margin-top:24px;font-size:14px}
  .wb-cta{margin-top:36px}
  .wb-cta .ov-btn{font-size:16px;padding:19px 40px}
  .wb-vis{order:0;height:auto;aspect-ratio:1/1;max-height:620px}
  .wb-glow{width:76%;bottom:-6%}
  .wb-man{height:100%}
  .wb-vis-eng img:not(.wb-man){display:block;width:19%}
  .wb-vis-eng .t1{left:6%;top:6%}
  .wb-vis-eng .t2{right:2%;top:10%}
  .wb-vis-eng .t3{left:0;top:42%}
  .wb-vis-eng .t4{right:0;top:44%}
  .wb-vis-eng .t5{left:22%;top:-2%;width:15%}
  .wb-vis-eng .t6{right:16%;top:76%;width:15%}
  .wb-vis-eng .t7{left:8%;top:74%;width:15%;z-index:3}
  .wb-vis-eng .t8{right:20%;top:-4%;width:13%}
  .wb-vis-web .wb-collage{height:96%;top:2%}

  .wb .wb-sec{padding:64px 0}
  .wb-steps{margin-top:30px;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
  .wb-steps-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .wb-step{padding:22px 22px 26px;border-radius:24px}
  .wb-step b{font-size:30px}
  .wb-step p{font-size:16px}

  .wb-bonus{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:24px;padding:44px 48px;border-radius:32px;align-items:center}
  .wb-bonus .ov-h2{font-size:34px;max-width:none}
  .wb-bonus p{font-size:17px;max-width:620px}
  .wb-bonus p:first-of-type{margin-top:20px}
  .wb-bonus-vis{height:280px}
  .wb-box{bottom:auto;top:50%;transform:translate(-50%,-50%)}
  .wb-pct{width:86px;left:4%;bottom:12%}
  .wb-pct2{width:96px}
  .wb-sec-cta{margin-top:36px}
  .wb-sec-cta .ov-btn{font-size:16px;padding:19px 40px}

  .wb-form-grid{grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:64px;align-items:start}
  .wb-form-text{position:sticky;top:150px;padding-top:40px}
  .wb-form-text .ov-h2{margin-top:20px;font-size:44px}

  .wb-reg-hero{padding:0;min-height:calc(100svh - 60px);display:flex;flex-direction:column;justify-content:center}
  .wb-reg-hero>.wrap{width:100%}
  .wb-reg-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  .wb-reg .wb-h1{font-size:54px}
  .wb-chs{margin-top:40px;gap:14px}
  .wb-ch{padding:14px 20px 14px 14px}
  .wb-ch b{font-size:18px}
  .wb-ch-ic{width:52px;height:52px}
  .wb-reg-vis{order:0;height:auto;aspect-ratio:4/3}
  .wb-reg-vis .wb-glow{width:80%}
}
@media (min-width:1000px) and (max-width:1199px){
  .wb .wb-h1,.wb-reg .wb-h1{font-size:44px}
  .wb-steps-5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wb-form-text .ov-h2{font-size:36px}
}