/* ============================================================
   /sawmill — "The May Morn Estate Sawmill"
   The history behind the Maymorn name, linked from the Maymorn spirit.
   Layered on top of v5.css, so it only defines what that file doesn't
   already give us (tokens, buttons, .v5-kicker, .v5-rule, nav, footer).
   ============================================================ */

.sm-page {
  padding: 4.5rem 0 5.5rem;
  border-top: 1px solid var(--line);
}

/* ---- intro ---- */
.sm-intro {
  max-width: 46rem;
  margin: 0 auto;
  text-align: center;
}
.sm-title {
  font-family: var(--font-head);
  font-weight: 500;
  font-size: clamp(1.9rem, 3.6vw, 2.8rem);
  line-height: 1.14;
  margin: 0.4rem 0 1.1rem;
  text-wrap: balance;
}
.sm-title-line {
  display: block;
  font-style: italic;
  font-weight: 400;
  color: var(--gold-2);
}
.sm-lead {
  color: var(--ink);
  font-size: clamp(1.02rem, 1.4vw, 1.14rem);
  margin: 0 auto;
  max-width: 36rem;
  text-wrap: balance;
}

/* ---- figures ----------------------------------------------------
   These are archive photographs, so they are framed rather than bled: a
   hairline and a dark bed keep them reading as documents of a place, not
   as decorative art direction. */
.sm-fig {
  margin: 2.5rem auto;
  max-width: 60rem;
}
.sm-fig img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--line);
  background: #000;
}
.sm-fig figcaption {
  margin-top: 0.75rem;
  font-size: 0.86rem;
  line-height: 1.5;
  color: var(--muted);
  text-align: center;
  text-wrap: balance;
}
/* The lead photograph is the one that shows the mill working — give it the
   full column and a little more room to breathe. */
.sm-fig-lead { margin-top: 2.75rem; }

/* The chimney photograph is a tall portrait. It is shown whole — Ross asked
   that it never be cropped or split, because the chimney is the thread of the
   story — so it is narrowed rather than trimmed to keep it from towering. */
.sm-fig-chimney { max-width: 34rem; }

/* ---- prose ---- */
.sm-prose {
  max-width: 42rem;
  margin: 0 auto;
}
.sm-prose p { color: var(--muted); margin: 0 0 1.15rem; }
.sm-prose p:last-child { margin-bottom: 0; }

.sm-drop { color: var(--ink) !important; }
.sm-drop::first-letter {
  float: left;
  font-family: var(--font-head);
  font-size: 3.4em;
  line-height: 0.8;
  padding: 0.04em 0.12em 0 0;
  color: var(--gold);
}

/* The line that closes the loop back to the name on the bottle. */
.sm-close {
  font-family: var(--font-head);
  font-style: italic;
  font-size: clamp(1.15rem, 2vw, 1.4rem);
  line-height: 1.35;
  color: var(--gold-2) !important;
  border-left: 2px solid var(--gold);
  padding-left: 1.15rem;
  margin-top: 1.9rem !important;
}

/* ---- outro ---- */
.sm-outro {
  max-width: 42rem;
  margin: 3.5rem auto 0;
  text-align: center;
}
.sm-outro-note {
  color: var(--muted);
  margin: 0 0 1.75rem;
  text-wrap: balance;
}
.sm-actions {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  justify-content: center;
}

/* ---- mobile ---- */
@media (max-width: 860px) {
  .sm-page { padding: 3rem 0 4rem; }
  .sm-fig { margin: 1.75rem auto; }
}