@charset "UTF-8";

/* Self-hosted OFL type: editorial stems paired with one expressive ink hand.
   Only the journey's titles change; the author's stationery is untouched. */
@font-face {
  font-family: "Starry Editorial";
  src: url("./assets/fonts/cormorant-garamond.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}
@font-face {
  font-family: "Starry Calligraphy";
  src: url("./assets/fonts/pinyon-script.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

.chapter {
  --title-ivory: #f1ecf6;
  --title-mid: #c8badf;
  --title-low: #a4b9d7;
  --title-rose: #d9bbd2;
}
.home, .petal-transition, .flower-birthday, .flower-gate {
  --title-ivory: #fbefe1;
  --title-mid: #edcdbc;
  --title-low: #cba995;
  --title-rose: #f0d4c8;
}
.nebula-reverie {
  --title-mid: #d0bde6;
  --title-low: #b7aedb;
  --title-rose: #e2bed6;
}
.art-title {
  font-family: "Starry Editorial", "Baskerville", Georgia, serif !important;
  font-weight: 400 !important;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures discretionary-ligatures;
  text-rendering: optimizeLegibility;
  text-shadow: none;
}
.art-ink {
  display: inline-block;
  color: var(--title-ivory);
  /* Tiny overhang allowance retains handwritten terminals and descenders. */
  padding: .06em .10em .16em;
  margin: -.06em -.10em -.16em;
  filter: drop-shadow(0 2px 7px #050b16a3);
}
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  .art-ink {
    background-image: linear-gradient(122deg,
      var(--title-ivory) 8%, var(--title-ivory) 29%,
      var(--title-mid) 46%, var(--title-ivory) 55%,
      var(--title-rose) 72%, var(--title-low) 96%);
    background-size: 150% 100%;
    background-position: 12% 50%;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: ink-lustre 24s ease-in-out infinite alternate;
  }
}
.art-title .art-script {
  font-family: "Starry Calligraphy", "Baskerville", Georgia, serif;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -.025em;
  line-height: 1.03;
  transform: rotate(-3deg);
  transform-origin: left center;
  animation-delay: -9s;
}
.home h1.art-title {
  font-size: clamp(86px, 9.2vw, 144px);
  line-height: .86;
  letter-spacing: -.046em;
}
.home h1 > .title-blooms { margin-top: .13em; margin-left: .23em; }
.home h1 .title-stars { --title-ivory: #edf0fc; --title-mid: #c8c0e5; --title-low: #b3c4df; }
.home h1 .home-amp { font-family: "Starry Editorial", Georgia, serif; font-size: .37em; color: #dfc4b9; }
.home h1 .title-blooms .art-script { font-size: 1.03em; }
.title-flourish {
  display: block;
  width: min(315px, 78%);
  height: 32px;
  margin: 11px 0 0 20px;
  fill: none;
  stroke: #d5b8a499;
  stroke-width: .65;
  stroke-linecap: round;
  pointer-events: none;
}
.title-flourish .flourish-stem { stroke: #d4cbbd77; stroke-width: .5; }
.home-subtitle { margin-top: 16px; letter-spacing: .19em; color: #e6ded5; }
.gate-title.art-title { font-size: clamp(76px, 7.6vw, 115px); letter-spacing: -.042em; line-height: .88; }
.star-gate .art-script { margin-left: .24em; font-size: 1.28em; }
.nebula-copy { width: min(380px, 38vw); max-width: 380px; flex-shrink: 0; }
.nebula-copy h2.art-title { font-size: clamp(54px, 5.6vw, 84px); line-height: .92; letter-spacing: -.03em; }
.nebula-copy h2 .art-script { font-size: 1.14em; margin-left: .22em; }
.nebula-copy .poem { margin-top: 31px; }
.birthday h2.art-title { font-size: clamp(68px, 7.3vw, 111px); line-height: .89; letter-spacing: -.035em; margin-bottom: 38px; }
.birthday h2 .art-script { font-size: 1.10em; margin-left: .05em; }
.birthday-spark { font-size: 14px; top: 8px; right: 13%; color: var(--title-mid); opacity: .75; }
.flower-gate .gate-title.art-title { font-size: clamp(68px, 7vw, 106px); }
.flower-gate .art-script { font-size: 1.08em; margin-left: .13em; }
.serif-whisper.art-title { font-size: clamp(51px, 5.2vw, 79px); line-height: 1.06; letter-spacing: -.03em; }
.serif-whisper .art-script { font-size: 1.17em; margin-left: .03em; }
.chapter .poem, .transition h2 { font-weight: 400; letter-spacing: .11em; }
.eyebrow .chapter-roman { color: var(--title-mid); }
.choice-name, .home-signature { font-family: "Starry Editorial", "Baskerville", Georgia, serif; }
.choice-name { font-size: clamp(27px, 2.8vw, 43px); letter-spacing: -.018em; }
.choice-name em { color: #dfc7d9; }
.choice-flower .choice-name em { color: #edc8b8; }

@keyframes ink-lustre { to { background-position: 85% 50%; } }
@media (max-width: 1000px) {
  .home h1.art-title { font-size: clamp(78px, 9.5vw, 98px); }
  .gate-title.art-title, .flower-gate .gate-title.art-title, .birthday h2.art-title { font-size: 70px; }
  .serif-whisper.art-title { font-size: 57px; }
  .choice-name { font-size: 27px; }
}
@media (max-width: 650px) {
  .home h1.art-title { font-size: clamp(70px, 20vw, 100px); }
  .home h1 > .title-blooms { margin-left: .20em; }
  .title-flourish { height: 24px; width: 245px; max-width: 84%; margin-top: 9px; }
  .home-subtitle { margin-top: 14px; }
  .gate-title.art-title, .flower-gate .gate-title.art-title, .birthday h2.art-title { font-size: clamp(58px, 15.7vw, 78px); }
  .nebula-copy h2.art-title { font-size: clamp(50px, 13vw, 66px); }
  .nebula-copy { width: min(325px, 82vw); }
  .birthday h2.art-title { margin-bottom: 30px; }
  .serif-whisper.art-title { font-size: clamp(47px, 12vw, 62px); }
}
@media (max-height: 680px) and (min-width: 651px) {
  .home h1.art-title { font-size: 75px; }
  .gate-title.art-title, .flower-gate .gate-title.art-title, .birthday h2.art-title { font-size: 68px; }
}
@media (prefers-reduced-motion: reduce) { .art-ink { animation: none; } }
@media (forced-colors: active) {
  .art-ink { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; filter: none; }
}