.rehan-flipbook { font-family: Inter, Arial, sans-serif; margin: 1rem 0; position: relative; }
.rehan-flipbook .rehan-controls { display:flex; gap:10px; align-items:center; margin-bottom:10px; }
.rehan-flipbook .rehan-pages { position: relative; perspective: 1800px; min-height: 380px; overflow: visible; }
.rehan-flipbook .rehan-page { width: 100%; box-sizing: border-box; position: absolute; top: 0; left: 0; right: 0; bottom: 0; padding: 20px; transition: transform 0.7s cubic-bezier(.2,.8,.2,1), opacity .4s; transform-origin: left center; backface-visibility: hidden; border-radius: 12px; }
.rehan-flipbook .rehan-page.active { z-index: 50; opacity: 1; pointer-events: auto; transform: rotateY(0deg) translateZ(0); }
.rehan-flipbook .rehan-page:not(.active) { opacity: 0; pointer-events: none; transform: rotateY(-20deg) translateZ(-100px); }

.rehan-flipbook .rehan-page.flipping-forward { transform: rotateY(-180deg); opacity: 0; z-index: 10; }
.rehan-flipbook .rehan-page.flipping-backward { transform: rotateY(0deg); opacity: 1; }

.rehan-flipbook .rehan-controls button { padding:6px 10px; border:1px solid #ccc; background:#fff; border-radius:4px; cursor:pointer; }
.rehan-flipbook .rehan-page-title { font-size: 1.2em; margin-bottom:10px; }
.rehan-featured img { max-width:100%; height:auto; display:block; margin-bottom:10px; }

/* Utility classes from design */
.color-beige { background-color: #f3f0e7; }
.color-dark-brown { color: #5a4b41; }
.bg-dark-brown { background-color: #5a4b41; }
.color-accent-brown { background-color: #ceb8a3; }

.paper-shadow { box-shadow: 0 6px 18px rgba(0,0,0,0.08); }

/* Responsive */
@media (max-width: 800px) {
	.rehan-flipbook .rehan-pages { min-height: 260px; }
	.rehan-flipbook .rehan-page { padding: 12px; font-size: 14px; border-radius: 10px; }
}
