/* Site identity is shared even when an article has a dedicated layout. */
.masthead{display:flex;justify-content:flex-start;align-items:center;padding:16px 0 14px}
.masthead .brand{display:inline-flex;align-items:center;justify-content:flex-start;gap:10px;max-width:100%;min-height:44px;font-family:var(--serif);font-weight:400;font-size:1.9rem;letter-spacing:-.045em;line-height:1.1;text-decoration:none}
.brand .brand-name{order:1;min-width:0;overflow-wrap:anywhere}
.brand .brand-mark{display:block;order:2;width:25px;height:30px;max-width:25px;flex:0 0 25px;color:var(--plum)}
.homepage .masthead{padding:25px 0 23px}
.homepage .brand{font-size:clamp(2.3rem,5.2vw,4.3rem);gap:15px}
.homepage .brand .brand-mark{width:40px;height:48px;max-width:40px;flex-basis:40px}
.footerinner{align-items:center;gap:28px}
.footer-brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);font-family:var(--serif);font-size:1.7rem;line-height:1.2;letter-spacing:-.03em;min-height:44px;text-decoration:none}
.footer-brand:hover{text-decoration:none;color:var(--plum)}
.footer-brand .brand-mark{display:block;order:0;width:27px;height:33px;max-width:27px;flex:0 0 27px;color:var(--plum)}
.footerlinks{align-items:center;flex-wrap:wrap}
@media(max-width:600px){.masthead{padding:12px 0 10px}.masthead .brand{font-size:1.65rem;gap:8px}.brand .brand-mark{width:22px;height:27px;max-width:22px;flex-basis:22px}.homepage .masthead{padding:22px 0 18px}.homepage .brand{font-size:2.3rem;gap:10px}.homepage .brand .brand-mark{width:30px;height:36px;max-width:30px;flex-basis:30px}.footer-brand{font-size:1.55rem}.footerlinks{gap:16px}}

/* One consistent identity size across the publication. */
.masthead{padding:25px 0 23px}
.masthead .brand{font-size:clamp(2.3rem,5.2vw,4.3rem);gap:15px}
.brand .brand-mark{width:40px;height:48px;max-width:40px;flex-basis:40px}
.nav{border-bottom-color:var(--line)}
.nav a{position:relative;min-height:54px;font-weight:500}
.nav a:hover{color:var(--plum);text-decoration:none}
.nav a[aria-current=page]{text-decoration:none}
.nav a[aria-current=page]:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--plum)}
.nav>a:last-child{gap:8px;color:var(--plum)}
footer{margin-top:54px;padding-top:32px}
.footerlinks a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:600px){.masthead,.homepage .masthead{padding:22px 0 18px}.masthead .brand,.homepage .brand{font-size:2.3rem;gap:10px}.brand .brand-mark{width:30px;height:36px;max-width:30px;flex-basis:30px}.navlinks{gap:18px}.nav a{font-size:14px}.footerinner{display:flex;flex-direction:column;align-items:flex-start;gap:16px}.footerlinks{margin:0}}

/* Keep every destination visible without squeezing the mobile navigation. */
@media(max-width:650px){.nav{display:block}.navlinks{gap:0;justify-content:space-between;flex-wrap:wrap}.navlinks a{font-size:13px;min-height:46px;padding:0 5px}.navlinks a:first-child{padding-left:0}.nav>a:last-child{display:flex;justify-content:flex-end;min-height:40px;border-top:1px solid var(--line)}.nav>a:last-child[aria-current=page]:after{left:auto;width:60px}}

/* A gentle increase in navigation size with room above and below. */
.navlinks{gap:34px}
.nav a{font-size:16px;min-height:58px;line-height:1.4}
@media(max-width:650px){.navlinks{gap:0}.navlinks a{font-size:14px;min-height:50px;padding:0 4px}.nav>a:last-child{font-size:14px;min-height:42px}}
