/* Quarterline Law: the rebrand's type marks and the parts bank knobs, set to this page's tokens.
   Loaded after the page's own styles. */

/* ── wordmark, set as type (no logo files) ─────────────────────────── */
.brand .mark{width:30px;height:30px;flex:none;overflow:visible}
.brand .mark rect{fill:none;stroke:var(--navy);stroke-width:1}
.brand .mark text{font-family:var(--serif);font-size:23px;fill:var(--navy)}
.brand .word{font-family:var(--serif);font-size:25px;line-height:1;letter-spacing:.005em;color:var(--ink-2);white-space:nowrap}
.brand .word i{font-style:italic;color:var(--navy)}
.mark--foot{display:grid;place-items:center;width:32px;height:32px;border:1px solid rgba(245,242,234,.6);border-radius:2px;
  font-family:var(--serif);font-size:24px;line-height:1;color:rgba(245,242,234,.92);padding-top:2px}
.seal .seal-ql{position:absolute;left:50%;top:50%;transform:translate(-50%,-46%);
  font-family:var(--serif);font-size:26px;line-height:1;color:var(--navy);letter-spacing:.02em}
@media (min-width:1081px) and (max-height:860px){.seal .seal-ql{font-size:20px}}
@media (max-width:760px){.seal .seal-ql{font-size:18px}}
@media (max-width:760px){.brand .word{font-size:21px}.brand .mark{width:26px;height:26px}}

/* ── the hero signature: where the portrait was, the solicitor signs ── */
.figure.sigmark{
  width:auto;margin:0;filter:none;align-self:center;
  display:flex;flex-direction:column;align-items:flex-start;gap:10px;
  padding-block:clamp(18px,2.6vh,34px);opacity:1;transform:none;animation:none;
}
.sig-name{font-family:var(--serif);font-style:italic;font-size:clamp(40px,3.4vw,58px);line-height:1;
  color:var(--navy);letter-spacing:-.01em;white-space:nowrap;transform:rotate(-2.5deg);transform-origin:left bottom;
  padding:0 .12em .06em 0}
.sig-rule{display:block;width:min(100%,250px);height:1px;background:var(--ink-2);opacity:.55}
.sig-cap{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--graphite)}
@media (max-width:1080px){.figure.sigmark{order:2;padding-block:4px 22px}}

/* the endorsement's affixed card holds the firm's initials instead of a photograph */
.affixed--type{display:grid;place-items:center;aspect-ratio:336/384;width:170px;box-sizing:border-box}
.affixed--type .af-mark{font-family:var(--serif);font-size:72px;line-height:1;color:var(--navy);margin-top:-30px;
  border-block:1px solid var(--rule);padding:14px 10px 6px}

/* ── char-sweep-reveal: the signature writes itself in, letter by letter ── */

/* ── line-letter-rise: register headings lift line by line ── */
/* (defaults: 24px rise, 50ms between lines, heavy no-bounce spring) */

/* ── bracket-spread-button: the quiet secondary actions get registration-mark corners ── */
.quiet.bsb{
  --bsb-ink:var(--graphite);--bsb-ink-hover:var(--navy);--bsb-bracket-color:var(--navy);
  --bsb-fill:rgba(46,70,110,.07);--bsb-arm:9px;--bsb-spread:6px;--bsb-pad:12px 16px;
  --bsb-font:500 11.5px/1.2 var(--mono);
  border-bottom:0;padding-bottom:12px;letter-spacing:.13em;
}

/* ── origin-flip-underline: nav, contact and footer links draw left to right ── */
.navlinks a.ofu::after{content:none}
.navlinks a.ofu{--ofu-color:var(--navy);--ofu-gap:5px;padding-bottom:5px}
.coords a.ofu{border-bottom:0;--ofu-base:var(--rule);--ofu-color:var(--navy);padding-bottom:3px}
.foot-links a.ofu{border-bottom:0;--ofu-color:rgba(245,242,234,.7)}

/* ── reading-bar: a hairline of navy fills along the top as the certificate is read ── */
.rb-bar{--rb-h:2px;--rb-color:var(--navy);--rb-track:transparent;--rb-z:60}

/* ── craft: headings were capped narrower than their column and broke into three lines ── */
@media (min-width:1081px){
  .body h2{max-width:none;text-wrap:balance}
  .endorse h2,.contact h2{max-width:none;text-wrap:balance}
  .station .d{font-size:12px}
  .stations{column-gap:10px}
}