/* Load after the website's current styles. Paths are relative to this CSS file. */
.heroimg{background-image:url("assets/hero-background-desktop.webp");background-position:center;background-size:cover}
.coverart{background-image:url("assets/cover-front.webp");background-position:center;background-size:cover}
.kanga{height:34px;background-image:url("assets/section-divider.svg");background-size:min(100%,1100px) 34px;background-repeat:no-repeat;background-position:center}
.hero{padding-top:58px;padding-bottom:92px}
.hero .wrap{gap:40px}
.bookfloat{animation:none}
.bookimg{filter:none}
.portrait,.portrait img{height:auto}
.portrait img{object-fit:contain;border:0}
.shot-wide{max-width:720px}
.btn-cta{background:#c5a052;border-color:#c5a052;color:#081426;box-shadow:none}
.btn-cta:hover{background:#dab96f;border-color:#dab96f}
@media(max-width:880px){
  .heroimg{background-image:url("assets/hero-background-mobile.webp");background-position:center}
  .heroveil{background:linear-gradient(180deg,rgba(4,15,30,.64),rgba(4,15,30,.91))}
  .hero{padding-top:30px;padding-bottom:60px}
  .hero .wrap{gap:26px}
  .bookdrag{max-width:320px;margin:auto}
}
@media(max-width:720px){.portrait,.portrait img{height:auto}}
/* Site integration: intrinsic width/height attributes must not stretch the images */
.bookimg{display:block;width:100%;max-width:480px;height:auto;margin:0 auto}
.bookdrag{width:min(480px,100%)}
.portrait img{width:100%;max-width:320px;height:auto}
.shot-cut{height:auto}
@media(max-width:880px){.bookimg{max-width:320px}}

/* ===== Premium pass (23 September 2026) ===== */
:root{--gold-text:#7a5c0c}
/* Flipbook: the turning leaf is hidden until a page actually turns (was covering the cover with a blank sheet) */
.leaf{display:none}
/* Primary buttons: navy text on gold, 7:1 contrast, everywhere including the nav */
.btn-cta,.nav .btn-cta,.btn-gold,.nav .btn-gold{background:#c5a052;border-color:#c5a052;color:#081426}
.btn-cta:hover,.btn-gold:hover,.nav .btn-cta:hover{background:#dab96f;border-color:#dab96f;color:#081426}
/* Section labels: readable gold on light grounds, bright gold on navy grounds */
.kicker{color:var(--gold-text)}
.hero .kicker,.look .kicker,.stats .kicker,.bulk .kicker,.signup .kicker,.pull .kicker,.proverb-navy .kicker,footer .kicker{color:var(--gold-3)}
/* The opening paragraph of each section reads as a true lead */
.lead{font-size:1.42rem;line-height:1.5;color:var(--navy)}
@media(max-width:720px){.lead{font-size:1.22rem}}
/* Visible keyboard focus on every control */
a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid #dab96f;outline-offset:3px;border-radius:2px}
/* Text never butts against the screen edge on small phones */
@media(max-width:400px){.wrap{padding-left:20px;padding-right:20px}}
.proverb-ivory .pen{color:var(--gold-text)}
/* Flipbook cover: the new flat cover is trimmed, so it sits exactly inside the page (the old offsets cropped the title) */
.page-base .coverart,.leaf-face .coverart{top:0!important;left:0!important;right:0!important;bottom:0!important;background-size:cover;background-position:center}
/* Touch targets at least 44 px */
#muteBtn{min-height:44px;padding-left:16px;padding-right:16px}
.author a[href*="amazon"]{display:inline-flex;align-items:center;min-height:44px}
