/* SHARED CONTENT STYLES — used by more than one screen:
   .eyebrow .page-title .lead .hand-note .back-link .pill .actions .stack .card */

.eyebrow { font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:var(--muted) }
.page-title { font-size:clamp(2.7rem,7vw,4.7rem); line-height:.94; letter-spacing:-.045em; margin:8px 0 12px }
.lead { color:#35516f; font-size:.98rem; line-height:1.55 }
.hand-note { font-size:1.38rem; display:inline-block; transform:rotate(-2deg) }
.back-link { border:0; background:none; padding:4px 0; cursor:pointer; font-weight:700; color:var(--navy) }
.pill { display:inline-flex; width:fit-content; border-radius:999px; padding:10px 14px; font-weight:800; font-size:.86rem; background:var(--sage) }
.actions { display:flex; gap:10px; flex-wrap:wrap }
.stack { display:grid; gap:14px }
.card { background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:24px; padding:22px; box-shadow:var(--shadow-soft) }
.contact-section{margin-top:24px;padding:20px;border-radius:18px;background:var(--oat);scroll-margin-top:88px}
.contact-section h2{margin:0 0 7px;font-family:Georgia,"Times New Roman",serif}
.contact-section p{margin:0}
.contact-section:focus{outline:none}
.contact-section:focus-visible{outline:3px solid rgba(8,42,86,.30);outline-offset:3px}

/* Newsletter anti-spam honeypot. Keep it out of the layout and keyboard flow. */
.newsletter-honeypot { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.newsletter-form[aria-busy="true"] button { cursor:wait; }
.newsletter-form button:disabled { opacity:.65; cursor:not-allowed; }


/* About page — editorial sections keep the full story easy to scan. */
.about-page > .card {
  padding:clamp(24px,4vw,38px)
}

.about-page .about-intro {
  margin-top:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:1.4rem;
  color:var(--navy)
}

.about-page .about-beat {
  font-family:"Patrick Hand",cursive;
  font-size:1.3rem;
  color:var(--navy)
}

.about-section {
  margin-top:34px
}

.about-section h2 {
  margin:0 0 12px;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(1.45rem,3vw,1.85rem);
  color:var(--navy)
}

.about-section p {
  max-width:650px
}

.about-illustration {
  width:min(100%,520px);
  height:300px;
  margin:28px auto 4px
}

.about-illustration img {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center
}

.about-page > .cosmic-card {
  margin-top:22px
}

@media(max-width:700px) {
  .about-page > .card {
    padding:22px 19px
  }

  .about-section {
    margin-top:28px
  }

  .about-illustration {
    height:230px;
    margin-top:22px
  }
}