/* Libro interactivo del brochure (assets/js/flipbook.js) */
.brochure-stage{position:relative;padding-block:clamp(2.5rem,6vw,4.5rem);background:radial-gradient(ellipse at 50% 40%,#4a2e21 0%,#2a1a14 55%,#1a100b 100%);overflow:hidden}
.brochure-stage::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 15%,rgba(232,137,43,.18),transparent 40%),radial-gradient(circle at 85% 80%,rgba(63,143,58,.16),transparent 45%);pointer-events:none}
.brochure-stage .wrap{position:relative}

.flipbook{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:1.4rem;color:#f3e8da}
/* min-width:0 evita que el libro ensanche su contenedor: el ancho disponible manda */
.fb-viewport{position:relative;min-width:0;width:100%;display:flex;align-items:center;justify-content:center;perspective:2600px;perspective-origin:50% 40%;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.fb-book{position:relative;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.645,.045,.355,1)}
/* Lomo: sombra al centro cuando el libro está abierto */
.fb-book::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:60px;transform:translateX(-50%) translateZ(1px);background:linear-gradient(90deg,transparent,rgba(0,0,0,.28) 45%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.28) 55%,transparent);pointer-events:none;opacity:1;transition:opacity .5s;z-index:999}
.flipbook.is-closed .fb-book::after,.flipbook.is-single .fb-book::after{opacity:0}

.fb-leaf{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.645,.045,.355,1);will-change:transform;--shade:0}
.flipbook.is-single .fb-leaf{left:0;width:100%}
/* Una página por vez: la hoja que se voltea sale hacia la izquierda y se oculta */
.flipbook.is-single .fb-viewport{overflow:hidden}
.fb-leaf.flipped{transform:rotateY(-180deg)}
.fb-leaf.dragging{transition:none}
/* El levantamiento de esquina sólo aplica a hojas quietas: nunca debe frenar un giro */
.fb-leaf.peek-next:not(.flipped):not(.turning){transform:rotateY(-14deg)}
.fb-leaf.flipped.peek-prev:not(.turning){transform:rotateY(-166deg)}

.fb-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;background:#f7f1e8;box-shadow:0 22px 50px -18px rgba(0,0,0,.65)}
.fb-face img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.fb-back{transform:rotateY(180deg)}
.fb-front{border-radius:2px 6px 6px 2px}
.fb-back{border-radius:6px 2px 2px 6px}
.fb-blank{background:linear-gradient(135deg,#efe5d6,#e4d8c7)}
/* Luz y sombra: degradado fijo junto al lomo y sombra que se mueve al girar */
.fb-face::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1}
.fb-front::before{background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(0,0,0,0) 7%)}
.fb-back::before{background:linear-gradient(270deg,rgba(0,0,0,.18),rgba(0,0,0,0) 7%)}
.fb-face::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:2;opacity:var(--shade);background:linear-gradient(90deg,rgba(0,0,0,.55),rgba(0,0,0,.15) 60%,rgba(255,255,255,.12))}
.fb-leaf.turning .fb-face::after{animation:fb-shade .9s cubic-bezier(.645,.045,.355,1)}
@keyframes fb-shade{0%{opacity:0}50%{opacity:.5}100%{opacity:0}}

/* Zonas de clic (también accesibles con teclado) */
.fb-zone{position:absolute;top:0;bottom:0;width:50%;background:none;border:0;cursor:pointer;z-index:1000;padding:0}
.fb-prev{left:0;cursor:w-resize}
.fb-next{right:0;cursor:e-resize}
.fb-zone:focus-visible{outline:2px solid #f4b56b;outline-offset:-6px;border-radius:12px}
.fb-zone .fb-hint{position:absolute;top:50%;width:46px;height:46px;margin-top:-23px;border-radius:50%;display:grid;place-items:center;background:rgba(20,12,8,.55);color:#fff;font-size:1.2rem;opacity:0;transition:opacity .3s,transform .3s;backdrop-filter:blur(6px)}
.fb-prev .fb-hint{left:6px}
.fb-next .fb-hint{right:6px}
.fb-zone:hover .fb-hint,.fb-zone:focus-visible .fb-hint{opacity:1}
.fb-next:hover .fb-hint{transform:translateX(3px)}
.fb-prev:hover .fb-hint{transform:translateX(-3px)}

/* Barra de controles */
.fb-bar{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}
.fb-bar button,.fb-bar a{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;height:44px;min-width:44px;padding:0 .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.06);color:#fff;font:700 .85rem var(--sans);cursor:pointer;transition:background .25s,border-color .25s,opacity .25s;text-decoration:none}
.fb-bar button:hover:not(:disabled),.fb-bar a:hover{background:#fff;color:var(--cacao-800);border-color:#fff}
.fb-bar button:disabled{opacity:.35;cursor:default}
.fb-bar .fb-download{background:var(--mango);border-color:var(--mango)}
.fb-bar .fb-download:hover{background:var(--mango-dark);border-color:var(--mango-dark);color:#fff}
.fb-count{min-width:170px;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;color:#f4b56b;font-size:.9rem}

/* Miniaturas */
.fb-thumbs{display:flex;gap:.6rem;overflow-x:auto;padding:.4rem .2rem .8rem;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:rgba(244,181,107,.5) transparent;justify-content:safe center}
.fb-thumb{flex:none;width:96px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:none;cursor:pointer;opacity:.6;transition:opacity .25s,border-color .25s,transform .25s;scroll-snap-align:center}
.fb-thumb img{width:100%;aspect-ratio:var(--ratio);object-fit:cover;display:block}
.fb-thumb span{display:block;font-size:.7rem;font-weight:700;color:#cbb7a2;padding:.2rem 0;text-align:center;background:rgba(0,0,0,.25)}
.fb-thumb:hover{opacity:1;transform:translateY(-2px)}
.fb-thumb.is-active{opacity:1;border-color:var(--mango)}

/* Pantalla completa */
.flipbook.is-full{background:radial-gradient(ellipse at 50% 40%,#4a2e21,#140c08);padding:2rem 16px;align-content:center;min-height:100vh}

.fb-help{text-align:center;font-size:.82rem;color:#cbb7a2}

@media (max-width:760px){
  .fb-count{min-width:0;flex-basis:100%;order:-1}
  .fb-bar [data-act="first"],.fb-bar [data-act="last"]{display:none}
  .fb-thumb{width:76px}
  .fb-zone .fb-hint{opacity:.85}
}
@media (prefers-reduced-motion:reduce){
  .fb-book,.fb-leaf{transition:none}
  .fb-leaf.turning .fb-face::after{animation:none}
}