/* One-off article embellishments — load with page-doodles.js on the target page only. */
.site-header {
  background: #fff;
  --site-header-border-subtle: rgba(0, 0, 0, 0.24);
}
.site-header .site-header__wordmark--dark {
  display: block;
}
.site-header .site-header__wordmark--light {
  display: none;
}
.article-title {
  font-size: 2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 2.8rem */
}
.article-description {
  font-feature-settings: 'liga' off, 'clig' off;
  font-family: Inter;
  font-size: 6.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 100%; /* 6.4rem */
  letter-spacing: -0.512rem;
  max-width: min(100%, 60rem);
}
.article-body {
  padding-top: 8rem;
}

.article-body__brightcove {
  position: relative;
  overflow: visible;
}

/* Flower sits behind the whole footer (background + content), not inside the shell */
.site-footer-doodle-anchor {
  position: relative;
  overflow: visible;
}

.site-footer-doodle-anchor > .site-footer {
  position: relative;
  z-index: 1;
}

.page-doodle {
  position: absolute;
  pointer-events: none;
  z-index: 0;
  display: block;
  line-height: 0;
}

.page-doodle img {
  display: block;
  width: 100%;
  height: auto;
}

/* Footer: top-right of footer box, shifted up */
.site-footer-doodle-anchor > .page-doodle--flower {
  width: clamp(150px, 18vw, 240px);
  right: 0;
  top: 0;
  transform: translate(0, -93%) scale(1.02);
  transform-origin: 85% 85%;
}

/* Video: branch emerges from under the top edge, ~60% from the left */
.article-body__full-bleed--breakout > .page-doodle--branch,
.article-body__brightcove > .page-doodle--branch {
  width: clamp(280px, 38vw, 520px);
  top: 0;
  left: 50%;
  transform: translate(0, -82%) rotate(0deg) scale(0.82);
  transform-origin: 50% 50%;
}

/* Video: butterfly below bottom-left corner */
.article-body__full-bleed--breakout > .page-doodle--butterfly,
.article-body__brightcove > .page-doodle--butterfly {
  width: clamp(140px, 16vw, 220px);
  top: 100%;
  left: 5%;
  margin-top: 5rem;
  transform: translate(0, -50px) rotate(5deg) scale(0.88);
  transform-origin: 20% 90%;
}

/* Description scribble underline (word wrapped by page-doodles.js) */
.article-description .desc-underline {
  position: relative;
  display: inline;
  white-space: nowrap;
  text-decoration: none;
  isolation: isolate;
}

.article-description .desc-underline::before {
  content: "";
  position: absolute;
  left: -0.25em;
  right: -0.45em;
  bottom: -0.62em;
  height: 1.45em;
  min-height: 6px;
  background: var(--page-doodle-underline-url) center bottom / 100% 100% no-repeat;
  pointer-events: none;
  z-index: -1;
}

@media (max-width: 900px) {
  .article-body__brightcove > .page-doodle--branch,
  .article-body__full-bleed--breakout > .page-doodle--branch {
    width: clamp(200px, 50vw, 360px);
    opacity: 0.85;
  }
}

@media (max-width: 600px) {
  .site-footer-doodle-anchor > .page-doodle--flower {
    width: 120px;
    opacity: 0.8;
  }

  .article-body__brightcove > .page-doodle--butterfly,
  .article-body__full-bleed--breakout > .page-doodle--butterfly {
    width: 110px;
    margin-top: 3rem;
    transform: translate(-8%, 0) rotate(-12deg) scale(0.75);
    opacity: 0.8;
  }

  .article-body__brightcove > .page-doodle--branch,
  .article-body__full-bleed--breakout > .page-doodle--branch {
    display: none;
  }
}
