/* ==========================================================================
   Mocha — memorial page
   Quiet, photo-led. Builds on site.css tokens; adds nothing new to the palette.
   ========================================================================== */

.m-hero{
  position:relative;background:var(--gold-soft);
  padding:clamp(44px,8vw,86px) 0 clamp(36px,6vw,64px);
  border-bottom:1px solid var(--line);text-align:center;
}
.m-hero__name{
  font-family:var(--serif);font-size:clamp(46px,10vw,96px);font-weight:600;
  line-height:1;letter-spacing:-.02em;margin:0 0 14px;
}
.m-hero__dates{
  font-family:var(--sans);font-size:12.5px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--gold-dark);margin:0;
}
.m-hero__line{
  width:52px;height:2px;background:var(--gold-deep);border:0;margin:24px auto;
}
.m-hero__lede{
  font-size:clamp(18px,2.4vw,22px);line-height:1.6;color:var(--ink-mid);
  max-width:30em;margin:0 auto;font-style:italic;
}

.m-portrait{max-width:760px;margin:0 auto clamp(30px,5vw,54px);padding:0 var(--gut)}
.m-portrait img{width:100%;border-radius:var(--r-lg);box-shadow:var(--shadow-2)}
.m-portrait figcaption{
  font-family:var(--sans);font-size:12.5px;color:var(--ink-faint);
  text-align:center;margin-top:12px;
}

.m-body{max-width:640px;margin:0 auto;padding:0 var(--gut)}
.m-body p{font-size:18.5px;line-height:1.82;margin:0 0 1.15em}
html[data-lang="zh"] .m-body p{font-size:17.5px;line-height:1.95}

.m-part{
  font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:.22em;
  text-transform:uppercase;color:var(--gold-dark);
  margin:clamp(40px,6vw,66px) 0 18px;display:flex;align-items:center;gap:14px;
}
.m-part::after{content:"";flex:1;height:1px;background:var(--line)}

/* a photo dropped into the reading column */
.m-figure{margin:clamp(30px,5vw,46px) 0}
.m-figure img{width:100%;border-radius:var(--r);box-shadow:var(--shadow-1)}
.m-figure figcaption{
  font-family:var(--sans);font-size:12.5px;color:var(--ink-faint);margin-top:10px;
}

/* scripture, set apart */
.m-verse{
  background:var(--gold-soft);border-left:4px solid var(--gold-deep);
  border-radius:0 var(--r) var(--r) 0;padding:20px 24px;margin:26px 0;
  font-size:17px;line-height:1.75;
}
.m-verse p{font-size:inherit;line-height:inherit;margin:0 0 .7em}
.m-verse p:last-of-type{margin-bottom:0}
.m-verse cite{
  display:block;font-style:normal;font-family:var(--sans);font-size:11px;
  font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold-dark);margin-top:12px;
}

/* the weight measurements, as a small run of numbers */
.m-weights{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;justify-content:center;
  margin:26px 0;font-family:var(--sans);font-size:13px;font-weight:600;
}
.m-weights span{
  background:var(--white);border:1px solid var(--line);border-radius:999px;
  padding:5px 13px;color:var(--ink-mid);
}
.m-weights span:last-child{background:var(--gold);border-color:var(--gold-deep);color:var(--ink)}
.m-weights i{color:var(--ink-faint);font-style:normal}

/* the closing line */
.m-close{
  text-align:center;padding:clamp(42px,7vw,72px) var(--gut) 0;
  max-width:34em;margin:0 auto;
}
.m-close p{font-family:var(--serif);font-size:clamp(19px,2.6vw,24px);
  line-height:1.6;color:var(--ink-mid);font-style:italic}

.m-back{text-align:center;padding:clamp(34px,5vw,54px) var(--gut) 0}
