/* 2026-06-19: clean fixed-photo homepage hero. Only the image stays fixed. */
html,
body {
  overflow-x: hidden !important;
}

html body .site-header {
  position: relative !important;
  z-index: 30 !important;
}

html body main#home {
  position: relative !important;
  background: transparent !important;
}

html body main#home section.hero {
  position: relative !important;
  z-index: 2 !important;
  display: block !important;
  min-height: 100svh !important;
  height: 100svh !important;
  overflow: hidden !important;
  color: #fffaf2 !important;
  background: transparent !important;
  isolation: isolate !important;
}

html body main#home section.hero > img.hero-fixed-image {
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  width: 100vw !important;
  height: 100svh !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  transform: none !important;
  pointer-events: none !important;
}

html body main#home section.hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  background: linear-gradient(90deg, rgba(15, 10, 7, 0.58) 0%, rgba(15, 10, 7, 0.24) 36%, rgba(15, 10, 7, 0.04) 66%, rgba(15, 10, 7, 0.08) 100%) !important;
  pointer-events: none !important;
}

html body main#home section.hero::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2 !important;
  display: block !important;
  height: 90px !important;
  background: linear-gradient(180deg, transparent, rgba(251, 242, 228, 0.96)) !important;
  pointer-events: none !important;
}

html body main#home section.hero .hero-pin {
  position: relative !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  width: min(100% - 64px, 1460px) !important;
  min-height: 100svh !important;
  height: 100svh !important;
  margin: 0 auto !important;
  padding: 80px 0 clamp(42px, 5vw, 72px) !important;
  overflow: visible !important;
  background: transparent !important;
  transform: none !important;
  animation: none !important;
}

html body main#home .hero-bg,
html body main#home .hero-bg img,
html body main#home .hero-book-reveal,
html body main#home .hero-book-reveal img,
html body main#home .hero-book-reveal::before,
html body main#home .hero-book-reveal::after,
html body main#home .hero-stage,
html body main#home .hero-redo-art {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html body main#home .hero-redo-copy {
  position: relative !important;
  z-index: 4 !important;
  display: block !important;
  visibility: visible !important;
  width: min(860px, 72vw) !important;
  max-width: 860px !important;
  margin-left: clamp(30px, 5vw, 86px) !important;
  margin-right: auto !important;
  padding: clamp(20px, 2.7vw, 32px) !important;
  border-left: 3px solid #d6ab60 !important;
  background: rgba(15, 10, 7, 0.5) !important;
  color: #fffaf2 !important;
  opacity: 1 !important;
  box-shadow: 0 24px 58px rgba(0, 0, 0, 0.18) !important;
  backdrop-filter: blur(1px) !important;
}

html body main#home .hero-redo-kicker {
  margin: 0 0 12px !important;
  color: #d6ab60 !important;
  font-size: 0.76rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

html body main#home .hero-redo-copy h1 {
  max-width: 840px !important;
  margin: 0 !important;
  color: #fffaf2 !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(3.6rem, 6.6vw, 6.9rem) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  line-height: 0.9 !important;
  text-shadow: 0 18px 42px rgba(0, 0, 0, 0.52) !important;
}

html body main#home .hero-redo-lead {
  max-width: 710px !important;
  margin: 20px 0 0 !important;
  color: rgba(255, 250, 242, 0.94) !important;
  font-size: clamp(1rem, 1.2vw, 1.16rem) !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}

html body main#home .hero-redo-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 24px !important;
}

html body main#home .hero-redo-actions .button {
  min-height: 46px !important;
  padding: 13px 22px !important;
  border-radius: 999px !important;
  font-size: 0.98rem !important;
  text-decoration: none !important;
}

html body main#home .hero-redo-secondary {
  border: 1px solid rgba(255, 250, 242, 0.5) !important;
  background: rgba(255, 250, 242, 0.12) !important;
  color: #fffaf2 !important;
}

html body main#home .hero-redo-note {
  margin: 22px 0 0 !important;
  color: rgba(255, 250, 242, 0.86) !important;
  font-size: 0.9rem !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

