/* Preserve the confirmed artwork's actual typography and decorative imagery.
   Only requested image swaps and interactive areas use native replacements. */
:root {
  --section-space: clamp(18px, 2.5vw, 48px);
  --cream: #faf6ef;
  --peach-light: #f9e1d5;
  --serif: "Cormorant Garamond", Georgia, serif;
  --section-pink: #fae2d5;
}
html { scroll-behavior: auto; }
.section-pad { padding: var(--section-space) 4%; }
.hero-brand, .hero-rail, .hero-copy h1, .hero-copy p,
.night-copy h2, .night-copy > p, .night-copy .body-copy, .night-copy .ornament,
.archetypes .center-heading, .archetypes .archetype-grid,
.inside > h2, .inside .open-book,
.rose-copy h2, .rose-copy > p, .rose-copy .inline-link {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.hero {
  display: block;
  min-height: 0;
  padding: var(--section-space) 0;
  background: #f8f0e5;
}
.hero-reference, .section-reference {
  display: block;
  width: 100%;
  height: auto;
}
.hero:before, .night:before, .inside:before, .rose:before, .preorder:before {
  display: none;
}
.hero-copy {
  position: absolute;
  inset: var(--section-space) 0;
  margin: 0;
  max-width: none;
  z-index: 4;
  pointer-events: none;
}
.hero-copy .pill-button {
  position: absolute;
  left: 27.7%;
  top: 77%;
  width: 27.2%;
  height: 10%;
  pointer-events: auto;
  min-height: 0;
}
.hero-copy .pill-button, .inside .inside-button {
  background: transparent;
  color: transparent;
  padding: 0;
  border: 0;
  transform: none;
}
.hero-copy .pill-button:hover, .inside .inside-button:hover {
  background: rgba(255, 255, 255, .1);
  transform: none;
}
.hero-art {
  position: absolute;
  inset: var(--section-space) 0;
  display: block;
  min-height: 0;
  padding: 0;
  pointer-events: none;
}
.hero-cover {
  position: absolute;
  left: 62.5%;
  top: 24%;
  width: 22%;
  max-width: none;
  height: auto;
  filter: drop-shadow(2px 4px 5px #71513733);
}
.marble-pedestal { display: none; }
.night {
  grid-template-columns: .43fr .57fr;
  gap: 3%;
  background: #f9e1d5;
}
.night-image, .night-copy, .about-copy { max-width: none; }
.night-image img { width: 100%; height: auto; }
.night-reference, .about-reference, .rose-reference {
  display: block;
  width: 100%;
  height: auto;
}
.archetypes, .inside {
  display: block;
  position: relative;
  padding: var(--section-space) 0;
  background: #faf6ef;
}
.inside { padding-top: calc(var(--section-space) * 3); }
.inside .inside-button {
  position: absolute;
  left: 32.3%;
  bottom: calc(var(--section-space) + 1.8%);
  width: 35.2%;
  height: 10%;
  min-height: 0;
  margin: 0;
}
.rose {
  grid-template-columns: .58fr .42fr;
  gap: 4%;
  background: var(--section-pink);
}
.rose-copy, .rose-photo { width: 100%; max-width: none; }
.rose-photo img {
  width: 100%;
  height: clamp(180px, 25vw, 480px);
  object-fit: cover;
  object-position: 50% 60%;
}
.about {
  grid-template-columns: .43fr .57fr;
  gap: 3%;
  background: #faf6ef;
  align-items: start;
}
.about-heading h2, .preorder-copy h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(36px, 4vw, 64px);
  line-height: 1.05;
  letter-spacing: -.035em;
}
.about-heading { grid-column: 1 / -1; text-align: center; }
.about-heading h2 { margin-bottom: 12px; }
.author-divider {
  width: min(42%, 320px);
  height: auto;
  margin: 0 auto 20px;
}
.about-copy p {
  font-family: var(--serif);
  font-size: clamp(18px, 1.8vw, 34px);
  line-height: 1.45;
  margin-bottom: 18px;
}
.about-photo { width: 100%; max-width: none; }
.about-photo img {
  width: 100%;
  height: auto;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
}
.faq-heading h2, .preorder-copy h2 { font-weight: 400; }
.faq { background: var(--section-pink); }
.faq-list { max-width: none; width: 88%; }
.faq-list summary { font-size: clamp(16px, 1.5vw, 27px); padding-block: 14px; }
.faq-list details p { font-size: clamp(15px, 1.25vw, 22px); max-width: none; }
.preorder-art { position: relative; min-height: 0; padding: 0; background: none; }
.bottom-cover {
  position: relative;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
  filter: none;
}
.pill-button, .submit-button {
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(12px, 1.1vw, 19px);
}
.form-field label { font-size: clamp(13px, 1vw, 18px); }
.bonus-form input { font-size: clamp(13px, 1vw, 18px); height: 42px; }
.form-intro p { font-size: clamp(17px, 1.5vw, 25px); }
.site-footer p, .contact-trigger { font-size: 13px; }
@media (max-width: 760px) {
  .night, .about { grid-template-columns: 1fr; gap: 24px; }
  .night-image, .about-photo { width: min(72%, 400px); margin: auto; }
  .night-copy, .about-copy { width: 100%; }
  .rose { grid-template-columns: .58fr .42fr; gap: 3%; }
  .rose-photo { justify-self: end; }
  .rose-photo img { height: clamp(145px, 36vw, 270px); }
  .preorder-art { min-height: 0; width: min(100%, 460px); margin: auto; }
  .bonus-form { grid-template-columns: 1fr; }
  .site-footer { gap: 14px; flex-wrap: wrap; }
  .site-footer p { font-size: 11px; }
}