/* Crisp, selectable lettering aligned to the supplied text-free artwork.
   All measurements are proportional to each reference image's original frame. */

.hero,
.archetypes,
.inside {
  container-type: inline-size;
}

/* Hero wordmark and cover lettering */
.hero-brand {
  display: block;
  position: absolute;
  z-index: 5;
  left: 40.15%;
  top: calc(var(--section-space) + 4.4cqi);
  width: 25% !important;
  height: auto !important;
  margin: 0;
  transform: translateX(-50%);
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
}
.hero-brand .gold-rule,
.hero-brand .gold-ornament {
  display: none;
}
.hero-brand .brand-name {
  display: block;
  color: #35443d;
  font: 600 1.4cqi/1.2 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .48em;
}
.hero-rail {
  display: none !important;
}
.hero-copy {
  inset: var(--section-space) 0 !important;
  height: auto;
  overflow: visible;
  clip: auto;
  clip-path: none;
  white-space: normal;
}
.hero-copy h1,
.hero-copy p {
  position: absolute !important;
  display: block;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  border: 0 !important;
  white-space: normal !important;
  color: #143c38;
}
.hero-copy h1 {
  left: 22.5%;
  top: 23.7%;
  width: 34.4% !important;
  text-align: center;
  font: 500 6.2cqi/.82 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.055em;
}
.hero-copy .hero-script {
  left: 23.7%;
  top: 44.7%;
  width: 31.6% !important;
  text-align: center;
  color: #293d38;
  font: 400 4.2cqi/1.05 "Allura", cursive;
  letter-spacing: 0;
}
.hero-copy .release-date {
  left: 32.5%;
  top: 59.3%;
  width: 15.3% !important;
  text-align: center;
  color: #293d38;
  font: 600 1.55cqi/1.2 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .22em;
}
.hero-copy .hero-note {
  left: 25.4%;
  top: 66.3%;
  width: 28.3% !important;
  text-align: center;
  color: #293d38;
  font: 600 1.7cqi/1.2 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .18em;
}
.hero-copy .pill-button {
  left: 29.7%;
  top: 80.4%;
  width: 20.3%;
  height: 5.2%;
  min-height: 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: .65cqi;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: transparent;
  color: #fffaf1;
  font: 500 1.5cqi/1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .015em;
  white-space: nowrap;
  text-shadow: 0 1px 1px rgba(28, 97, 88, .16);
  pointer-events: auto;
}
.hero-copy .pill-button:hover,
.hero-copy .pill-button:focus-visible {
  background: transparent;
  transform: none;
}
.hero-copy .pill-button span {
  font: inherit;
  line-height: 1;
}

/* Night-of-the-soul text is aligned to the separate 392 × 335 artwork. */
.night-copy {
  position: relative;
  container-type: inline-size;
}
.night-copy .night-reference {
  position: relative;
  z-index: 0;
}
.night-copy h2,
.night-copy > .script-subtitle,
.night-copy .body-copy {
  position: absolute !important;
  z-index: 1;
  display: block;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  border: 0 !important;
  white-space: normal !important;
}
.night-copy h2 {
  top: 0;
  left: 0;
  width: 100% !important;
  color: #283a36;
  font: 400 7.45cqi/1.1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.045em;
  white-space: nowrap !important;
}
.night-copy > .script-subtitle {
  top: 11.35%;
  left: 3.05%;
  width: 88% !important;
  color: #39463c;
  font: 400 5.25cqi/1.1 "Allura", cursive;
  letter-spacing: 0;
}
.night-copy .body-copy {
  inset: 0;
  color: #3e403a;
  font: 400 2.95cqi/1.06 "Cormorant Garamond", Georgia, serif;
}
.night-copy .body-copy p {
  position: absolute;
  left: 6.9%;
  width: 93.5%;
  padding: 0;
  margin: 0;
  color: inherit;
  font: inherit;
  line-height: inherit;
  white-space: normal;
}
.night-copy .body-copy p:nth-child(1) { top: 23.9%; }
.night-copy .body-copy p:nth-child(2) { top: 49.1%; }
.night-copy .body-copy p:nth-child(3) { top: 76.6%; }
.night-copy .body-copy p:nth-child(4) { top: 92.1%; }
.night-copy .ornament {
  display: none;
}

