/* Визуальный слой каталога «Книги» по утверждённому референсу.
   Разметка, ссылки, SVG-пиктограммы и обработчики остаются исходными. */
.page-knigi,
.page-knigi.forest-chrome {
  --knigi-ref-ink: #021b10;
  --knigi-ref-gold: #f0c94f;
  --knigi-ref-cream: #fff8e4;
  background:
    linear-gradient(rgba(1, 19, 10, .18), rgba(1, 19, 10, .18)),
    url('images/knigi-library-hero-v2.png') center top / cover fixed no-repeat,
    #021209 !important;
}

.page-knigi .banner {
  min-height: clamp(350px, 30vw, 455px);
  align-items: stretch;
  isolation: isolate;
  border-bottom: 1px solid rgba(240, 201, 79, .78);
  background-image: none !important;
  background-color: transparent !important;
}

.page-knigi .banner::before {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(0, 17, 10, .91) 0%, rgba(0, 20, 12, .72) 34%, rgba(0, 19, 11, .18) 62%, rgba(0, 14, 8, .38) 100%),
    linear-gradient(0deg, rgba(1, 18, 10, .86), transparent 46%);
}

.page-knigi .banner::after {
  z-index: -1;
  background: linear-gradient(180deg, rgba(1, 16, 9, .2), rgba(1, 18, 10, .02) 45%, #03150d 100%);
}

.page-knigi .banner-inner {
  display: flex;
  flex-direction: column;
  width: min(100%, 1510px);
  margin: 0 auto;
  padding: clamp(138px, 12vw, 184px) clamp(34px, 11vw, 170px) clamp(32px, 4vw, 56px);
  align-items: flex-start;
  text-align: left;
}

.page-knigi .banner-inner > * { max-width: 690px; }

.page-knigi .banner-inner .page-title {
  width: 100%;
  max-width: 690px;
  margin: 0 0 4px;
  color: #ffd568;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(3.5rem, 7vw, 6.8rem);
  font-weight: 700;
  letter-spacing: .035em;
  line-height: .92;
  text-align: left;
  text-shadow: 0 3px 0 rgba(45, 23, 1, .65), 0 0 28px rgba(255, 192, 48, .28);
  text-transform: none;
}

.page-knigi .banner .page-lead {
  max-width: 690px;
  margin: 0;
  color: var(--knigi-ref-cream);
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.35rem, 2.2vw, 2.05rem);
  font-weight: 600;
  line-height: 1.18;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .78);
}

.page-knigi .page-main {
  position: relative;
  padding: clamp(22px, 3.5vw, 48px) 0 clamp(32px, 4vw, 56px);
  isolation: isolate;
  background: transparent;
}

.page-knigi .page-main::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(1, 18, 10, .18), rgba(1, 20, 11, .6));
  opacity: 1;
}

.page-knigi .container.page-content {
  max-width: 1510px;
  padding: 0 clamp(20px, 5vw, 82px);
}

.page-knigi .knigi-buttons,
.page-knigi .knigi-buttons-series,
.page-knigi .knigi-buttons-tail { gap: clamp(13px, 1.25vw, 20px); }

.page-knigi .knigi-buttons { row-gap: clamp(13px, 1.25vw, 20px); }

.page-knigi .knigi-buttons .btn.category-card,
.page-knigi .page-content .knigi-buttons .btn.category-card,
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.category-card {
  min-height: clamp(50px, 4vw, 56px);
  padding: 7px clamp(10px, 1vw, 15px) !important;
  grid-template-columns: clamp(36px, 3vw, 42px) minmax(0, 1fr) clamp(29px, 2.5vw, 35px);
  gap: clamp(8px, .8vw, 12px);
  border: 1px solid rgba(255, 221, 113, .9) !important;
  border-radius: clamp(14px, 1.3vw, 19px) !important;
  font-size: clamp(12px, 1vw, 16px) !important;
  letter-spacing: .012em;
  box-shadow:
    0 5px 0 rgba(1, 17, 9, .98),
    0 11px 20px rgba(0, 0, 0, .48),
    inset 0 1px 0 rgba(255, 255, 255, .45),
    inset 0 -2px 0 rgba(0, 0, 0, .38) !important;
}

.page-knigi .knigi-buttons .btn.category-card::before {
  background:
    radial-gradient(circle at 13% 8%, rgba(255, 248, 185, .36), transparent 27%),
    linear-gradient(112deg, rgba(255, 255, 255, .19), transparent 32%, rgba(255, 225, 122, .1) 72%, transparent 100%);
}

body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.category-card:hover {
  transform: translateY(-3px) scale(1.018) !important;
  filter: brightness(1.12) saturate(1.08) !important;
  box-shadow:
    0 8px 0 rgba(1, 17, 9, .98),
    0 18px 27px rgba(0, 0, 0, .5),
    0 0 22px rgba(247, 200, 69, .21),
    inset 0 1px 0 rgba(255, 255, 255, .42) !important;
}

