/* =========================================================
   Mini Sessions — holding notice ("The Notice")
   Spec: docs/superpowers/specs/2026-08-31-minis-holding-page-design.md

   🔴 TEMPORARY PAGE. It announces that booking opens "this week", so it is
   correct for about seven days and wrong after that. It is replaced by the
   real eight-set minis page at this same URL — not retired.

   The card is the arch-topped invitation approved 2026-08-14 for
   /minis-list/. Its stylesheet (assets/minis-list) is stripped from the
   production build, so the geometry is carried here rather than referenced.
   Every value below traces to main.css :root; the only page-scoped ones are
   --mn-radius (12px, from the brand card's "cards ~10-14px") and the arch
   geometry, which is the signature element.
   ========================================================= */

/* The card is --paper, so the page sits on --cream to give it a surface to
   rest on. main.css defaults body to --paper, which would hide the card. */
body.page-minis-notice { background: var(--cream); }

.mn-page {
  --mn-radius: 12px;
  --mn-seal: var(--blush-deep);

  position: relative;
  min-height: 72vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(2.5rem, 7vw, 6rem) var(--gut) clamp(4rem, 9vw, 7rem);
}

/* ---------- the card: an arch-topped notice on cream ---------- */

.mn-card {
  position: relative;
  width: 100%;
  max-width: 34rem;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);

  /* The arch. Two-value syntax = separate horizontal/vertical radii, so the
     curve stays a gentle ellipse at every width instead of a tall semicircle. */
  border-radius: 50% 50% var(--mn-radius) var(--mn-radius)
               / 18% 18% var(--mn-radius) var(--mn-radius);

  /* The arch eats vertical space, so the content clears it. */
  padding: clamp(3.75rem, 13vw, 5.5rem) clamp(1.6rem, 6vw, 3.25rem) clamp(2.75rem, 6vw, 3.5rem);
  text-align: center;
}

/* The seal at the crown of the arch — the signature element. */
.mn-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 13px;
  height: 13px;
  border-radius: 100px;
  background: var(--mn-seal);
  transform: translate(-50%, -50%);
}

/* ---------- words ---------- */

.mn-card .section-label { margin-bottom: 1.1rem; }

.mn-title {
  font-size: clamp(2.1rem, 6.4vw, 3.15rem);
  line-height: 1.06;          /* large type takes tighter leading than body */
  margin: 0;
}

/* main.css already sets <em> to Cormorant italic; the color is the accent the
   rest of the site gives an emphasized phrase (see .intro-text h2 em).
   nowrap keeps "this week." whole: without it the line broke between the two
   words, stranding "this" at the end of one line and "week." alone on the next
   and splitting the one phrase the headline is built around. */
.mn-title em {
  color: var(--blush-deep);
  white-space: nowrap;
}

/* Decorative separator, not a control boundary, so --blush is correct here. */
.mn-rule {
  width: 54px;
  height: 1px;
  border: 0;
  background: var(--blush);
  margin: clamp(1.9rem, 4vw, 2.5rem) auto clamp(1.6rem, 3.5vw, 2.1rem);
}

.mn-lede {
  color: var(--ink-soft);
  max-width: 34ch;
  margin: 0 auto 1.1em;
  line-height: 1.75;
}

.mn-lede:last-child { margin-bottom: 0; }