@charset "UTF-8";
/* RWD — the brochure flip book (flipbook.js). A full-window dialog in the
   footer's bark-and-gold: a bar with the title, page count, download and
   close; the book centred on the stage with a turn button either side. */

html.fb-on, html.fb-on body{ overflow:hidden }

.fb{
  position:fixed; inset:0; z-index:200;
  display:flex; flex-direction:column;
  background:#16110D; color:#E9E3D7;
  font-family:var(--lux-sans, 'Maven Pro', system-ui, sans-serif);
}
.fb[hidden]{ display:none }

.fb-bar{
  flex:none; display:flex; align-items:center; gap:18px 28px; flex-wrap:wrap;
  padding:14px clamp(16px,3vw,36px); border-bottom:1px solid rgba(203,174,128,.22);
}
.fb-title{ flex:1 1 260px; margin:0; font:600 clamp(18px,1.6vw,22px)/1.25 var(--lux, Lora, Georgia, serif); color:#fff }
.fb-count{ margin:0; font-size:16px; font-weight:500; color:#CBAE80; white-space:nowrap }
.fb-act{ display:flex; gap:10px }
.fb-act a, .fb-act button{
  display:inline-flex; align-items:center; padding:11px 18px; border-radius:999px; cursor:pointer;
  font:600 16px/1 var(--lux-sans, system-ui, sans-serif); letter-spacing:.04em; text-decoration:none;
  border:1px solid rgba(233,227,215,.4); background:transparent; color:#E9E3D7;
}
.fb-act a{ background:#B08D57; border-color:#B08D57; color:#100F0E }
.fb-act a:hover{ background:#CBAE80 }
.fb-act button:hover{ border-color:#CBAE80; color:#fff }

.fb-stage{
  position:relative; flex:1 1 auto; min-height:0;
  display:flex; align-items:center; justify-content:center; gap:clamp(10px,2vw,24px);
}
.fb-hold{ flex:none; display:flex; align-items:center; justify-content:center }
.fb-book{ box-shadow:0 30px 80px rgba(0,0,0,.45) }
.fb-page{ background:#fff; overflow:hidden; display:grid; place-items:center }
.fb-img{ display:block; width:100%; height:100%; object-fit:contain }

.fb-nav{
  flex:none; width:52px; height:52px; border-radius:50%; cursor:pointer;
  border:1px solid rgba(203,174,128,.5); background:rgba(43,33,26,.9); color:#E9E3D7;
  font:300 34px/1 Georgia, serif; padding-bottom:4px;
}
.fb-nav:hover:not(:disabled){ background:#B08D57; color:#100F0E; border-color:#B08D57 }
.fb-nav:disabled{ opacity:.25; cursor:default }

.fb button:focus-visible, .fb a:focus-visible{ outline:2px solid #CBAE80; outline-offset:2px }

.fb-load{
  position:absolute; inset:0; display:flex; flex-direction:column; gap:16px;
  align-items:center; justify-content:center; font-size:16px; color:#CBAE80; pointer-events:none;
}
.fb-load[hidden]{ display:none }
.fb-load i, .fb-spin{
  width:34px; height:34px; border-radius:50%;
  border:3px solid rgba(203,174,128,.25); border-top-color:#B08D57;
  animation:fb-spin .9s linear infinite;
}
.fb-spin{ border-color:rgba(176,141,87,.2); border-top-color:#B08D57 }
@keyframes fb-spin{ to{ transform:rotate(360deg) } }

.fb-err{ max-width:44ch; text-align:center; font-size:17px; line-height:1.6 }
.fb-err a{ color:#CBAE80 }

.fb-hint{ flex:none; margin:0; padding:10px 16px 16px; text-align:center; font-size:16px; color:rgba(233,227,215,.6) }

/* ---- Inline, on the project page ---------------------------------------
   The same bar and stage as a dark panel in the page; the stage's height is
   set by flipbook.js from the page shape, so it never letterboxes. */
.fb-inline{
  position:relative; display:flex; flex-direction:column;
  background:#16110D; color:#E9E3D7; border-radius:4px; overflow:hidden;
  font-family:var(--lux-sans, 'Maven Pro', system-ui, sans-serif);
}
.fb-inline .fb-stage{ flex:none; min-height:340px; outline:none }
.fb-inline .fb-stage:focus-visible{ box-shadow:inset 0 0 0 2px #CBAE80 }
.fb-inline .fb-title{ font-size:clamp(17px,1.4vw,20px) }
.fb-act button.fb-full::before{ content:'⤢'; margin-right:8px; font-size:16px }
.fb-tabs{ flex-basis:100%; display:flex; flex-wrap:wrap; gap:8px }
.fb-tabs button{
  padding:10px 16px; border-radius:999px; cursor:pointer;
  border:1px solid rgba(233,227,215,.3); background:transparent; color:#E9E3D7;
  font:600 16px/1 var(--lux-sans, system-ui, sans-serif);
}
.fb-tabs button[aria-selected="true"]{ background:#E9E3D7; color:#16110D; border-color:#E9E3D7 }
.fb-tabs button:hover{ border-color:#CBAE80 }
/* No script: no book to show, only the download row under it. */
html:not(.js) .fb-inline{ display:none }

/* A phone: the turn buttons float over the page edges, the hint goes. */
@media (max-width:759px){
  .fb-bar{ gap:10px 14px; padding:12px 16px }
  .fb-title{ flex-basis:100%; font-size:17px }
  .fb-count{ flex:1 }
  .fb-act a, .fb-act button{ padding:10px 14px; font-size:16px }
  .fb-nav{ position:absolute; top:50%; transform:translateY(-50%); z-index:2; width:44px; height:44px; font-size:28px }
  .fb-nav.prev{ left:6px } .fb-nav.next{ right:6px }
  .fb-hint{ display:none }
  .fb-tilt .fb-hint{ display:block; font-size:16px; color:#CBAE80 }
  .fb-inline .fb-stage{ min-height:0 }
}
@media (prefers-reduced-motion:reduce){ .fb-load i, .fb-spin{ animation-duration:3s } }