body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.category-card:active {
  transform: translateY(3px) scale(1) !important;
  box-shadow:
    0 1px 0 rgba(1, 17, 9, .98),
    0 4px 8px rgba(0, 0, 0, .35),
    inset 0 3px 8px rgba(0, 0, 0, .38) !important;
}

.page-knigi .category-icon,
.page-knigi .category-arrow {
  border-color: rgba(255, 225, 125, .95);
  color: #ffe487;
  background: rgba(1, 22, 12, .56);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .14), 0 2px 8px rgba(0, 0, 0, .24);
}

.page-knigi .category-icon { width: clamp(36px, 3vw, 42px); height: clamp(36px, 3vw, 42px); }
.page-knigi .category-icon svg { width: clamp(18px, 1.55vw, 22px); height: clamp(18px, 1.55vw, 22px); }
.page-knigi .category-arrow { width: clamp(29px, 2.5vw, 35px); height: clamp(29px, 2.5vw, 35px); }
.page-knigi .category-arrow svg { width: clamp(15px, 1.25vw, 18px); height: clamp(15px, 1.25vw, 18px); }

/* Тематические сцены повторяют принцип утверждённого образца: слева —
   читаемая подпись, справа — сюжет серии. */
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-fiction { background: linear-gradient(90deg, rgba(4, 69, 48, .96), rgba(5, 65, 45, .78) 54%, rgba(4, 37, 27, .18)), url('images/knigi-card-fiction-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-kids { background: linear-gradient(90deg, rgba(125, 81, 4, .96), rgba(111, 72, 5, .76) 54%, rgba(75, 47, 2, .2)), url('images/knigi-card-kids-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-school { background: linear-gradient(90deg, rgba(4, 84, 133, .96), rgba(5, 60, 104, .77) 54%, rgba(3, 38, 77, .18)), url('images/knigi-card-older-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-school-system { background: linear-gradient(90deg, rgba(3, 111, 104, .96), rgba(4, 83, 77, .75) 54%, rgba(3, 54, 51, .17)), url('images/knigi-card-system-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-adults { background: linear-gradient(90deg, rgba(125, 25, 55, .96), rgba(91, 18, 43, .77) 54%, rgba(62, 8, 28, .18)), url('images/knigi-card-adults-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-azbuka { background: linear-gradient(90deg, rgba(105, 38, 118, .96), rgba(69, 26, 82, .77) 54%, rgba(41, 12, 57, .18)), url('images/knigi-card-azbuka-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-special-series { background: linear-gradient(90deg, rgba(142, 78, 3, .96), rgba(94, 47, 4, .76) 54%, rgba(63, 30, 2, .17)), url('images/knigi-card-special-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-accent { background: linear-gradient(90deg, rgba(36, 112, 28, .96), rgba(13, 76, 24, .77) 54%, rgba(5, 45, 16, .18)), url('images/knigi-card-audio-v1.png') center / cover !important; }
body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.btn-knigi-pair-school { background: linear-gradient(90deg, rgba(6, 101, 152, .96), rgba(5, 62, 111, .77) 54%, rgba(3, 39, 78, .18)), url('images/knigi-card-textbooks-v1.png') center / cover !important; }

@media (max-width: 760px) {
  .page-knigi .banner { min-height: 390px; background-position: 61% center !important; }
  .page-knigi .banner-inner { padding: 185px 22px 35px; }
  .page-knigi .banner-inner .page-title {
    width: 100%;
    min-width: 0;
    font-size: clamp(2.2rem, 11.3vw, 3rem);
    overflow-wrap: normal;
  }
  .page-knigi .banner .page-lead { width: 100%; font-size: 1.2rem; max-width: 330px; }
  .page-knigi .container.page-content { padding: 0 16px; }
  .page-knigi .knigi-buttons-series,
  .page-knigi .knigi-buttons-tail { grid-template-columns: 1fr; }
  .page-knigi .knigi-buttons .btn.category-card,
  .page-knigi .page-content .knigi-buttons .btn.category-card,
  body.page-knigi:not(.page-index) .page-content .knigi-buttons .btn.category-card {
    min-height: 56px;
    grid-template-columns: 36px minmax(0, 1fr) 30px;
    border-radius: 14px !important;
    font-size: 12px !important;
  }
  .page-knigi .category-icon { width: 36px; height: 36px; }
  .page-knigi .category-icon svg { width: 18px; height: 18px; }
  .page-knigi .category-arrow { width: 30px; height: 30px; }
  .page-knigi .category-arrow svg { width: 15px; height: 15px; }
}