/* One set of brand dimensions for the homepage and the founder's story. */
/* No rule under the masthead (2026-09-25, the founder: "the weird line between
   the logo and our mission statement"): the headline is the first thing on the
   page, and a hairline above it is a lid on it. */
.mast.marketing-mast { max-width:1240px; margin-inline:auto; padding:0 40px; min-height:96px; gap:24px; flex-wrap:nowrap; }
.marketing-mast .brand { min-height:44px; gap:14px; flex-shrink:0; }
.marketing-mast .brand .mark { width:38px; height:38px; flex:0 0 38px; margin-right:2px; }
.marketing-mast .brand b { font:500 27px/1 "Fraunces Brand",var(--serif); font-variation-settings:"opsz" 144; letter-spacing:0; white-space:nowrap; }
.marketing-nav { display:flex; align-items:center; gap:30px; font:15px/1.4 var(--sans); letter-spacing:0; }
.marketing-nav a { display:inline-flex; align-items:center; gap:5px; min-height:44px; padding:12px 0; text-decoration:none; white-space:nowrap; }
.marketing-nav a:hover { color:var(--oxblood); }
.marketing-nav [aria-current=page] { text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:6px; }
@media(min-width:1450px) { .mast.marketing-mast { max-width:1360px; } }
@media(max-width:900px) { .mast.marketing-mast { padding-inline:24px; } }
@media(max-width:650px) {
  .mast.marketing-mast { min-height:76px; padding-inline:20px; gap:12px; }
  .marketing-mast .brand { gap:8px; }
  .marketing-mast .brand .mark { width:29px; height:29px; flex-basis:29px; }
  .marketing-mast .brand b { font-size:21px; }
  .marketing-nav { gap:14px; font-size:12px; }
  .marketing-nav a span { display:none; }
}