/* letter column */
.letter{position:relative;z-index:1;max-width:680px;margin:0 auto;padding:44px 22px 56px}
@media(min-width:768px){.letter{padding:64px 24px 72px}}

/* letterhead */
.letterhead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;min-height:44px}
.brand-mark{width:40px;height:40px;flex:none}
.brand .wm{font-size:31px}
.brand small{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.32em;color:var(--ink-faint);margin-top:4px;font-weight:400}
.head-meta{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink-faint);text-align:right;line-height:2;padding-top:6px}
.head-rule{border:none;border-top:1px solid var(--ink);border-bottom:3px double var(--ink);height:4px;margin:22px 0 0}

/* stamp + postmark */
.stamp-zone{position:relative;display:flex;justify-content:flex-end;margin-top:30px;min-height:104px}
.stamp{
  width:82px;height:100px;background:var(--paper-soft);
  border:1.5px dashed rgba(29,27,22,.38);
  outline:5px solid var(--paper-soft);
  box-shadow:0 0 0 6.5px var(--paper),0 0 0 7.5px rgba(29,27,22,.14);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  transform:rotate(2.5deg);
  transition:transform .45s ease;
}
.stamp:hover{transform:rotate(.5deg) scale(1.04)}
.stamp svg{width:40px;height:40px}
.stamp span{font-family:var(--mono);font-size:7px;letter-spacing:.16em;color:var(--ink-faint);text-align:center}
.postmark{
  position:absolute;right:64px;top:16px;width:96px;height:96px;border-radius:50%;
  border:1.5px solid rgba(29,27,22,.42);
  display:flex;align-items:center;justify-content:center;
  transform:rotate(-11deg);opacity:.5;pointer-events:none;
}
.postmark::after{content:"";position:absolute;inset:5px;border-radius:50%;border:1px solid rgba(29,27,22,.35)}
.postmark svg.ring{position:absolute;inset:0;width:100%;height:100%;animation:ringSpin 48s linear infinite;transform-origin:50% 50%}
@keyframes ringSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
.postmark svg.ring text{font-family:var(--mono);font-size:9px;letter-spacing:.18em;fill:var(--ink)}
.postmark .pm-core{font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--ink);text-align:center;line-height:1.7}
