/* Book Psychoanalytic Theme — base styles */
*, *::before, *::after { box-sizing: border-box; }
html { 
  -webkit-text-size-adjust: 100%; 
  text-size-adjust: 100%; 
  scroll-behavior: smooth; 
}
:root {
  --page-bg: #F4EFE6;           /* warm paper */
  --ink: #1B1F2A;               /* primary text (ink) */
  --secondary-ink: #2E3245;     /* headings */
  --muted: #5C6270;             /* secondary */
  --accent: #D2BFAB;            /* accent shared with внутренних страниц */
  --accent-ink: #1E2430;        /* readable text on accent */
  --link: #4B5BA9;              /* links */
  --cta-green: #6C9775;         /* calm green for buttons */
  --cta-green-dark: #4E6F55;    /* darker hover state */
  --paper-shadow: rgba(0,0,0,.06);
  --page-width: 72ch;
  --line: 1.65;
}
body {
  margin: 0;
  color: var(--ink);
  background: var(--page-bg) url("../img/paper_texture.png") repeat;
  font-family: "Literata", "Merriweather", Georgia, "Times New Roman", serif;
  line-height: var(--line);
  letter-spacing: .01em;
  -webkit-font-smoothing: antialiased;
  font-kerning: normal;
  hanging-punctuation: first last;
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }
.muted { color: var(--muted); }
blockquote {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
  border-left: 2px solid color-mix(in oklab, var(--accent), transparent 40%);
  font-style: italic;
  color: var(--muted);
}

