/* Haute Lumière reader: the issue as images, turned like a magazine. Works the same on every phone and computer. */
.hlr{position:relative;width:100%;max-width:1240px;margin:0 auto;user-select:none;-webkit-user-select:none}
.hlr-stage{position:relative;display:flex;justify-content:center;align-items:center;gap:0;padding:18px;background:#fff;
  box-shadow:0 60px 90px -40px rgba(34,32,27,.5),0 0 0 1px rgba(0,0,0,.05);touch-action:pan-y;overflow:hidden}
.hlr-spread{display:flex;justify-content:center;align-items:stretch;transition:opacity .45s cubic-bezier(.165,.84,.44,1),transform .45s cubic-bezier(.165,.84,.44,1)}
.hlr-spread.out-l{opacity:0;transform:translateX(-36px)}
.hlr-spread.out-r{opacity:0;transform:translateX(36px)}
.hlr-page{position:relative;background:#F7F2E8;aspect-ratio:1360/1760;height:min(78vh,880px);max-width:100%}
.hlr-page img{display:block;width:100%;height:100%;object-fit:contain}
.hlr-spread.two .hlr-page:first-child{box-shadow:inset -18px 0 24px -18px rgba(0,0,0,.18)}
.hlr-spread.two .hlr-page:last-child{box-shadow:inset 18px 0 24px -18px rgba(0,0,0,.18)}
.hlr-nav{position:absolute;top:0;bottom:0;width:22%;border:0;background:transparent;cursor:pointer;z-index:2;display:flex;align-items:center;padding:0 2vw}
.hlr-nav.prev{left:0;justify-content:flex-start}.hlr-nav.next{right:0;justify-content:flex-end}
.hlr-nav span{width:52px;height:52px;border-radius:50%;background:rgba(250,248,243,.92);box-shadow:0 10px 24px -10px rgba(0,0,0,.35);
  display:flex;align-items:center;justify-content:center;font:300 26px/1 "Cormorant Garamond",serif;color:#22201B;opacity:0;transition:opacity .4s}
.hlr:hover .hlr-nav span,.hlr-nav:focus-visible span{opacity:1}
.hlr-nav[disabled]{cursor:default}.hlr-nav[disabled] span{opacity:0!important}
.hlr-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px 4px 0;
  font-family:Manrope,system-ui,sans-serif;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;color:#5E574C}
.hlr-bar button,.hlr-bar a{font:inherit;letter-spacing:inherit;text-transform:inherit;color:#22201B;background:none;border:0;border-bottom:1px solid #C7A468;padding:0 0 4px;cursor:pointer;text-decoration:none}
.hlr-count{font-variant-numeric:tabular-nums}
.hlr-thumbs{display:flex;gap:8px;overflow-x:auto;padding:16px 4px 4px;scrollbar-width:thin;scrollbar-color:#C7A468 transparent}
.hlr-thumbs button{flex:0 0 auto;width:46px;aspect-ratio:1360/1760;padding:0;border:1px solid transparent;background:#F7F2E8;cursor:pointer;opacity:.55;transition:opacity .3s,border-color .3s}
.hlr-thumbs button img{width:100%;height:100%;object-fit:cover;display:block}
.hlr-thumbs button.on{opacity:1;border-color:#C7A468}
.hlr:fullscreen{max-width:none;background:#FAF8F3;display:flex;flex-direction:column;justify-content:center;padding:2vh 2vw}
.hlr:fullscreen .hlr-page{height:min(84vh,1400px)}
@media (max-width:760px){
  .hlr-stage{padding:8px}
  .hlr-page{height:auto;width:100%}
  .hlr-nav span{opacity:.9;width:40px;height:40px;font-size:22px}
}
@media (prefers-reduced-motion:reduce){.hlr-spread{transition:none}}