/* Общие элементы образцов страниц v2 (дизайн «Трасса»): шапка, подвал, полоса «Курсы по городам».
   Токены — ../prototype/shared/tokens.css. Тексты и ссылки — как в v1. */
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}

/* шапка поверх обложки */
.top{position:absolute;inset:0 0 auto;z-index:5;color:#fff}
.top .wrap{display:flex;align-items:center;gap:26px;height:76px}
.logo{font:800 17px var(--f-head);letter-spacing:.02em;display:flex;align-items:center;gap:10px}
.logo i{width:36px;height:36px;border-radius:9px;display:block;flex:none;box-shadow:0 2px 8px rgba(5,8,14,.25)}
.logo i img{width:100%;height:100%;display:block;border-radius:inherit}
.flogo{display:block;flex:none}.flogo img{display:block;width:64px;height:64px;border-radius:14px;box-shadow:0 0 0 1px rgba(255,255,255,.14)}
.nav{display:flex;gap:20px;margin-left:auto;font-size:13px;font-weight:600;letter-spacing:.06em}
.nav a{opacity:.86;transition:opacity .2s}.nav a:hover{opacity:1}
.acts{display:flex;gap:10px}
.acts a{height:40px;padding:0 16px;border-radius:12px;display:inline-flex;align-items:center;font-size:14px;font-weight:600;white-space:nowrap}
.acts .join{background:var(--g1);color:#fff;box-shadow:0 6px 16px rgba(16,185,129,.3)}
.acts .in{background:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.28)}

/* обложка с косым срезом */
.hero{position:relative;color:#fff;background:#0A1124;clip-path:polygon(0 0,100% 0,100% calc(100% - 3.2vw),0 100%)}
.hero>img,.hero>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,17,36,.86) 0%,rgba(10,17,36,.5) 50%,rgba(10,17,36,.08) 100%),linear-gradient(0deg,rgba(10,17,36,.6),transparent 45%)}
.hero .wrap{position:relative;z-index:1;width:100%}

/* кнопки */
.btn-w{background:#fff;color:var(--blue-d);height:54px;padding:0 28px;border-radius:14px;display:inline-flex;align-items:center;white-space:nowrap;font:700 15px var(--f-head);letter-spacing:.04em}
.arrow{display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-weight:600}
.arrow:after{content:"→";transition:transform .2s}.arrow:hover:after{transform:translateX(4px)}

/* полоса «Курсы по городам» */
.cities{background:var(--g-ink);color:rgba(255,255,255,.7);font-size:15px}
.cities .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;min-height:64px;padding-top:12px;padding-bottom:12px}
.cities span{font:700 13px var(--f-head);letter-spacing:.04em;color:#fff}
.cities a{padding:6px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.18);transition:background .2s,color .2s}
.cities a:hover{background:#fff;color:var(--ink)}
.cities i{display:none}

/* подвал */
footer{background:var(--ink);color:rgba(255,255,255,.72);font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;padding:34px 32px}
footer a:hover{color:#fff}
footer .c{margin-left:auto;opacity:.6}
.note{max-width:1200px;margin:0 auto 26px;padding:0 32px;font-size:13px;color:var(--mute)}

/* появление при прокрутке */
.js .rv{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.on{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

@media (max-width:1000px){.nav{display:none}.acts{margin-left:auto}}
@media (max-width:900px){
  .wrap{padding:0 16px}
  footer .wrap{padding:28px 16px}footer .c{margin-left:0}
  .note{padding:0 16px}
  .acts{gap:6px}.acts a{height:36px;padding:0 11px;font-size:12.5px}.logo{font-size:14px}
}

/* меню на телефоне (в v1 — «бургер») */
.burger{display:none;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);position:relative;flex:none}
.burger i,.burger:before,.burger:after{content:"";position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:#fff;transition:transform .3s var(--ease),opacity .2s}
.burger:before{top:13px}.burger i{top:19px}.burger:after{top:25px}
.menu-open .burger:before{transform:translateY(6px) rotate(45deg)}.menu-open .burger i{opacity:0}.menu-open .burger:after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:1000px){
  .burger{display:block}
  .nav{position:fixed;inset:0;z-index:-1;background:var(--g-ink);display:flex;flex-direction:column;justify-content:center;gap:6px;padding:90px 24px 40px;margin:0;font:800 26px/1.1 var(--f-head);letter-spacing:-.01em;opacity:0;pointer-events:none;transform:translateY(-12px);transition:opacity .3s,transform .3s var(--ease)}
  .nav a{opacity:1;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .menu-open .nav{opacity:1;pointer-events:auto;transform:none}
  .menu-open{overflow:hidden}
}

/* длинные слова в крупных заголовках не должны вылезать за экран телефона */
h1,h2,h3,.h1,.h2,.t,.tt,.nm,.doc,.rich,.cc,.rev{overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
@media (max-width:640px){
  .hero h1,.phero h1,.phero .h1{font-size:clamp(30px,9vw,44px)!important}
  .cta .t{font-size:18px!important}
  .grp-h .t,.h2{font-size:26px!important}
}

/* информационный текст чуть плотнее (замечание Бро 14.10): Golos 500 вместо 400 */
body{font-weight:500}

/* метки уровней на тёмном фоне — светлая обводка, чтобы «4» (чёрная трасса) была видна */
.kick b,.cc .lv b,.row .lvl b{box-shadow:0 0 0 1.5px rgba(255,255,255,.55)}