.quote-card {
  position: relative;
  margin: 1.75rem 0 0;
  padding: 1.25rem 1.4rem 1.35rem;
  border-radius: .65rem;
  background: color-mix(in oklab, #fff 70%, var(--accent) 30%);
  border: 1px solid rgba(0,0,0,.04);
  box-shadow: 0 32px 40px -36px rgba(0,0,0,.35);
  font-style: italic;
  color: var(--secondary-ink);
}
.quote-card::before {
  content: "«";
  position: absolute;
  top: .2rem;
  left: 1rem;
  font-size: 3rem;
  line-height: 1;
  color: color-mix(in oklab, var(--accent), #fff 35%);
  opacity: .45;
  pointer-events: none;
}
.quote-card p {
  margin: 0;
}
.quote-card .quote-author {
  margin-top: .85rem;
  font-style: normal;
  font-size: .95rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.quote-card--inline {
  background: color-mix(in oklab, #fff 85%, var(--page-bg) 15%);
  box-shadow: 0 20px 30px -34px rgba(0,0,0,.35);
}

/* Book container */
.book {
  max-width: calc(var(--page-width) + 40ch);
  margin: 0 auto;
  padding: 0 2rem 6rem;
  position: relative;
}
.book::before, .book::after {
  content: "";
  position: absolute;
  top: 0; bottom: 0;
  width: 12px;
  filter: blur(1px);
  background: repeating-linear-gradient(
    to bottom,
    rgba(0,0,0,.02) 0 2px,
    transparent 2px 4px
  );
  opacity: .4;
  pointer-events: none;
}
.book::before { left: 0; box-shadow: 12px 0 24px -12px var(--paper-shadow) inset; }
.book::after  { right: 0; box-shadow: -12px 0 24px -12px var(--paper-shadow) inset; }

/* Header / cover */
.header {
  max-width: var(--page-width);
  margin: 0 auto;
  padding: 3rem 0 2rem;
  position: relative;
}
.brand { font-family: "Playfair Display", "Garamond", serif; letter-spacing: .03em; }
.brand a { color: inherit; }
.header .brand { font-size: clamp(1.2rem, 1.6vw + .8rem, 1.8rem); font-weight: 600; }
.cover {
  max-width: var(--page-width);
  margin: 2.5rem auto 4rem;
  padding: 2.5rem 2rem;
  background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.35));
  border-radius: .5rem;
  box-shadow: 0 40px 60px -40px var(--paper-shadow), 0 1px 0 rgba(255,255,255,.35) inset;
  position: relative;
  overflow: hidden;
}
.cover h1 {
  margin: 0 0 .6rem;
  font-family: "Playfair Display", "Garamond", serif;
  font-weight: 400;
  font-size: clamp(1.8rem, 4.6vw + .8rem, 3.4rem);
  color: var(--secondary-ink);
}
.dropcap {
  float: left;
  font-family: "Playfair Display", "Garamond", serif;
  font-size: clamp(3.2rem, 6vw, 4.2rem);
  line-height: .9;
  margin-right: .2rem;
  color: color-mix(in oklab, var(--secondary-ink), var(--accent) 35%);
}
.book h2,
.book h3,
.book h4 {
  font-family: "Playfair Display", "Garamond", serif;
}
.cover p.lead {
  margin: 0;
  font-size: clamp(1rem, .6vw + .9rem, 1.25rem);
  color: var(--muted);
}
.cover .inkblot {
  position: absolute;
  right: -6%;
  bottom: -8%;
  width: clamp(220px, 40vw, 520px);
  mix-blend-mode: multiply;
  opacity: .18;
  transform: rotate(-2deg);
  pointer-events: none;
}

/* TOC / nav */
.toc {
  max-width: var(--page-width);
  margin: 1.5rem auto 2.5rem;
  padding-left: 0;
  list-style: none;
  border-left: 3px solid rgba(0,0,0,.08);
}
.toc li { margin: .35rem 0; padding-left: 1rem; }
.toc a { text-decoration: none; }
.toc a .num { color: var(--muted); margin-right: .5rem; }

/* Chapters */
main { counter-reset: chapter; }
.chapter {
  display: grid;
  grid-template-columns: 1fr minmax(0, var(--page-width)) 24ch 1fr;
  gap: 0 1.5rem;
  margin: 3.2rem 0;
  position: relative;
  counter-increment: chapter;
}
.chapter > .content { grid-column: 2; }
.chapter > .sidenote { grid-column: 3; color: var(--muted); font-size: .9rem; }
.chapter > .sidenote p { margin: 0 0 .6rem; }
.chapter::before {
  content: "Глава " counter(chapter);
  position: absolute;
  left: calc(50% - var(--page-width)/2);
  top: -1.8rem;
  font: italic 500 .95rem/1.2 "Playfair Display", "Garamond", serif;
  color: var(--muted);
  opacity: .85;
}
.chapter h2 {
  font-family: "Playfair Display", "Garamond", serif;
  font-weight: 400;
  margin: 0 0 .6rem;
  font-size: clamp(1.25rem, 1.2vw + 1rem, 2rem);
  color: var(--secondary-ink);
}
.chapter p { margin: 0 0 1rem; }
.chapter ul { margin: 0 0 1rem 1.25rem; padding-left: 1.25rem; }
.chapter ul li { margin: 0 0 .5rem; }
.chapter p.lead::first-letter {
  initial-letter: 2;
  -webkit-initial-letter: 2;
  font-weight: 600;
  color: var(--accent);
}

/* Advantages / trust blocks */
.advantages-list {
  display: grid;
  gap: 1.2rem;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}
.adv-card {
  background: color-mix(in oklab, #fff 75%, var(--page-bg) 25%);
  border: 1px solid rgba(0,0,0,.05);
  border-radius: .65rem;
  padding: 1rem 1.2rem 1.1rem;
  box-shadow: 0 24px 40px -36px rgba(0,0,0,.25);
}
.adv-card h3 {
  margin: 0 0 .35rem;
  font-size: 1.05rem;
}
.adv-icon {
  display: inline-flex;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  background: color-mix(in oklab, var(--accent), white 15%);
  color: var(--accent-ink);
  margin-bottom: .5rem;
  box-shadow: 0 10px 20px rgba(0,0,0,.1);
}

.sticker-list {
  margin: 1.25rem 0 1.8rem;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
}

.sticker {
  background: #fffef7;
  border-radius: .85rem;
  padding: 1rem 1.1rem 1.2rem;
  box-shadow: 0 26px 38px -32px rgba(0,0,0,.5);
  border: 1px solid rgba(0,0,0,.04);
  position: relative;
  color: var(--secondary-ink);
  font-weight: 500;
  line-height: 1.5;
  transform: rotate(var(--sticker-tilt, -.8deg));
  transition: box-shadow .3s ease, transform .3s ease;
  isolation: isolate;
}

.sticker::after {
  content: "";
  position: absolute;
  top: -.45rem;
  left: 50%;
  width: 48%;
  height: .45rem;
  background: rgba(255, 231, 171, .8);
  border-radius: 999px;
  transform: translateX(-50%) rotate(-2deg);
  box-shadow: 0 6px 10px rgba(0,0,0,.15);
  opacity: .9;
  z-index: -1;
}

.sticker-list li:nth-child(2n) { --sticker-tilt: .6deg; }
.sticker-list li:nth-child(3n) { --sticker-tilt: -.2deg; }
.sticker-list li:nth-child(4n) { --sticker-tilt: 1deg; }

.sticker:hover,
.sticker:focus-visible {
  outline: 2px solid color-mix(in oklab, var(--cta-green), white 35%);
  outline-offset: 3px;
  box-shadow: 0 32px 44px -28px rgba(0,0,0,.45);
  animation: sticker-bob .9s ease-in-out infinite;
}

@keyframes sticker-bob {
  0%   { transform: rotate(var(--sticker-tilt, 0deg)) translateY(0); }
  50%  { transform: rotate(var(--sticker-tilt, 0deg)) translateY(-6px); }
  100% { transform: rotate(var(--sticker-tilt, 0deg)) translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .sticker {
    transition: none;
    animation: none !important;
  }
  .sticker:hover,
  .sticker:focus-visible {
    animation: none;
    transform: rotate(var(--sticker-tilt, -.8deg));
  }
}

.request-block { margin-top: 1.4rem; }
.request-block h3 { margin: 0 0 .4rem; font-size: 1.1rem; }
.request-list { margin: .4rem 0 1rem 1.1rem; padding-left: 1.1rem; }

.badge-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin: 1.5rem 0 0;
}
.badge {
  padding: .9rem 1rem;
  border-radius: .8rem;
  background: rgba(255,255,255,.6);
  border: 1px dashed rgba(0,0,0,.08);
  font-size: .95rem;
  box-shadow: 0 18px 30px -30px rgba(0,0,0,.5);
}
.badge span {
  display: block;
  font-weight: 600;
  color: var(--secondary-ink);
}

.blog-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1.2rem;
  margin: 1.25rem 0 0;
}
.blog-card {
  background: rgba(255,255,255,.65);
  border-radius: .75rem;
  padding: 1.1rem 1.2rem;
  border: 1px solid rgba(0,0,0,.05);
  display: flex;
  flex-direction: column;
  gap: .4rem;
  box-shadow: 0 24px 40px -34px rgba(0,0,0,.35);
}
.blog-card h3 {
  margin: 0;
  font-size: 1.05rem;
}
.blog-card p {
  margin: 0;
  color: var(--muted);
}
.blog-card a {
  margin-top: .6rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
}

.contact-list p {
  margin: .3rem 0;
}
.contact-cta {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 1rem 0 1.25rem;
}
.snippet-recommendations {
  margin-top: 1.5rem;
  padding: 1rem 1.25rem;
  border-radius: .75rem;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(244, 239, 230, .5);
}
.snippet-recommendations h3 {
  margin-top: 0;
  margin-bottom: .35rem;
  font-size: 1.05rem;
}
.snippet-recommendations ul {
  margin: 0;
  padding-left: 1.1rem;
}
.snippet-recommendations li {
  margin-bottom: .4rem;
}

.floating-cta {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  padding: .65rem 1rem;
  border-radius: 999px;
  background: var(--cta-green);
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  box-shadow: 0 20px 40px rgba(0,0,0,.25);
  z-index: 950;
}
.floating-cta:hover {
  text-decoration: none;
  background: var(--cta-green-dark);
}

@media (max-width: 640px) {
  .floating-cta { bottom: .85rem; right: .85rem; }
}

/* Footnotes area */
.footnotes { 
  max-width: var(--page-width); 
  margin: 3rem auto 0; 
  border-top: 1px solid rgba(0,0,0,.08);
  padding-top: 1rem;
  color: var(--muted);
}
.footnotes ol { margin: 0; padding-left: 1.25rem; }
sup.fn-ref { font-size: .75em; vertical-align: super; }

/* Progress bar */
.progress {
  position: fixed;
  left: 0; top: 0; right: 0;
  height: 4px;
  background: var(--accent);
  transform: scaleX(var(--p, 0));
  transform-origin: 0 50%;
  z-index: 1000;
  opacity: .9;
  transition: transform .2s ease-out;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .progress { transition: none; }
}

/* Sticky prev/next */
.pager {
  max-width: var(--page-width);
  margin: 2.5rem auto 0;
  display: flex; justify-content: space-between; gap: 1rem;
}
.pager a {
  display: inline-block;
  padding: .6rem .9rem;
  border-radius: .35rem;
  background: rgba(0,0,0,.06);
  color: inherit;
  text-decoration: none;
}

/* Top bar (theme & toc) */
.topbar {
  position: sticky; top: 0;
  backdrop-filter: blur(4px);
  background: color-mix(in oklab, var(--page-bg), transparent 20%);
  border-bottom: 1px solid rgba(0,0,0,.06);
  z-index: 900;
}
.topbar-inner {
  max-width: var(--page-width);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .6rem 0;
  gap: 1rem;
}
.topbar .toc {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  margin: 0;
  padding-left: 0;
  list-style: none;
  border-left: none;
}
.topbar .toc li { margin: 0; padding-left: 0; }
.topbar .toc a {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: inherit;
  font-size: .9rem;
  text-decoration: none;
}
.topbar .toc a .num { color: var(--muted); font-variant-numeric: oldstyle-nums; }
.topbar .toc a:hover { text-decoration: underline; }
.btn {
  appearance: none;
  border: 1px solid color-mix(in oklab, var(--cta-green-dark), transparent 50%);
  cursor: pointer;
  background: var(--cta-green);
  color: #fff;
  padding: .55rem 1.2rem;
  border-radius: .8rem;
  font-family: inherit;
  font-weight: 600;
  letter-spacing: .01em;
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
  transition: transform .15s ease, filter .15s ease;
}
.btn:hover,
.btn:focus-visible {
  filter: none;
  background: var(--cta-green-dark);
  transform: translateY(-1px);
}

/* Responsive adjustments */
@media (max-width: 1024px) {
  .chapter { grid-template-columns: 1fr minmax(0, var(--page-width)) 1fr; }
  .chapter > .sidenote { grid-column: 2; margin: .5rem 0 0; }
}
@media print {
  .topbar, .progress, .pager { display: none; }
  body { background: #fff !important; color: #111 !important; }
  .book::before, .book::after { display: none; }
  a { color: #000; text-decoration: none; }
}