.perret-flipbook{
grid-column:1/-1;
margin:5rem calc(50% - 50vw) 0;
padding:5rem max(6%,calc((100vw - 1250px)/2 + 6%));
border-top:1px solid var(--line);
border-bottom:1px solid var(--line);
background:#e9e4df}
.perret-flipbook-heading{
display:flex;
align-items:end;
justify-content:space-between;
gap:2rem;
margin-bottom:2rem}
.perret-flipbook-heading h2{
font:400 clamp(2.8rem,5vw,5rem)/.95 Georgia,serif;
margin:0}
.perret-flipbook-stage{
display:grid;
grid-auto-flow:column;
grid-auto-columns:100%;
gap:1rem;
overflow-x:auto;
scroll-snap-type:x mandatory;
scrollbar-width:none}
.perret-flipbook-stage::-webkit-scrollbar{
display:none}
.perret-flipbook-spread{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:1rem;
scroll-snap-align:start;
min-width:0}
.perret-flipbook-spread.is-single{
display:flex;
justify-content:center}
.perret-flipbook-spread.is-single .perret-flipbook-page{
width:calc(50% - .5rem)}
.perret-flipbook-page{
margin:0;
background:#fff;
display:flex;
align-items:center;
justify-content:center;
min-height:420px}
.perret-flipbook-page.is-blank{
background:transparent;
box-shadow:none}
.perret-flipbook-page img{
display:block;
max-width:100%;
width:auto;
height:auto;
max-height:72vh;
object-fit:contain;
box-shadow:0 12px 25px rgba(27,31,43,.14);
user-select:none}
.perret-flipbook-controls{
display:flex;
align-items:center;
justify-content:center;
gap:1rem;
margin-top:1.5rem}
.perret-flipbook-controls button{
border:1px solid var(--ink);
border-radius:999px;
background:transparent;
color:var(--ink);
padding:.65rem 1rem;
cursor:pointer}
.perret-flipbook-controls button:hover,.perret-flipbook-controls button:focus-visible{
background:var(--ink);
color:#fff}
.perret-flipbook-controls span{
min-width:7rem;
text-align:center;
font-size:.78rem}
@media(max-width:760px){
.perret-flipbook{
padding:4rem 1.25rem}
.perret-flipbook-heading{
display:block}
.perret-flipbook-spread,.perret-flipbook-spread.is-single{
display:contents}
.perret-flipbook-page,.perret-flipbook-spread.is-single .perret-flipbook-page{
width:auto;
min-height:320px;
scroll-snap-align:start}
.perret-flipbook-page.is-blank{
display:none}
}


.single-product .woocommerce-product-gallery .perret-flipbook-trigger{
display:flex;
align-items:center;
justify-content:center;
margin:1.5rem auto 0;
padding:.78rem 1.2rem;
border:1px solid var(--ink);
border-radius:999px;
background:var(--ink);
color:#fff;
font:700 .72rem/1 Arial,sans-serif;
letter-spacing:.08em;
text-transform:uppercase;
cursor:pointer;
transition:background-color .18s ease,color .18s ease}
.single-product .woocommerce-product-gallery .perret-flipbook-trigger:hover,.single-product .woocommerce-product-gallery .perret-flipbook-trigger:focus-visible{
background:transparent;
color:var(--ink)}
.perret-flipbook-dialog{
width:min(1400px,96vw);
max-width:none;
height:min(94vh,1000px);
max-height:none;
padding:0;
border:0;
background:#e9e4df;
color:var(--ink);
box-shadow:0 24px 80px rgba(20,22,29,.4)}
.perret-flipbook-dialog::backdrop{
background:rgba(27,31,43,.76)}
.perret-flipbook-dialog-inner{
position:relative;
height:100%;
overflow:auto}
.perret-flipbook-dialog .perret-flipbook{
display:block!important;
margin:0!important;
padding:4.5rem clamp(1.25rem,5vw,5rem) 3rem!important;
border:0!important;
min-height:100%;
box-sizing:border-box}
.perret-flipbook-close{
position:sticky;
z-index:5;
top:1rem;
float:right;
margin:1rem 1rem -4rem 0;
border:1px solid var(--ink);
border-radius:999px;
background:#e9e4df;
color:var(--ink);
padding:.65rem 1rem;
cursor:pointer}
.perret-flipbook-close:hover,.perret-flipbook-close:focus-visible{
background:var(--ink);
color:#fff}
@media(max-width:760px){
.perret-flipbook-dialog{
width:100vw;
height:100vh;
max-height:none}
.perret-flipbook-dialog .perret-flipbook{
padding-top:4.5rem!important}
.perret-flipbook-close{
top:.6rem;
margin:.6rem .6rem -3.5rem 0}
}


.perret-flipbook-dialog .perret-flipbook-heading>.eyebrow{
display:none!important}
.perret-flipbook-dialog .perret-flipbook-close{
position:sticky!important;
top:1rem!important;
left:1rem!important;
right:auto!important;
float:left!important;
margin:1rem 0 -4rem 1rem!important}
.perret-flipbook-dialog .perret-flipbook-heading{
justify-content:flex-end!important}
@media(max-width:760px){
.perret-flipbook-dialog .perret-flipbook-close{
top:.6rem!important;
left:.6rem!important;
margin:.6rem 0 -3.5rem .6rem!important}
}