/* book3d — Atma School 3D-книга (Grok Bot, 24.10.2026). Без библиотек. */
.book3d{--w:270px;--h:360px;--t:34px;--spine:#3a2a5c;--spine2:#241a3a;--gl:0;position:relative;display:flex;flex-direction:column;align-items:center;gap:22px;padding:30px 0 10px;user-select:none;-webkit-user-select:none;font-family:Montserrat,system-ui,sans-serif}
.b3d-scene{position:relative;width:calc(var(--w) * 1.5);max-width:100%;height:calc(var(--h) + 70px);display:flex;align-items:center;justify-content:center;perspective:1400px;perspective-origin:50% 40%;touch-action:pan-y;cursor:grab}
.b3d-scene.drag{cursor:grabbing}
.b3d-float{transform-style:preserve-3d;will-change:transform}
.b3d-book{position:relative;width:var(--w);height:var(--h);transform-style:preserve-3d;will-change:transform}
.b3d-face{position:absolute;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.b3d-front,.b3d-back{left:0;top:0;width:var(--w);height:var(--h);border-radius:2px 5px 5px 2px;overflow:hidden}
.b3d-front{transform:translateZ(calc(var(--t) / 2));background:#222}
.b3d-front img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
/* петля переплёта и блик */
.b3d-front::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.38) 0,rgba(255,255,255,.18) 1.6%,rgba(0,0,0,.22) 3.2%,rgba(255,255,255,.06) 5%,transparent 8%);pointer-events:none}
.b3d-front::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent calc(30% + var(--gl) * 40%),rgba(255,255,255,.22) calc(38% + var(--gl) * 40%),transparent calc(48% + var(--gl) * 40%));mix-blend-mode:screen}
.b3d-back{transform:rotateY(180deg) translateZ(calc(var(--t) / 2));background:linear-gradient(90deg,var(--spine2),var(--spine) 60%,var(--spine2));box-shadow:inset 0 0 40px rgba(0,0,0,.35)}
.b3d-back::after{content:"Atma School";position:absolute;left:0;right:0;bottom:9%;text-align:center;color:rgba(255,255,255,.55);font:600 11px/1 Montserrat,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.b3d-spine{top:0;left:calc((var(--w) - var(--t)) / 2);width:var(--t);height:var(--h);transform:rotateY(-90deg) translateZ(calc(var(--w) / 2));background:linear-gradient(90deg,var(--spine2) 0,var(--spine) 18%,var(--spine) 82%,var(--spine2) 100%);display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:3px}
.b3d-spine::before,.b3d-spine::after{content:"";position:absolute;left:12%;right:12%;height:1px;background:rgba(214,178,94,.75)}
.b3d-spine::before{top:7%}.b3d-spine::after{bottom:7%}
.b3d-spine span{writing-mode:vertical-rl;transform:rotate(180deg);color:#f4e2b4;font:600 calc(var(--t) * .4)/1 "Cormorant Garamond",Georgia,serif;letter-spacing:.06em;white-space:nowrap;max-height:84%;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 1px rgba(0,0,0,.4)}
.b3d-edge{background-color:#f3eee2;background-image:repeating-linear-gradient(90deg,rgba(120,100,70,.0) 0,rgba(120,100,70,.18) 1px,rgba(255,255,255,0) 2px,rgba(255,255,255,0) 3px),linear-gradient(90deg,#e7dfcc,#faf6ec 40%,#e9e1cf)}
.b3d-edge-r{top:4px;left:calc((var(--w) - var(--t)) / 2 + 2px);width:calc(var(--t) - 4px);height:calc(var(--h) - 8px);transform:rotateY(90deg) translateZ(calc(var(--w) / 2 - 4px))}
.b3d-edge-t,.b3d-edge-b{left:2px;width:calc(var(--w) - 8px);height:calc(var(--t) - 4px);top:calc((var(--h) - var(--t)) / 2 + 2px);background-image:repeating-linear-gradient(0deg,rgba(120,100,70,0) 0,rgba(120,100,70,.18) 1px,rgba(255,255,255,0) 2px,rgba(255,255,255,0) 3px),linear-gradient(0deg,#e7dfcc,#faf6ec 40%,#e9e1cf)}
.b3d-edge-t{transform:rotateX(90deg) translateZ(calc(var(--h) / 2 - 4px))}
.b3d-edge-b{transform:rotateX(-90deg) translateZ(calc(var(--h) / 2 - 4px))}
.b3d-shadow{position:absolute;left:50%;bottom:6px;width:calc(var(--w) * .95);height:26px;margin-left:calc(var(--w) * -.475);border-radius:50%;background:radial-gradient(closest-side,rgba(30,20,50,.38),rgba(30,20,50,.12) 60%,transparent);filter:blur(4px);pointer-events:none;will-change:transform,opacity}
.b3d-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.b3d-btn{font:600 14px Montserrat,sans-serif;display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 20px;border:1px solid #2b1d5c;background:#2b1d5c;color:#fff;cursor:pointer;text-decoration:none;border-radius:0;transition:background .2s,transform .2s}
.b3d-btn:hover{background:#3d2a7a}
.b3d-btn:focus-visible{outline:2px solid #b8893a;outline-offset:2px}
.b3d-hint{font-size:12px;color:#6b6880;margin-top:-10px}
/* ===== открытая книга ===== */
.b3d-ov{position:fixed;inset:0;z-index:1000;background:rgba(20,14,36,.82);display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .35s;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);font-family:Montserrat,system-ui,sans-serif}
.b3d-ov.on{opacity:1}
.b3d-ov-stage{position:relative;width:100%;flex:1;display:flex;align-items:center;justify-content:center;perspective:2200px;overflow:hidden;touch-action:pan-y}
.b3d-ob{--pw:400px;--ph:400px;position:relative;width:calc(var(--pw) * 2);height:var(--ph);transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,.1,.2,1);transform:translateX(calc(var(--pw) * -.5)) rotateX(6deg)}
.b3d-ob.open{transform:translateX(0) rotateX(6deg)}
.b3d-ob.single{width:var(--pw);transform:translateX(0) rotateX(4deg)}
.b3d-board{position:absolute;top:-8px;height:calc(var(--ph) + 16px);width:calc(var(--pw) + 8px);background:linear-gradient(90deg,var(--spine2),var(--spine));box-shadow:0 30px 60px rgba(0,0,0,.45);transform:translateZ(-2px);border-radius:4px}
.b3d-board.l{left:-8px;border-radius:4px 0 0 4px;opacity:0;transition:opacity .3s .4s}
.b3d-ob.open .b3d-board.l{opacity:1}
.b3d-board.r{left:var(--pw);border-radius:0 4px 4px 0}
.b3d-ob.single .b3d-board.r{left:0}
.b3d-ob.single .b3d-board.l{display:none}
.b3d-leaf{position:absolute;top:0;left:var(--pw);width:var(--pw);height:var(--ph);transform-origin:0 50%;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.45,.05,.25,1)}
.b3d-ob.single .b3d-leaf{left:0}
.b3d-leaf.flip{}
.b3d-pg{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fffdf8;overflow:hidden}
.b3d-pg.bk{transform:rotateY(180deg)}
.b3d-pg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(60,40,20,.16),rgba(60,40,20,0) 9%,rgba(60,40,20,0) 94%,rgba(60,40,20,.06))}
.b3d-pg.bk::after{background:linear-gradient(270deg,rgba(60,40,20,.16),rgba(60,40,20,0) 9%,rgba(60,40,20,0) 94%,rgba(60,40,20,.06))}
.b3d-pg .sh{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.25),rgba(0,0,0,0));opacity:0;transition:opacity .45s}
.b3d-leaf.moving .b3d-pg .sh{opacity:1}
.b3d-pg.cov img{width:100%;height:100%;object-fit:cover;display:block}
.b3d-pg.endp{background:var(--spine);background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.5px);background-size:9px 9px}
.b3d-pi{position:absolute;left:9%;right:8%;top:8%;bottom:10%;font:400 var(--pf,13px)/1.6 Lora,Georgia,serif;color:#2a2a33;overflow:hidden}
.b3d-pi h1{font:600 2.1em/1.2 "Cormorant Garamond",Georgia,serif;color:#2b1d5c;margin:0 0 .4em}
.b3d-pi h2{font:600 1.6em/1.25 "Cormorant Garamond",Georgia,serif;color:#2b1d5c;margin:0 0 .6em}
.b3d-pi h3{font:600 1.4em/1.3 "Cormorant Garamond",Georgia,serif;color:#2b1d5c;margin:.2em 0 .5em}
.b3d-pi p{margin:0 0 .5em;text-align:justify;hyphens:auto;-webkit-hyphens:auto}
.b3d-pi p.c{text-indent:0}
.b3d-pi figure{margin:.2em auto .7em;text-align:center}
.b3d-pi figure{position:relative;display:table;padding:14px;background:#fbf5e6 radial-gradient(ellipse at center,#fdf9ef 0%,#f6edd8 100%);border:1px solid #b8893a;box-shadow:0 5px 14px rgba(80,55,20,.13)}
.b3d-pi figure:before{content:"";position:absolute;inset:3px;border:1px solid rgba(184,137,58,.75);pointer-events:none}
.b3d-pi figure:after{content:"✦";position:absolute;right:2px;bottom:-1px;font-size:9px;color:#b8893a;line-height:1}
.b3d-pi figure img{display:block;margin:0 auto;max-width:100%;max-height:calc(var(--ph) * .42);width:auto;height:auto;background:#fff;box-shadow:0 0 0 1px rgba(184,137,58,.55)}
.b3d-pi ol,.b3d-pi ul{margin:0 0 .5em;padding-left:1.2em}
.b3d-pi li{margin:.15em 0}
.b3d-pi .lock{color:#a9a6b5}
.b3d-pi .ttl{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.b3d-pi .ttl .orn{width:46px;height:1px;background:#b8893a;margin:14px auto}
.b3d-pi .ttl small{font:600 .75em Montserrat,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:#b8893a}
.b3d-pi .ttl img.lg{height:22px;width:auto;margin-top:26px;opacity:.85}
.b3d-pn{position:absolute;bottom:4%;left:0;right:0;text-align:center;font:500 10px Montserrat,sans-serif;color:#9b97a8}
.b3d-rh{position:absolute;top:3.2%;left:0;right:0;text-align:center;font:600 8.5px Montserrat,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#b8a77e}
.b3d-pi .cta{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;gap:14px}
.b3d-pi .cta a{font:600 13px Montserrat,sans-serif;background:#2b1d5c;color:#fff;text-decoration:none;padding:11px 18px}
.b3d-ctl{display:flex;align-items:center;gap:14px;padding:14px 0 calc(16px + env(safe-area-inset-bottom));color:#fff}
.b3d-ctl button,.b3d-x{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.08);color:#fff;font:400 22px/1 Montserrat,sans-serif;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.b3d-ctl button:hover,.b3d-x:hover{background:rgba(255,255,255,.2)}
.b3d-ctl button[disabled]{opacity:.3;cursor:default}
.b3d-ctl .cnt{font:500 13px Montserrat,sans-serif;min-width:70px;text-align:center;opacity:.85}
.b3d-x{position:absolute;top:calc(12px + env(safe-area-inset-top));right:14px;z-index:5;font-size:20px}
.b3d-meas{position:absolute;left:-99999px;top:0;visibility:hidden}
@media (prefers-reduced-motion:reduce){
 .b3d-ob,.b3d-leaf{transition-duration:.01s!important}
 .b3d-ov{transition:none}
}
/* шрифты книги — перекрывают общий скин сайта (html[data-atma] … !important) */
html .b3d-pi,html .b3d-pi p,html .b3d-pi li,html .b3d-pi div,html .b3d-pi span,html .b3d-pi em,
html[data-atma] .b3d-pi,html[data-atma] .b3d-pi p,html[data-atma] .b3d-pi li,html[data-atma] .b3d-pi div,html[data-atma] .b3d-pi span{font-family:Lora,Georgia,serif!important}
html .b3d-pi h1,html .b3d-pi h2,html .b3d-pi h3,html .b3d-spine span,html .b3d-rh,
html[data-atma] .b3d-pi h1,html[data-atma] .b3d-pi h2,html[data-atma] .b3d-pi h3,html[data-atma] .b3d-spine span,html[data-atma] .b3d-rh{font-family:"Cormorant Garamond",Georgia,serif!important}
html[data-atma] .b3d-pi .ttl small,html .b3d-pi .ttl small,html[data-atma] .b3d-pi .cta a{font-family:Lora,Georgia,serif!important}
.b3d-pi p{hyphens:auto;-webkit-hyphens:auto}
