.bhead{background:var(--navy);color:var(--cream)}
.bhead nav{display:flex;justify-content:space-between;align-items:center;padding:26px 56px;font-size:13px;letter-spacing:.18em;text-transform:uppercase}
.bhead .mark{font:600 15px 'Cormorant Garamond',serif;letter-spacing:.32em}
.bhead .links a{margin-left:34px;opacity:.6;transition:opacity .2s}
.bhead .links a:hover,.bhead .links a[aria-current]{opacity:1}
.bhead a:focus-visible,.bmain a:focus-visible,footer a:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
.bmain{padding:110px 0 130px}
.bmain .wrap{max-width:900px}
.bmain h1{font-size:72px;margin:18px 0 22px}
.bmain .lede{color:var(--muted);font-size:17px;line-height:1.75;max-width:520px}
.cards{list-style:none;margin-top:64px;border-top:1px solid var(--navy)}
.cards li{border-bottom:1px solid rgba(20,41,69,.2)}
.cards a{display:grid;grid-template-columns:150px 1fr auto;gap:28px;align-items:baseline;padding:34px 0;transition:padding .3s ease}
.cards a:hover{padding-left:12px}
.cards .eyebrow{white-space:nowrap}
.cards h2{font-size:36px;margin-bottom:10px;transition:color .2s}
.cards a:hover h2{color:#5d7c76}
.cards p{color:var(--muted);font-size:16px;line-height:1.7}
.cards .go{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;opacity:.55;transition:opacity .2s}
.cards a:hover .go{opacity:1}
.post .wrap{max-width:760px}
.post h1{font-size:64px}
.post .body p{color:var(--muted);font-size:18px;line-height:1.8;margin-bottom:22px}
.post .body{margin-top:44px;padding-top:40px;border-top:1px solid var(--navy)}
.back{display:inline-block;margin-top:34px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:500;border-bottom:1px solid rgba(20,41,69,.3);padding-bottom:4px;transition:border-color .2s}
.back:hover{border-color:var(--navy)}
.joinline{font:italic 500 24px 'Cormorant Garamond',serif;margin-bottom:0;padding-top:46px}
.joinline a{border-bottom:1px solid rgba(243,235,221,.35);transition:border-color .2s}
.joinline a:hover{border-color:var(--cream)}
footer .joinline+.top{margin-top:30px}
@media(max-width:900px){
 .bhead nav{padding:20px 22px}
 .bmain{padding:70px 0 90px}
 .bmain h1,.post h1{font-size:46px}
 .cards a{grid-template-columns:1fr;gap:8px}
 .cards h2{font-size:30px}
}
@media(max-width:600px){.bhead .links a{margin-left:16px;font-size:11px;letter-spacing:.12em}.bhead .links a:not(.blog){display:none}}
