@font-face{font-family:"Great Vibes";src:url(/assets/personalize/GreatVibes-Regular.ttf) format("truetype");font-display:block}
.testbanner{background:#fff3c4;color:#6b4e00;text-align:center;font:600 14px/1.4 system-ui,sans-serif;padding:8px}
.pz{align-items:start!important}
.pz-preview canvas{width:100%;height:auto;border-radius:6px;box-shadow:0 18px 40px rgba(60,40,90,.28);background:#fff}
#pzform label{display:block;font:600 15px system-ui,sans-serif;color:var(--navy);margin-bottom:6px}
#pzform input{width:100%;max-width:380px;font:22px Georgia,serif;padding:12px 16px;border:2px solid #d6cbe4;border-radius:10px;background:#fff}
#pzform input:focus{outline:none;border-color:var(--purple)}
.err{color:var(--red-d);min-height:1.4em;font:14px system-ui,sans-serif;margin:6px 0}
.price{font-size:28px;color:var(--navy);margin:4px 0 18px}.price span{font-size:16px;color:var(--ink)}
.btn[disabled]{opacity:.55;cursor:wait}button.btn{border:0;cursor:pointer}
.small{font-size:14px;margin-top:18px}
/* --- book page-turn preview --- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.book{position:relative;aspect-ratio:1275/1650;perspective:2600px;border-radius:6px;box-shadow:0 18px 40px rgba(60,40,90,.28)}
.book canvas{position:absolute;inset:0;width:100%;height:100%;border-radius:6px;box-shadow:none!important}
.cover{position:absolute;inset:0;transform-origin:left center;transform-style:preserve-3d;transform:rotateY(calc(var(--p,0) * -180deg));
 transition:transform 2.5s cubic-bezier(.45,0,.55,1);z-index:2}
.book.instant .cover{transition:none}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:6px;overflow:hidden}
.face img{width:100%;height:100%;object-fit:cover}
.face.front::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.18),transparent 6%,transparent 70%,rgba(0,0,0,calc(var(--p,0)*.5)))}
.face.back{transform:rotateY(180deg);background:linear-gradient(270deg,#e8dfcf,#fbf6ec 30%)}
.book[data-state="open"] .cover{pointer-events:none}
.bookctl{text-align:center;margin:14px 0 4px}
.flipbtn{font:600 15px system-ui,sans-serif;color:var(--purple);background:#fff;border:2px solid #d6cbe4;border-radius:30px;padding:9px 20px;cursor:pointer}
.flipbtn:hover{border-color:var(--purple)}.flipbtn:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
@media (prefers-reduced-motion: reduce){
 .cover{transform:none!important;transition:opacity .3s linear;opacity:calc(1 - var(--p,0))}
 .face.back{display:none}
}
.hero{overflow:hidden} /* opened cover swings left of the page */

/* --- Look Inside (personalized) --- */
.lookinside{padding:48px 0 56px;background:#fff}
.lookinside h2{text-align:center;font-size:34px;margin:0 0 10px;color:var(--navy);font-weight:normal}
.lookinside-lead{text-align:center;max-width:520px;margin:0 auto 28px;color:#6a6258;font-size:16px}
.lookinside .strip{
  display:-ms-grid;display:grid;
  -ms-grid-columns:1fr 1fr 1fr 1fr;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;max-width:920px;margin:0 auto;justify-items:center;
}
.lookinside .strip-item{
  -webkit-appearance:none;appearance:none;border:0;padding:0;margin:0;
  background:transparent;cursor:zoom-in;border-radius:6px;display:block;
  width:100%;max-width:210px;position:relative;z-index:1;
}
.lookinside .page-frame,.lightbox .page-frame{
  position:relative;display:block;width:100%;border-radius:6px;
  box-shadow:0 6px 18px rgba(0,0,0,.12);background:#f7f2ea;
  /* No forced crop: frame height follows the full 930x1200 image. */
  overflow:visible;
}
.lookinside .page-frame img,.lightbox .page-frame img{
  display:block;width:100%;height:auto;object-fit:contain;object-position:top center;
  border:0;pointer-events:none;vertical-align:top;
}
.lookinside .page-captions,.lightbox .page-captions{
  position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;
}
.page-caption-line{
  position:absolute;transform:translate(-50%,-92%);
  font-family:"DejaVu Serif","Times New Roman",serif;font-style:italic;font-weight:400;
  white-space:nowrap;line-height:1;text-align:center;pointer-events:none;
}
/* Scale caption font with frame width (spec is for 930px art). */
.lookinside .strip-item:focus-visible{outline:3px solid var(--purple);outline-offset:3px}
html.li-open,html.li-open body{overflow:hidden;touch-action:none}
.lightbox{
  position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;
  background:rgba(15,18,24,.88);display:-webkit-flex;display:flex;
  -webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;
  padding:24px;box-sizing:border-box;
}
.lightbox[hidden]{display:none!important}
.lightbox .lightbox-frame{
  width:min(90vw,720px);max-width:90vw;max-height:90vh;
  box-shadow:0 12px 40px rgba(0,0,0,.45);background:#111;
  overflow:hidden;border-radius:4px;
}
.lightbox .lightbox-frame img{
  width:100%;height:auto;max-height:90vh;object-fit:contain;object-position:top center;
}
.lightbox-close{position:absolute;top:14px;right:18px;width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font:400 32px/1 system-ui,sans-serif;cursor:pointer;z-index:2}
.lightbox-close:hover,.lightbox-nav:hover{background:rgba(255,255,255,.22)}
.lightbox-nav{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font:400 36px/1 Georgia,serif;cursor:pointer;z-index:2}
.lightbox-prev{left:12px}.lightbox-next{right:12px}
@media(max-width:760px){
 .lookinside .strip{-ms-grid-columns:1fr 1fr;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:460px}
 .lookinside .strip-item{max-width:210px}
 .lookinside{padding:36px 0 44px}
 .lightbox{padding:12px}
 .lightbox-nav{width:40px;height:40px;font-size:28px}
 .lightbox-prev{left:4px}.lightbox-next{right:4px}
}
