/* ============================================================
   MediaPath Academy — общая тема (тёмная, янтарный акцент)
   Используется на всех страницах сайта, в легалке и служебных.
   Имена классов сохранены от прежнего движка (vk-*), чтобы
   не менять разметку страниц — поменялась только палитра.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&subset=latin,cyrillic&display=swap');
:root{
  --vk:#fcaf17; --vkd:#e29d15; --link:#fcaf17; --bg:#040404; --box:#141312;
  --bd:rgba(255,255,255,.1); --soft:#1d1c1a; --head:#13120d; --text:#bebebe; --muted:#828282; --ac:#fcaf17;
  --ok:#4ade80; --warn:#e29d15; --danger:#f87171; --btn-ink:#13120d;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);font-family:'Inter',Arial,sans-serif;font-size:14px;color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
[id]{scroll-margin-top:64px}
.hidden{display:none!important}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
img,video{max-width:100%;display:block}
.ac{color:var(--ac)}

/* ---------- TOP BAR (sticky) ---------- */
.vk-top{background:rgba(4,4,4,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--bd);position:sticky;top:0;z-index:1000}
.vk-top-in{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:12px 16px}
.vk-logo{display:flex;align-items:center;white-space:nowrap}
.vk-logo img{height:32px;width:auto;display:block}
.vk-logo .txt{color:#fff;font-weight:800;font-size:18px;letter-spacing:.05em}
.vk-search{display:none}
.vk-topmenu{margin-left:auto;display:flex;gap:18px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.vk-topmenu::-webkit-scrollbar{display:none}
.vk-topmenu a{color:var(--muted);font-size:12.5px;font-weight:500;white-space:nowrap}
.vk-topmenu a:hover{color:#fff;text-decoration:none}

/* ---------- LAYOUT ---------- */
.vk-page{max-width:1000px;margin:26px auto;display:grid;grid-template-columns:200px 1fr;gap:18px;padding:0 16px;align-items:start}
.vk-side{position:sticky;top:76px}
.vk-side-photo{border:1px solid var(--bd);background:var(--box);border-radius:12px;padding:14px;text-align:center;margin-bottom:12px}
.vk-side-photo .dot{display:inline-block;width:54px;height:54px;border-radius:50%;background:var(--vk)}
.vk-side-photo .nm{font-weight:700;color:#fff;margin-top:9px;font-size:14px}
.vk-side-photo .st{color:var(--muted);font-size:12px}
.vk-side-menu{background:var(--box);border:1px solid var(--bd);border-radius:12px;overflow:hidden;margin-bottom:12px}
.vk-side-menu a{display:block;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.05);color:var(--text);font-size:13.5px}
.vk-side-menu a:last-child{border-bottom:0}
.vk-side-menu a:hover{background:var(--soft);text-decoration:none;color:#fff}
.vk-side-menu a.acct{color:var(--btn-ink);background:var(--vk);font-weight:700}
.vk-side-menu a.acct:hover{background:var(--vkd)}

/* ---------- BOXES ---------- */
.vk-box{background:var(--box);border:1px solid var(--bd);border-radius:14px;margin-bottom:18px;overflow:hidden}
.vk-head{background:var(--head);color:#fff;padding:12px 18px;font-weight:700;font-size:14px;border-bottom:1px solid var(--bd)}
.vk-head .small{font-weight:normal;opacity:.7;font-size:12px}
.vk-body{padding:18px}
.vk-body h2{font-size:17px;color:#fff;margin:16px 0 8px;font-weight:700}
.vk-body h2:first-child{margin-top:0}
.vk-body h3{font-size:15px;color:#fff;margin:14px 0 6px;font-weight:700}
.vk-body p{margin-bottom:10px}
.vk-body p:last-child{margin-bottom:0}
.vk-body ul,.vk-body ol{margin:0 0 10px 20px}
.vk-body li{margin-bottom:5px}
.muted{color:var(--muted);font-size:12.5px}
.ph{color:var(--warn);font-weight:700}

/* ---------- BUTTONS / FORMS ---------- */
.vk-btn{display:inline-block;background:var(--vk);color:var(--btn-ink) !important;border:1px solid var(--vkd);border-radius:8px;padding:10px 22px;font:inherit;font-weight:700;cursor:pointer}
.vk-btn:hover{background:var(--vkd);text-decoration:none}
.vk-btn.sm{padding:7px 16px;font-size:13px}
.vk-btn.gray{background:var(--soft);color:var(--text) !important;border-color:var(--bd)}
.vk-btn.gray:hover{background:#26241f}
.vk-btn.danger{background:transparent;color:var(--danger) !important;border-color:rgba(248,113,113,.4)}
.vk-btn.danger:hover{background:rgba(248,113,113,.08)}
.vk-form{display:grid;gap:10px;max-width:400px}
.vk-form label{font-size:12px;color:var(--muted);font-weight:600;display:block;margin-bottom:-4px}
.vk-form input,.vk-form select,.vk-form textarea{border:1px solid #34322c;border-radius:8px;padding:11px 13px;font:inherit;font-size:14px;background:#1f1e1b;color:#fff;width:100%}
.vk-form input:focus,.vk-form select:focus,.vk-form textarea:focus{outline:none;border-color:var(--vk)}
.vk-form textarea{min-height:70px;resize:vertical}
.form-msg{font-size:12.5px;min-height:18px}

footer{max-width:1000px;margin:0 auto 30px;padding:16px;color:var(--muted);font-size:12.5px;text-align:center}
footer a{margin:0 7px}

/* ---------- AUTH CARD (login/register) ---------- */
.auth-wrap{max-width:420px;margin:46px auto;padding:0 14px}
.auth-box .vk-body{padding:24px}
.auth-links{margin-top:14px;font-size:12.5px;color:var(--muted);text-align:center}

@media(max-width:760px){
  .vk-page{grid-template-columns:1fr}
  .vk-side{position:static}
  .vk-topmenu{gap:12px}
  .vk-logo .txt{font-size:16px}
}
