/* books.css — стили контента книг single-page оболочки:
   тарифные страницы, форма входа, кнопки-строки, кросс-фейд. */

/* ── кнопки-ссылки на основе bk-row / inline (это <button>, сбрасываем вид) ── */
.bk-row{ width:100%; text-align:left; background:none; border:none; border-bottom:1px dotted rgba(26,22,18,.22);
  font:inherit; cursor:pointer; }
.bk-inline-link{ background:none; border:none; padding:0; font:inherit; cursor:pointer;
  color:var(--note); text-decoration:underline; letter-spacing:inherit; }
.bk-inline-link:hover{ color:var(--note-deep,#8a3f17); }

/* ── кросс-фейд для perf-lite ── */
#xfade{ position:fixed; inset:0; z-index:400; opacity:0; pointer-events:none;
  background:radial-gradient(120% 80% at 50% 30%, #faf8f0 0%, #efeae0 60%, #e6dfcc 100%); }

/* ── листы «прострела»: реальные .page.right поверх книги, вертятся у корешка ── */
.page.right.riffle-sheet{
  transform: rotateY(0deg);
  transition: transform .30s cubic-bezier(.42,.04,.32,1);
  pointer-events:none;
}
.page.right.riffle-sheet.turned{ transform: rotateY(-179deg); }
.page.right.riffle-sheet .face{
  background: linear-gradient(105deg, #f3efe3 0%, var(--paper,#f7f3e8) 45%, #efe9da 100%);
  box-shadow: -10px 6px 24px rgba(20,12,4,.16);
}
.page.right.riffle-sheet .face.front::after{
  /* мягкая тень у корешка во время переворота */
  content:''; position:absolute; inset:0; pointer-events:none;
  background: linear-gradient(to right, rgba(60,40,20,.20) 0%, rgba(60,40,20,0) 24%);
}

/* ════════════ ТАРИФНАЯ СТРАНИЦА ════════════ */
.t-page{ position:relative; display:flex; flex-direction:column; height:100%; }
.t-page.featured::after{ content:''; position:absolute; inset:-10px -6px; border:1px solid rgba(138,63,23,.3); pointer-events:none; }
.t-badge{ align-self:flex-start; padding:4px 12px; margin-bottom:14px; background:#8a3f17; color:#f3ecd9; border:1px solid #b65a2a;
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; transform:rotate(-1.5deg); box-shadow:1px 1px 0 rgba(26,22,18,.22); }
.t-eyebrow{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-text,#8a6d2f); margin-bottom:12px; }
.t-name{ font-family:'Cormorant Garamond',serif; font-weight:300; font-style:italic; font-size:clamp(38px,5vmin,64px); line-height:.95; color:var(--ink); margin:0; letter-spacing:-.02em; }
.t-price{ font-family:'Cormorant Garamond',serif; font-weight:400; font-size:clamp(46px,6vmin,74px); color:var(--ink); line-height:1; margin:18px 0 2px; }
.t-period{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:18px; }
.t-desc{ font-family:'Cormorant Garamond',serif; font-size:clamp(16px,1.3vmin,19px); line-height:1.5; color:var(--ink-mute); margin:0 0 18px; }
.t-features{ list-style:none; padding:0; margin:0 0 26px; }
.t-features li{ position:relative; padding:9px 0 9px 26px; font-family:'Cormorant Garamond',serif; font-size:clamp(15px,1.25vmin,18px); color:var(--ink); border-bottom:1px solid var(--rule-soft); }
.t-features li::before{ content:'✓'; position:absolute; left:0; top:9px; color:#5d7a3c; font-weight:bold; }
.t-buy{ margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%;
  background:#1a1612; color:#f3ecd9; border:none; padding:15px 24px; cursor:pointer; text-decoration:none;
  font-family:'Cormorant Garamond',serif; font-style:italic; font-size:18px; border-radius:0;
  box-shadow: inset 0 1px 0 rgba(255,235,200,.18), inset 0 -2px 0 rgba(0,0,0,.35), 0 2px 0 #0a0805, 0 6px 18px rgba(30,18,10,.28);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.t-buy:hover{ transform:translateY(-1px); background:#2a201a; box-shadow: inset 0 1px 0 rgba(255,235,200,.24), inset 0 -2px 0 rgba(0,0,0,.35), 0 3px 0 #0a0805, 0 10px 22px rgba(30,18,10,.34); }
.t-buy:active{ transform:translateY(1px); }
.t-buy.ghost{ background:transparent; color:#1a1612; border:1px solid rgba(26,22,18,.22); box-shadow:none; }
.t-buy.ghost:hover{ background:#1a1612; color:#f3ecd9; border-color:#1a1612; transform:none; }

/* ════════════ ФОРМА ВХОДА ════════════ */
.reg-card{ display:flex; flex-direction:column; }
.reg-step{ display:none; }
.reg-step.active{ display:block; }
.reg-field{ display:block; margin:18px 0 4px; position:relative; }
.reg-label{ display:block; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:7px; }
.reg-input{ width:100%; background:transparent; border:none; border-bottom:1.5px solid var(--rule); padding:9px 0; font-family:'Cormorant Garamond',serif; font-style:italic; font-size:22px; color:var(--ink); outline:none; border-radius:0; -webkit-appearance:none; transition:border-color .18s; }
.reg-input::placeholder{ color:var(--ink-mute); }
.reg-input:focus{ border-bottom-color:var(--ink); }
.reg-field.ok .reg-input{ border-bottom-color:#5d7a3c; }
.reg-field.warn .reg-input{ border-bottom-color:#8a6d2f; }
.reg-field.error .reg-input{ border-bottom-color:#8a3f17; }
.reg-helper{ display:block; font-size:14px; color:var(--ink-mute); margin-top:7px; min-height:18px; font-family:'Cormorant Garamond',serif; }
.reg-field.error .reg-helper{ color:#8a3f17; }
.reg-field.warn .reg-helper{ color:#8a6d2f; }
.reg-field.ok .reg-helper{ color:#5d7a3c; }
.reg-suggest{ background:none; border:none; padding:0; font:inherit; color:var(--ink); text-decoration:underline; cursor:pointer; }
.reg-suggest:hover{ color:#8a3f17; }
.reg-consents{ margin:16px 0; border-top:1px solid var(--rule-soft); }
.reg-consent{ display:flex; gap:11px; align-items:flex-start; padding:8px 0; border-bottom:1px solid var(--rule-soft); font-family:'Cormorant Garamond',serif; font-size:14px; line-height:1.35; color:var(--ink); cursor:pointer; }
.reg-consent input{ flex:0 0 18px; width:18px; height:18px; margin-top:2px; }
.reg-consent small{ display:block; font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-mute); margin-top:3px; }
.reg-change{ background:none; border:none; color:var(--ink); text-decoration:underline; cursor:pointer; font:inherit; padding:0; margin-left:6px; }
.reg-change:hover{ color:#8a3f17; }

/* ════ «О книге» — слайды (hero / blurb / look-inside / форматы) ════ */
.ob-cta{ align-self:flex-start; display:inline-flex; align-items:center; gap:10px; border:none; cursor:pointer;
  background:var(--ink,#1a1612); color:var(--ivory,#f7f3ea); padding:16px 38px; border-radius:0;
  font-family:'JetBrains Mono',monospace; text-transform:uppercase; font-size:11.5px; letter-spacing:.18em;
  transition:transform .15s, box-shadow .15s, background .15s; box-shadow:0 10px 22px -12px rgba(26,22,18,.5); }
.ob-cta:hover{ background:#2a2018; transform:translateY(-1px); box-shadow:0 16px 28px -12px rgba(26,22,18,.6); }
.ob-cta:active{ transform:translateY(0); }
.ob-cta .k{ color:var(--gold,#c8a163); }
.ob-toc{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; }
.ob-toc-row{ display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:baseline; width:100%; text-align:left;
  background:none; border:none; border-top:1px solid var(--rule-soft); padding:12px 4px; cursor:pointer; font-family:inherit;
  transition:background .15s, padding-left .15s; }
.ob-toc-row:hover{ background:rgba(182,90,42,.06); padding-left:10px; }
.ob-toc-num{ font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.08em; color:var(--note,#b65a2a); white-space:nowrap; padding-top:3px; }
.ob-toc-ttl{ font-family:'Cormorant Garamond',serif; font-style:italic; font-size:17px; line-height:1.25; color:var(--ink,#1a1612); }
.ob-list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:9px; }
.ob-list li{ display:flex; gap:10px; font-family:'Cormorant Garamond',serif; font-size:16px; line-height:1.35; color:var(--ink,#1a1612); }
.ob-list li .d{ color:var(--note,#b65a2a); flex:0 0 auto; }
.ob-fmt{ display:flex; flex-direction:column; }
.ob-fmt-row{ display:flex; justify-content:space-between; align-items:baseline; gap:18px; border-top:1px solid var(--rule-soft); padding:15px 0; }
.ob-fmt-row:last-child{ border-bottom:1px solid var(--rule-soft); }
.ob-fmt-name{ font-family:'Cormorant Garamond',serif; font-style:italic; font-size:20px; color:var(--ink,#1a1612); line-height:1.15; }
.ob-fmt-sub{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-mute,#5c5963); margin-top:5px; }
.ob-fmt-price{ font-family:'Cormorant Garamond',serif; font-size:25px; color:var(--note,#b65a2a); white-space:nowrap; }
.ob-fmt-price .slot{ display:inline-block; min-width:60px; border-bottom:1px dashed var(--rule,#d8d0c4); color:var(--ink-mute,#5c5963); text-align:center; }
.ob-buy{ width:100%; border:none; background:var(--ink,#1a1612); color:var(--ivory,#f7f3ea); padding:15px; cursor:pointer;
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; transition:background .15s; }
.ob-buy:hover{ background:#2a2018; }
.ob-mp{ display:flex; gap:10px; flex-wrap:wrap; }
.ob-mp button{ flex:1; min-width:80px; background:none; border:1px solid var(--rule,#d8d0c4); padding:11px 6px; cursor:pointer;
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink,#1a1612); transition:border-color .15s, color .15s; }
.ob-mp button:hover{ border-color:var(--note,#b65a2a); color:var(--note-deep,#8a3f17); }
.ob-spec{ display:flex; flex-direction:column; }
.ob-spec > div{ display:flex; justify-content:space-between; gap:14px; border-bottom:1px dashed var(--rule-soft); padding:8px 0; font-family:'Cormorant Garamond',serif; font-size:15px; color:var(--ink,#1a1612); align-items:baseline; }
.ob-spec .k{ font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-mute,#5c5963); white-space:nowrap; }

/* «Об авторе»: контент центрируется по вертикали единым блоком, с ровными отступами между кластерами */
.face .content.ob-fill, .page-half .content.ob-fill{ justify-content:center !important; gap:clamp(18px, 2.8vmin, 36px); padding-top:0 !important; padding-bottom:0 !important; }
.content.ob-fill > *{ flex:0 0 auto; }

/* ════ «О книге»: настоящая 3D-книга с реальной обложкой (крутибельная) ════ */
.book3d-stage{ width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; perspective:2200px; cursor:grab; touch-action:none; user-select:none; }
.book3d-stage:active{ cursor:grabbing; }
.book3d{ position:relative; width:340px; height:408px; transform-style:preserve-3d; will-change:transform; }
.book3d .bk-face{ position:absolute; overflow:hidden; }
.bk-front, .bk-back{ width:340px; height:408px; left:0; top:0; background-size:cover; background-position:center; }
.bk-front{ transform:translateZ(24px); border-radius:1px 4px 4px 1px;
  background-image:url(book-front.jpg?v=2);
  box-shadow:inset -16px 0 28px -12px rgba(0,0,0,.5), inset 2px 0 0 rgba(255,255,255,.07), 0 2px 6px rgba(0,0,0,.35); }
.bk-back{ transform:rotateY(180deg) translateZ(24px); border-radius:4px 1px 1px 4px;
  background-image:url(book-back.jpg?v=2);
  box-shadow:inset 16px 0 28px -12px rgba(0,0,0,.5); }
.bk-spine{ width:48px; height:408px; left:146px; top:0; transform:rotateY(-90deg) translateZ(170px);
  background:linear-gradient(90deg,#0a0a11,#1b1a25 50%,#0a0a11); display:flex; align-items:center; justify-content:center; box-shadow:inset 0 0 26px rgba(0,0,0,.55); }
.bk-spine span{ writing-mode:vertical-rl; transform:rotate(180deg); white-space:nowrap; font-family:'Cormorant Garamond',serif; font-size:16px; letter-spacing:.06em; color:#c8a96a; }
.bk-fore{ width:48px; height:408px; left:146px; top:0; transform:rotateY(90deg) translateZ(170px);
  background:repeating-linear-gradient(to bottom, #efe9da, #efe9da 1px, #d6cdb6 1px, #d6cdb6 2.5px); box-shadow:inset 0 0 18px rgba(0,0,0,.2); }
.bk-top{ width:340px; height:48px; left:0; top:180px; transform:rotateX(90deg) translateZ(204px);
  background:repeating-linear-gradient(to right, #efe9da, #efe9da 1px, #d6cdb6 1px, #d6cdb6 2.5px); }
.bk-bottom{ width:340px; height:48px; left:0; top:180px; transform:rotateX(-90deg) translateZ(204px);
  background:repeating-linear-gradient(to right, #efe9da, #efe9da 1px, #d6cdb6 1px, #d6cdb6 2.5px); }
.book3d-hint{ font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.22em; text-transform:uppercase; color:var(--ink-mute,#5c5963); opacity:.6; }

/* Тарифы: заблокированные карточки — блюр + плашка «Скоро откроем доступ» */
.t-inner{ display:flex; flex-direction:column; height:100%; }
.t-lock-veil{ position:absolute; inset:0; z-index:5; display:flex; align-items:center; justify-content:center; background:rgba(247,243,232,.22); }
.t-lock-pill{ font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink,#1a1612); background:rgba(251,250,246,.92); border:1px solid var(--rule,#d8d0c4); padding:11px 20px; box-shadow:1px 1px 0 rgba(26,22,18,.18); transform:rotate(-1.5deg); }

/* Онбординг: выбор роли */
.reg-roles{ display:flex; flex-direction:column; gap:8px; }
.reg-role{ text-align:left; width:100%; background:none; border:1px solid var(--rule,#d8d0c4); border-radius:0; padding:13px 16px; cursor:pointer; font-family:'Cormorant Garamond',serif; font-size:17px; color:var(--ink); transition:border-color .15s, background .15s; }
.reg-role:hover{ border-color:var(--note,#b65a2a); }
.reg-role.sel{ border-color:var(--note,#b65a2a); background:rgba(182,90,42,.08); color:var(--note-deep,#8a3f17); }