/* The original cards, borders, and icons remain in the artwork. */
.archetypes {
  position: relative;
}
.archetypes .section-reference {
  position: relative;
}
.archetypes .center-heading {
  position: absolute !important;
  z-index: 1;
  top: calc(var(--section-space) + 2.7cqi);
  left: 0;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
}
.archetypes .center-heading h2 {
  color: #203b36;
  font: 400 4.05cqi/1.05 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.04em;
  margin: 0;
}
.archetypes .center-heading .script-subtitle {
  color: #36423b;
  font: 400 2.65cqi/1.1 "Allura", cursive;
  margin: .15cqi 0 0;
}
.archetypes .archetype-grid {
  position: absolute !important;
  z-index: 1;
  top: calc(var(--section-space) + 11.3cqi);
  left: 14.25%;
  width: 71.5% !important;
  height: auto !important;
  max-width: none;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-template-rows: repeat(2, 13.1cqi);
  gap: 1.2cqi 1.6cqi;
}
.archetypes .archetype {
  min-height: 0;
  height: 13.1cqi;
  padding: 0 0 1.4cqi;
  border: 0;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  background: transparent;
}
.archetypes .archetype svg {
  display: none;
}
.archetypes .archetype h3 {
  color: #253a35;
  font: 600 1.65cqi/1.18 "Cormorant Garamond", Georgia, serif;
  height: 3.9cqi;
  letter-spacing: 0;
  margin: 0;
}
.archetypes .archetype h3:not(:has(br)) { padding-top: .97cqi; }

/* Text lies over the printed pages; the open-book photograph stays untouched. */
.inside {
  position: relative;
}
.inside > h2 {
  position: absolute !important;
  z-index: 1;
  top: calc(var(--section-space) * 3 + .8cqi);
  left: 0;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  color: #283a35;
  font: 400 3.4cqi/1.05 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.035em;
}
.inside .open-book {
  position: absolute !important;
  z-index: 1;
  top: calc(var(--section-space) * 3 + 10.1cqi);
  left: 0;
  width: 100% !important;
  height: 25cqi;
  min-height: 0;
  padding: 0 !important;
  margin: 0;
  display: block;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  white-space: normal !important;
  filter: none;
  perspective: none;
}
.inside .book-page {
  position: absolute;
  top: 0;
  width: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: left;
  transform: none !important;
}
.inside .book-page:first-child {
  left: 24%;
  width: 24%;
}
.inside .book-page:last-child {
  left: 54%;
  width: 25%;
}
.inside .book-page p {
  color: #51483f;
  font: 400 1.4cqi/1.25 "Cormorant Garamond", Georgia, serif;
  letter-spacing: 0;
  margin: 0 0 1cqi;
}
.inside .book-spine {
  display: none;
}
.inside .inside-button {
  position: absolute !important;
  z-index: 2;
  top: calc(var(--section-space) * 3 + 36.3cqi);
  bottom: auto;
  left: 32.3%;
  width: 35.2%;
  height: 4.8cqi;
  min-height: 0;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: 99px;
  background: transparent;
  color: #fffaf1;
  font: 500 1.55cqi/1 "Cormorant Garamond", Georgia, serif;
  letter-spacing: .015em;
  white-space: nowrap;
  text-shadow: 0 1px 1px rgba(28, 97, 88, .16);
}
.inside .inside-button:hover,
.inside .inside-button:focus-visible {
  background: transparent;
  transform: none;
}
.inside .inside-button span {
  font: inherit;
  padding-left: .8cqi;
}

/* Rose headline and body copy track the 370 × 119 source panel. */
.rose-copy {
  position: relative;
  container-type: inline-size;
}
.rose-copy .rose-reference {
  position: relative;
  z-index: 0;
}
.rose-copy h2,
.rose-copy > p {
  position: absolute !important;
  z-index: 1;
  display: block;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  clip-path: none !important;
  border: 0 !important;
  white-space: normal !important;
}
.rose-copy h2 {
  top: 13.1%;
  left: 8.1%;
  width: 68% !important;
  color: #283a35;
  font: 400 6.2cqi/1.08 "Cormorant Garamond", Georgia, serif;
  letter-spacing: -.04em;
}
.rose-copy > p {
  top: 55.5%;
  left: 0;
  width: 78.7% !important;
  color: #3b403b;
  text-align: center;
  font: 400 2.55cqi/1.45 "Cormorant Garamond", Georgia, serif;
}