/*
 * site-header.css — Верный Курс
 * Единый «стеклянный» хедер (как на главной index.html), для всех публичных страниц.
 * Самодостаточный: все значения с фолбэками, чтобы работать вне зависимости от :root страницы.
 * Разметка — <header class="vkh"> … (см. любую публичную страницу). Поведение — /js/site-nav.js.
 * Селекторы префиксованы «.vkh », чтобы гарантированно перебивать собственные
 * правила страниц вида nav{...}, a{...}, button{...}, ul/li и т.п.
 */

header.vkh{display:block;}

.vkh .vkh-nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  height:calc(var(--nav,74px) + var(--sat,0px));
  margin:0;padding:var(--sat,0px) 0 0 0;
  /* !important — чтобы перебить темизацию nav{...!important} на отдельных страницах
     (напр. repetitor-ege-istoriya): хедер везде выглядит одинаково */
  background:rgba(255,252,247,0.82)!important;
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(249,115,22,0.10)!important;
  box-shadow:none!important;
  transition:background .3s,box-shadow .3s;
}
.vkh .vkh-nav.scrolled{
  background:rgba(255,252,247,0.96)!important;
  box-shadow:0 6px 30px rgba(249,115,22,0.10)!important;
}
.vkh .vkh-inner{
  max-width:1240px;margin:0 auto;padding:0 24px;height:var(--nav,74px);width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.vkh .vkh-brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0;}
.vkh .vkh-mark{
  width:42px;height:42px;border-radius:13px;
  background:linear-gradient(135deg,#F97316 0%,#FF9B21 100%);
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:18px;font-weight:700;font-family:'Montserrat',sans-serif;
  box-shadow:0 8px 20px rgba(249,115,22,0.32);
}
.vkh .vkh-name{font-family:'Playfair Display',serif;font-size:22px;font-weight:700;color:var(--navy,#1A1206);white-space:nowrap;}

.vkh .vkh-links{display:flex;align-items:center;gap:30px;}
.vkh .vkh-links a{
  color:var(--text2,rgba(26,18,6,0.62));text-decoration:none;font-weight:600;font-size:15px;
  font-family:'Montserrat',sans-serif;white-space:nowrap;transition:color .2s;
  text-transform:none;letter-spacing:normal;padding:0;background:none;border-radius:0;
}
.vkh .vkh-links a:hover{color:#F97316;background:none;}

.vkh .vkh-right{display:flex;align-items:center;gap:12px;}

.vkh .vkh-btn{
  font-family:'Montserrat',sans-serif;font-weight:700;cursor:pointer;text-decoration:none;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;
  border-radius:9999px;transition:transform .25s,box-shadow .25s,background .25s,color .25s;
  text-transform:none;letter-spacing:normal;line-height:1.2;
}
.vkh .vkh-cta{
  background:linear-gradient(135deg,#F97316 0%,#FF9B21 100%);color:#fff;border:none;
  padding:11px 26px;font-size:15px;
  box-shadow:0 8px 22px rgba(249,115,22,0.28);position:relative;overflow:hidden;
}
.vkh .vkh-cta::after{
  content:'';position:absolute;top:0;left:-120%;width:100%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);transition:left .6s;
}
.vkh .vkh-cta:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(249,115,22,0.42);}
.vkh .vkh-cta:hover::after{left:120%;}
.vkh .vkh-ghost{
  background:transparent;color:#F97316;border:2px solid rgba(249,115,22,0.55);
  padding:9px 22px;font-size:15px;
}
.vkh .vkh-ghost:hover{background:#F97316;color:#fff;border-color:#F97316;transform:translateY(-2px);}

.vkh .vkh-burger{
  display:none;background:none;border:none;color:var(--navy,#1A1206);cursor:pointer;
  width:44px;height:44px;font-size:26px;align-items:center;justify-content:center;padding:0;line-height:1;
  -webkit-tap-highlight-color:transparent;
}

/* ── мобильное меню (slide-out справа) ── */
.vkh .vkh-overlay{
  position:fixed;inset:0;background:rgba(26,18,6,0.45);z-index:940;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.vkh .vkh-overlay.open{opacity:1;pointer-events:all;}
.vkh .vkh-menu{
  position:fixed;top:0;right:-100%;width:82%;max-width:360px;height:100dvh;z-index:950;
  background:rgba(255,250,242,0.98);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  box-shadow:-12px 0 40px rgba(26,18,6,0.14);transition:right .4s cubic-bezier(.16,1,.3,1);
  padding:72px 28px 28px;display:flex;flex-direction:column;gap:22px;overflow-y:auto;
}
.vkh .vkh-menu.open{right:0;}
.vkh .vkh-close{
  position:absolute;top:16px;right:16px;width:42px;height:42px;
  border:none;background:none;font-size:26px;color:var(--navy,#1A1206);cursor:pointer;padding:0;line-height:1;
}
.vkh .vkh-mlink{color:var(--navy,#1A1206);text-decoration:none;font-size:19px;font-weight:600;font-family:'Montserrat',sans-serif;text-transform:none;letter-spacing:normal;}
.vkh .vkh-mlink:hover{color:#F97316;}
.vkh .vkh-sep{height:1px;background:rgba(26,18,6,0.08);margin:4px 0;}
.vkh .vkh-menu .vkh-btn{width:100%;padding:13px 20px;font-size:16px;}

/* ── адаптив хедера ── */
@media(max-width:960px){
  .vkh .vkh-links,.vkh .vkh-right{display:none;}
  .vkh .vkh-burger{display:inline-flex;}
}
@media(max-width:560px){
  .vkh .vkh-name{font-size:19px;}
  .vkh .vkh-mark{width:38px;height:38px;font-size:16px;}
}
@media(prefers-reduced-motion:reduce){
  .vkh .vkh-cta::after{transition:none;}
}