html body main#home .intro-band,
html body main#home .section,
html body main#home .newsletter,
html body main#home .contact-section,
html body .site-footer {
  position: relative !important;
  z-index: 8 !important;
}

html body main#home .intro-band {
  margin-top: 0 !important;
  background: rgba(251, 242, 228, 0.98) !important;
  box-shadow: 0 -18px 46px rgba(18, 12, 8, 0.14) !important;
}

@media (min-width: 901px) and (max-width: 1180px) {
  html body main#home section.hero .hero-pin {
    width: min(100% - 48px, 1080px) !important;
    padding-bottom: 44px !important;
  }

  html body main#home .hero-redo-copy {
    width: min(760px, 76vw) !important;
    max-width: 760px !important;
    margin-left: 26px !important;
    padding: 22px !important;
    background: rgba(15, 10, 7, 0.5) !important;
  }

  html body main#home .hero-redo-copy h1 {
    font-size: clamp(3.4rem, 6.2vw, 5.6rem) !important;
  }

  html body main#home .hero-redo-lead,
  html body main#home .hero-redo-note {
    font-size: 0.95rem !important;
  }
}

@media (max-width: 900px) {
  html body main#home section.hero,
  html body main#home section.hero .hero-pin {
    min-height: 720px !important;
    height: 720px !important;
  }

  html body main#home section.hero .hero-pin {
    align-items: flex-end !important;
    width: min(100% - 34px, 720px) !important;
    padding: 60px 0 86px !important;
  }

  html body main#home .hero-redo-copy {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    padding: 22px !important;
  }
}

@media (max-width: 560px) {
  html body main#home section.hero,
  html body main#home section.hero .hero-pin {
    min-height: 680px !important;
    height: 680px !important;
  }

  html body main#home section.hero > img.hero-fixed-image {
    object-position: 58% center !important;
  }

  html body main#home .hero-redo-copy h1 {
    font-size: clamp(2.8rem, 15vw, 4.15rem) !important;
    line-height: 0.94 !important;
  }

  html body main#home .hero-redo-lead {
    font-size: 0.98rem !important;
  }

  html body main#home .hero-redo-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  html body main#home .hero-redo-actions .button {
    width: 100% !important;
  }
}
/* 2026-06-19 smaller hero panel: keep book cover unobstructed. */
@media (min-width: 901px) {
  html body main#home section.hero .hero-pin {
    align-items: flex-end !important;
    justify-content: flex-start !important;
    width: min(100% - 64px, 1460px) !important;
    padding-bottom: clamp(46px, 5vw, 74px) !important;
  }

  html body main#home .hero-redo-copy {
    width: min(600px, 48vw) !important;
    max-width: 600px !important;
    margin-left: clamp(40px, 6vw, 94px) !important;
    margin-right: auto !important;
    padding: clamp(18px, 2.1vw, 26px) !important;
    background: rgba(15, 10, 7, 0.56) !important;
  }

  html body main#home .hero-redo-copy h1 {
    max-width: 580px !important;
    font-size: clamp(3.2rem, 5.15vw, 5.35rem) !important;
  }

  html body main#home .hero-redo-lead {
    max-width: 560px !important;
    margin-top: 16px !important;
    font-size: clamp(0.96rem, 1.02vw, 1.08rem) !important;
  }

  html body main#home .hero-redo-actions {
    margin-top: 20px !important;
  }

  html body main#home .hero-redo-actions .button {
    min-height: 43px !important;
    padding: 11px 18px !important;
    font-size: 0.92rem !important;
  }

  html body main#home .hero-redo-note {
    margin-top: 18px !important;
    font-size: 0.84rem !important;
  }
}

@media (min-width: 901px) and (max-width: 1180px) {
  html body main#home .hero-redo-copy {
    width: min(560px, 52vw) !important;
    max-width: 560px !important;
    margin-left: 28px !important;
    padding: 18px !important;
  }

  html body main#home .hero-redo-copy h1 {
    font-size: clamp(3rem, 5.4vw, 4.75rem) !important;
  }

  html body main#home .hero-redo-lead {
    max-width: 500px !important;
  }
}