/* ── Первый экран целиком на 13" ────────────────────────────── */
@media (min-width: 981px) {
  #top { padding-top: clamp(18px, 2.6vh, 52px) !important; padding-bottom: clamp(16px, 2.4vh, 40px) !important; gap: clamp(32px, 3.4vw, 56px) !important; align-items: center; }
  #hero-frame { max-height: calc(100vh - 265px); max-height: calc(100svh - 265px); min-height: 380px; }
  #stats > div { padding-top: clamp(16px, 2vh, 26px) !important; padding-bottom: clamp(16px, 2vh, 26px) !important; }
}
@media (min-width: 981px) and (max-height: 900px) {
  #top h1 { font-size: clamp(38px, 4.4vw, 58px) !important; margin-bottom: 20px !important; }
  #top p  { font-size: 17px !important; margin-bottom: 26px !important; }
  #top .hero-cta a { padding-top: 14px !important; padding-bottom: 14px !important; }
  #stats span:first-child { font-size: 26px !important; }
}

/* ── Хаб базы знаний ────────────────────────────────────────── */
.kb-wrap-wide { max-width: 1360px; }
.kb-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1px; background: rgba(237,231,219,.12); border: 1px solid rgba(237,231,219,.12); }
.kb-card { display: block; background: #0E1512; padding: clamp(22px,2.4vw,32px); transition: background .22s ease; }
.kb-card:hover { background: #16211C; }
.kb-card-n { font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: #C9A25E; }
.kb-card h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(20px,2.1vw,26px); line-height: 1.2; margin: 12px 0 10px; color: #EDE7DB; }
.kb-card p { margin: 0; font-size: 14.5px; line-height: 1.5; color: rgba(237,231,219,.6); }
.kb-card:hover h2 { color: #C9A25E; }
.kb-qa { padding: clamp(22px,2.6vw,32px) 0; border-bottom: 1px solid rgba(237,231,219,.12); }
.kb-qa h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(21px,2.4vw,30px); line-height: 1.2; margin: 0 0 12px; color: #EDE7DB; }
.kb-answer { margin: 0; font-size: 17px; line-height: 1.7; color: rgba(237,231,219,.8); max-width: 62ch; }
.kb-plan { padding: clamp(26px,3vw,40px) 0 12px; }
.kb-plan h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(20px,2.2vw,26px); margin: 0 0 16px; color: #EDE7DB; }
.kb-plan ul { margin: 0; padding-left: 20px; }
.kb-plan li { font-size: 16px; line-height: 1.6; color: rgba(237,231,219,.62); margin-bottom: 10px; }
.kb-draft { margin: 20px 0 0; padding: 12px 16px; border-left: 2px solid #C9A25E; background: rgba(201,162,94,.08); font-size: 14px; line-height: 1.5; color: rgba(237,231,219,.7); }

/* ══ СВЕТЛАЯ ТЕМА БАЗЫ ЗНАНИЙ ═══════════════════════════════ */
.kb-theme {
  --paper: #FBF8F2; --paper-2: #F3ECDF; --card: #FFFFFF;
  --ink: #1E231C; --ink-2: #4C544A; --ink-3: #7A8177;
  --line: rgba(30,35,28,.13); --gold: #8A6A28; --gold-soft: #C9A25E;
  background: var(--paper) !important;
  color: var(--ink) !important;
}
.kb-theme a { color: var(--gold); }
.kb-theme a:hover { color: #6B5017 !important; }
.kb-theme ::selection { background: var(--gold-soft); color: #1E231C; }

/* шапка и подвал в светлом */
.kb-theme header { background: rgba(251,248,242,.88) !important; border-bottom: 1px solid var(--line) !important; }
.kb-theme header a { color: var(--ink) !important; }
.kb-theme #nav a { color: var(--ink-2) !important; }
.kb-theme #nav a:hover { color: var(--gold) !important; }
.kb-theme header span[style*="0.3em"] { color: var(--gold) !important; }
.kb-theme header a[href="/#book"] { border-color: var(--gold) !important; color: var(--gold) !important; }
.kb-theme header a[href="/#book"]:hover { background: var(--gold) !important; color: #FBF8F2 !important; }
.kb-theme footer { background: var(--paper-2) !important; max-width: none !important; padding-left: clamp(20px,4.5vw,40px) !important; padding-right: clamp(20px,4.5vw,40px) !important; }
.kb-theme footer > div { max-width: 1360px; margin: 0 auto; border-bottom-color: var(--line) !important; }
.kb-theme footer a { color: var(--ink-2) !important; }
.kb-theme footer a:hover { color: var(--gold) !important; }
.kb-theme footer p { color: var(--ink-3) !important; }
.kb-theme footer div[style*="0.2em"] { color: var(--gold) !important; }

/* каркас */
.kb-wrap { max-width: 780px; margin: 0 auto; padding: 0 clamp(20px,5vw,40px); }
.kb-wrap-wide { max-width: 1240px; }
.kb-head { background: var(--paper-2); border-bottom: 1px solid var(--line); padding: clamp(40px,5.5vw,76px) 0 clamp(32px,4vw,52px); }
.kb-crumbs { font-size: 12.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 24px; }
.kb-crumbs a { color: var(--gold); }
.kb-crumbs span { color: var(--ink-3); }
.kb-head h1 { font-family: Prata, serif; font-weight: 400; font-size: clamp(32px,4.6vw,54px); line-height: 1.08; letter-spacing: -.02em; margin: 0 0 22px; color: var(--ink); text-wrap: balance; }
.kb-intro { margin: 0; font-size: clamp(17px,1.4vw,19px); line-height: 1.65; color: var(--ink-2); max-width: 58ch; }
.kb-list { padding: clamp(36px,4.5vw,64px) 0 clamp(28px,3.5vw,48px); }

/* карточки разделов */
.kb-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(272px,1fr)); gap: clamp(14px,1.4vw,20px); }
.kb-card { display: block; background: var(--card); border: 1px solid var(--line); border-radius: 5px; padding: clamp(22px,2vw,28px); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.kb-card:hover { border-color: rgba(138,106,40,.45); box-shadow: 0 8px 26px rgba(30,35,28,.09); transform: translateY(-3px); }
.kb-card-n { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.kb-card h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(19px,1.7vw,23px); line-height: 1.22; margin: 12px 0 10px; color: var(--ink); }
.kb-card p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--ink-3); }

/* вопрос-ответ */
.kb-qa { background: var(--card); border: 1px solid var(--line); border-left: 3px solid var(--gold-soft); border-radius: 4px; padding: clamp(22px,2.4vw,30px) clamp(20px,2.4vw,32px); margin-bottom: clamp(14px,1.4vw,18px); }
.kb-qa h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(20px,2vw,27px); line-height: 1.25; margin: 0 0 12px; color: var(--ink); }
.kb-answer { margin: 0; font-size: 17.5px; line-height: 1.72; color: var(--ink-2); }

/* тело статьи */
.kb-post { padding: clamp(26px,3vw,40px) 0; border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.kb-post:last-child { border-bottom: 0; }
.kb-meta { display: flex; flex-wrap: wrap; gap: 16px; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3); margin-bottom: 14px; }
.kb-cat { color: var(--gold); }
.kb-post h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(23px,2.7vw,34px); line-height: 1.18; margin: 0 0 14px; color: var(--ink); }
.kb-lead { margin: 0 0 18px; font-size: 18.5px; line-height: 1.65; color: var(--ink-2); }
.kb-body p { margin: 0 0 18px; font-size: 17.5px; line-height: 1.78; color: #383F35; }
.kb-body h3 { font-family: Prata, serif; font-weight: 400; font-size: 22px; margin: 30px 0 12px; color: var(--ink); }
.kb-body ul, .kb-body ol { margin: 0 0 18px; padding-left: 22px; font-size: 17.5px; line-height: 1.78; color: #383F35; }
.kb-body li { margin-bottom: 8px; }

/* план раздела */
.kb-plan { margin-top: clamp(26px,3vw,40px); padding-top: clamp(24px,2.6vw,32px); border-top: 1px solid var(--line); }
.kb-plan h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(19px,1.9vw,24px); margin: 0 0 18px; color: var(--ink); }
.kb-plan ul { margin: 0; padding: 0; list-style: none; counter-reset: kb; }
.kb-plan li { counter-increment: kb; position: relative; padding: 13px 0 13px 44px; border-bottom: 1px solid var(--line); font-size: 16.5px; line-height: 1.5; color: var(--ink-2); }
.kb-plan li:last-child { border-bottom: 0; }
.kb-plan li::before { content: counter(kb,decimal-leading-zero); position: absolute; left: 0; top: 14px; font-size: 12px; letter-spacing: .08em; color: var(--gold); }
.kb-up { display: inline-block; margin-top: 26px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3) !important; }
.kb-up:hover { color: var(--gold) !important; }
.kb-draft { margin: 24px 0 0; padding: 13px 18px; border-left: 3px solid var(--gold-soft); background: rgba(201,162,94,.14); border-radius: 3px; font-size: 14px; line-height: 1.55; color: #5A4A22; }

/* призыв в конце — тёмный, как на главной */
.kb-cta { background: #14201B; padding: clamp(48px,6vw,84px) 0; text-align: center; }
.kb-cta h2 { font-family: Prata, serif; font-weight: 400; font-size: clamp(25px,3vw,38px); margin: 0 0 14px; color: #EDE7DB; }
.kb-cta p { margin: 0 0 28px; font-size: 17px; line-height: 1.6; color: rgba(237,231,219,.7); }
.kb-btn { display: inline-block; background: #C9A25E; color: #14201B !important; padding: 16px 34px; border-radius: 2px; font-size: 12.5px; letter-spacing: .1em; text-transform: uppercase; transition: background .22s ease; }
.kb-btn:hover { background: #E4C68F; color: #14201B !important; }

@media (max-width: 560px) {
  .kb-qa { padding-left: 18px; padding-right: 18px; }
  .kb-answer, .kb-body p, .kb-body ul, .kb-body ol { font-size: 16.5px; }
  .kb-plan li { padding-left: 38px; font-size: 15.5px; }
}

/* ══ МОБИЛЬНАЯ ВЕРСИЯ ═══════════════════════════════════════ */
#burger { display: none; margin-left: auto; width: 44px; height: 44px; padding: 10px; background: none; border: 1px solid rgba(237,231,219,.25); border-radius: 3px; cursor: pointer; flex-direction: column; justify-content: center; gap: 5px; }
#burger span { display: block; height: 2px; width: 100%; background: #EDE7DB; border-radius: 2px; transition: transform .25s ease, opacity .25s ease; }
#burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
#burger.is-open span:nth-child(2) { opacity: 0; }
#burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
#mnav { display: none; }
.kb-theme #burger { border-color: rgba(30,35,28,.3); }
.kb-theme #burger span { background: #1E231C; }

@media (max-width: 980px) {
  header > div { gap: 14px !important; }
  #nav { display: none !important; }
  header a[href="#book"], header a[href="/#book"] { display: none; }
  #burger { display: flex; }
  #mnav:not([hidden]) { display: flex; flex-direction: column; border-top: 1px solid rgba(237,231,219,.12); background: rgba(14,21,18,.97); backdrop-filter: blur(16px); }
  #mnav a { padding: 15px clamp(16px,4vw,40px); font-size: 15px; letter-spacing: .04em; color: rgba(237,231,219,.85); border-bottom: 1px solid rgba(237,231,219,.07); }
  #mnav a:active { background: rgba(201,162,94,.12); }
  #mnav .mnav-cta { color: #C9A25E; font-weight: 600; }
  .kb-theme #mnav:not([hidden]) { background: rgba(251,248,242,.98); border-top-color: rgba(30,35,28,.12); }
  .kb-theme #mnav a { color: #1E231C; border-bottom-color: rgba(30,35,28,.08); }
  .kb-theme #mnav .mnav-cta { color: #8A6A28; }
  html.mnav-open { overflow: hidden; }
}

#ask { display: flex; flex-direction: column; gap: 16px; }
.ask-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; }
.ask-field { display: flex; flex-direction: column; gap: 6px; }
.ask-field span { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: rgba(237,231,219,.5); }
.ask-field input, .ask-field select, .ask-field textarea { background: rgba(237,231,219,.05); border: 1px solid rgba(237,231,219,.2); border-radius: 3px; padding: 13px 14px; font: inherit; font-size: 16px; color: #EDE7DB; width: 100%; }
.ask-field textarea { resize: vertical; min-height: 96px; }
.ask-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #C9A25E 50%), linear-gradient(135deg, #C9A25E 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.ask-field input:focus, .ask-field select:focus, .ask-field textarea:focus { outline: none; border-color: #C9A25E; background: rgba(237,231,219,.08); }
#ask button { margin-top: 4px; background: #C9A25E; color: #0E1512; border: none; border-radius: 2px; padding: 17px; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; font-family: inherit; cursor: pointer; transition: background .2s ease; }
#ask button:hover { background: #E4C68F; }
.ask-note { font-size: 12.5px; line-height: 1.55; color: rgba(237,231,219,.35); }
.ask-ok { padding: 12px 14px; border: 1px solid rgba(201,162,94,.5); border-radius: 3px; background: rgba(201,162,94,.1); font-size: 14px; color: #E4C68F; }

@media (max-width: 560px) {
  #top h1 { font-size: clamp(27px, 8.2vw, 34px) !important; margin-bottom: 16px !important; }
  #top p { font-size: 15.5px !important; line-height: 1.6 !important; margin-bottom: 22px !important; }
  #top .hero-cta a { padding: 14px 18px !important; font-size: 12px !important; width: 100%; text-align: center; }
  #top .hero-cta { flex-direction: column; }
  #stats span:first-child { font-size: 24px !important; }
  #stats > div { gap: 18px 24px !important; }
  section h2 { font-size: clamp(24px, 7vw, 30px) !important; }
  #book-grid { gap: 30px !important; }
  #book-grid h2 { font-size: clamp(25px, 7.4vw, 32px) !important; margin-bottom: 16px !important; }
  #book-grid p { font-size: 15.5px !important; margin-bottom: 22px !important; }
  .ask-row { grid-template-columns: 1fr; }
  footer { padding-top: 44px !important; }
  #footer-grid { gap: 26px !important; }
  .kb-head { padding-top: 28px; padding-bottom: 26px; }
  .kb-head h1 { font-size: clamp(26px, 7.6vw, 32px); margin-bottom: 14px; }
  .kb-intro { font-size: 15.5px; }
  .kb-crumbs { margin-bottom: 16px; font-size: 11.5px; }
  .kb-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * clamp(20px,5vw,40px)); padding: 0 clamp(20px,5vw,40px) 4px; }
  .kb-chips::-webkit-scrollbar { display: none; }
  .kb-chip { white-space: nowrap; flex: 0 0 auto; font-size: 12.5px; padding: 8px 12px; }
  .kb-cards { grid-template-columns: 1fr; }
  .kb-card { padding: 18px; }
  .kb-qa { padding: 18px 16px; }
  .kb-qa h2 { font-size: 19px; }
  .kb-answer { font-size: 16px; line-height: 1.65; }
  .kb-list { padding-top: 24px; }
  .kb-cta { padding: 40px 0; }
  .kb-cta h2 { font-size: 24px; }
}
