/* Grace Harbor — Anchor hierarchy marks
   Editorial enhancement only. Not a redesign.
   Hierarchy:
     Simple (.gh-anchor-statement) = page primary message / quiet printer's mark
     Medium (.gh-anchor-medium) = broader section truths
     Heirloom (.gh-heirloom-anchor) = rare major keep-near reflection
*/

/* —— Anchor Statement (quiet pause unit) ——
   Rhythm everywhere:
   Anchor mark
   10–14px
   Statement text
   24–32px before the next section

   The mark floats on the existing page parchment —
   no plate, frame, card, panel, shadow, glow, or separate texture.
*/
.gh-anchor-statement {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 26rem;
  margin: 3rem auto clamp(24px, 2.5vw, 32px);
  padding: 0;
  text-align: center;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  filter: none !important;
  border-radius: 0 !important;
}

.gh-anchor-statement > img,
.gh-anchor-statement__mark {
  display: block;
  width: 42px;
  max-width: 42px;
  height: auto;
  margin: 0 auto;
  padding: 0;
  border: none !important;
  outline: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 0.82;
  /* Transparent PNG resting on page parchment — no image box */
  mix-blend-mode: normal;
  -webkit-mask-image: none;
  mask-image: none;
}

.gh-anchor-statement__text,
.gh-anchor-statement > figcaption {
  display: block;
  width: 100%;
  max-width: 22rem;
  margin: 12px 0 0; /* 10–14px after the mark */
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  font-family: "Cormorant Garamond", Baskerville, Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.05rem, 1.7vw, 1.2rem);
  line-height: 1.4;
  letter-spacing: 0.01em;
  color: #3a5f73;
  text-align: center;
}

/* Home: keep mark inside continuous parchment flow (no cream seam) */
.gh-home-content > .gh-anchor-statement {
  position: relative;
  z-index: 1;
  margin-top: clamp(1.75rem, 3.5vw, 2.75rem);
  margin-bottom: clamp(24px, 2.5vw, 32px);
  background: transparent !important;
}

/* —— Medium Anchor (section truth; between Simple and Heirloom) ——
   Floating crest on manuscript parchment — not a mini-poster, not a card.
   Statement text carries the pause; mark stays subordinate / restrained.
*/
.gh-anchor-medium {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 28rem;
  margin: 1.55rem auto 1.15rem;
  padding: 0;
  text-align: center;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  filter: none !important;
  border-radius: 0 !important;
}

/* Inside journal/vellum panels: keep the pause in-flow (no sheet break). */
.pwl-journal-panel .gh-anchor-medium,
.pwl-journal-stack .gh-anchor-medium {
  margin: 1.35rem auto 0.55rem;
  max-width: min(100%, 28rem);
}

.pwl-journal-panel > .gh-anchor-medium:last-child {
  margin-bottom: 0.15rem;
}

.gh-anchor-medium > img,
.gh-anchor-medium__mark {
  display: block;
  /* Restrained crest — larger than Simple (42px), far below Heirloom */
  width: clamp(56px, 8vw, 70px);
  max-width: min(70px, 24%);
  height: auto;
  margin: 0 auto;
  padding: 0;
  border: none !important;
  outline: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  filter: none !important;
  opacity: 0.92;
  /* Transparent PNG crest floating on parchment (not multiply card blend) */
  mix-blend-mode: normal;
  -webkit-mask-image: none;
  mask-image: none;
}

.gh-anchor-medium__text,
.gh-anchor-medium > figcaption {
  display: block;
  width: 100%;
  max-width: 26rem;
  margin: 10px 0 0;
  padding: 0;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  font-family: "Cormorant Garamond", Baskerville, Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(1.1rem, 1.85vw, 1.28rem);
  line-height: 1.42;
  letter-spacing: 0.01em;
  color: #3a5f73;
  text-align: center;
}

/* —— Heirloom Anchor (major reflective pause) —— */
.gh-heirloom-anchor {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 760px);
  max-width: 760px;
  margin: clamp(2.75rem, 5vw, 4rem) auto;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
  background: none;
  border: none;
  outline: none;
  box-shadow: none;
  border-radius: 0;
}

.gh-heirloom-anchor img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
  border: none;
  outline: none;
  box-shadow: none;
  border-radius: 0;
  --ha-feather: 14px;
  --ha-corner: 22px;
  --ha-corner-extra: 28px;
  -webkit-mask-image:
    linear-gradient(to right, transparent 0, #000 var(--ha-feather), #000 calc(100% - var(--ha-feather)), transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 var(--ha-feather), #000 calc(100% - var(--ha-feather)), transparent 100%),
    radial-gradient(circle at 0 0, transparent 0, transparent calc(var(--ha-corner) * 0.4), #000 var(--ha-corner)),
    radial-gradient(circle at 100% 0, transparent 0, transparent calc(var(--ha-corner-extra) * 0.4), #000 var(--ha-corner-extra)),
    radial-gradient(circle at 0 100%, transparent 0, transparent calc(var(--ha-corner-extra) * 0.4), #000 var(--ha-corner-extra)),
    radial-gradient(circle at 100% 100%, transparent 0, transparent calc(var(--ha-corner) * 0.4), #000 var(--ha-corner));
  -webkit-mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-composite: source-in, source-in, source-in, source-in, source-in;
  mask-image:
    linear-gradient(to right, transparent 0, #000 var(--ha-feather), #000 calc(100% - var(--ha-feather)), transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 var(--ha-feather), #000 calc(100% - var(--ha-feather)), transparent 100%),
    radial-gradient(circle at 0 0, transparent 0, transparent calc(var(--ha-corner) * 0.4), #000 var(--ha-corner)),
    radial-gradient(circle at 100% 0, transparent 0, transparent calc(var(--ha-corner-extra) * 0.4), #000 var(--ha-corner-extra)),
    radial-gradient(circle at 0 100%, transparent 0, transparent calc(var(--ha-corner-extra) * 0.4), #000 var(--ha-corner-extra)),
    radial-gradient(circle at 100% 100%, transparent 0, transparent calc(var(--ha-corner) * 0.4), #000 var(--ha-corner));
  mask-size: 100% 100%;
  mask-repeat: no-repeat;
  mask-composite: intersect;
}

@media (max-width: 1024px) {
  .gh-heirloom-anchor {
    width: min(92%, 760px);
    max-width: 100%;
    margin: clamp(2.5rem, 6vw, 3.5rem) auto;
  }
}

@media (max-width: 700px) {
  .gh-anchor-statement > img,
  .gh-anchor-statement__mark {
    width: 38px;
    max-width: 38px;
  }

  .gh-anchor-statement__text,
  .gh-anchor-statement > figcaption {
    margin-top: 11px;
    font-size: 1.05rem;
  }

  .gh-anchor-medium > img,
  .gh-anchor-medium__mark {
    width: 52px;
    max-width: 52px;
  }

  .gh-anchor-medium__text,
  .gh-anchor-medium > figcaption {
    margin-top: 9px;
    font-size: 1.1rem;
  }

  .gh-anchor-medium,
  .pwl-journal-panel .gh-anchor-medium,
  .pwl-journal-stack .gh-anchor-medium {
    margin-top: 1.2rem;
    margin-bottom: 0.45rem;
  }
}