/* Match the main site name to The Punch heading on every public page. */
:root{--site-title-size:clamp(34px,4.3vw,54px)}
header{flex-wrap:wrap}
header a.brand{font-family:Georgia,serif;font-size:var(--site-title-size);font-weight:400;line-height:1.15;letter-spacing:-1px;white-space:nowrap;flex-shrink:0;max-width:100%}
header .header-actions{margin-left:auto}
.title-lockup h1{font-size:var(--site-title-size)}
@media(min-width:701px) and (max-width:1000px){:root{--site-title-size:34px}}
@media(max-width:600px){:root{--site-title-size:clamp(28px,7.7vw,38px)}}

/* Plain Subscribe link; one compact navigation row below the title on phones. */
header a.header-subscribe,header a.header-subscribe:hover{background:transparent;color:#c7aa76;padding:0}
@media(max-width:650px){
 header{gap:18px;padding-bottom:12px}
 header a.brand{flex-basis:100%}
 header div.header-actions{width:100%;margin-left:0;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:clamp(4px,1.4vw,9px);flex-wrap:nowrap}
 header .header-actions nav{display:contents}
 header .header-actions nav a,header a.header-subscribe{font:clamp(12px,3.3vw,14px)/1.4 Arial,sans-serif;letter-spacing:0;white-space:nowrap;margin:0!important;min-height:32px;display:inline-flex;align-items:center;padding:0;border-bottom:0}
 header a.header-subscribe{font-weight:400}
}

/* Match the About page's gold navigation across the entire site. */
header .header-actions nav a,header .header-actions nav a:hover,header .header-actions nav a[aria-current]{color:#c7aa76}

/* Desktop visitors see all five links together; owner utilities stay below. */
@media(min-width:651px){
 header div.header-actions{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:24px;row-gap:14px}
 header .header-actions nav{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:24px}
 header .header-actions nav a{margin:0}
 header .header-actions .owner-shortcuts{grid-column:1 / -1;justify-self:end}
}

/* Subscribe shares the navigation typography at every screen size. */
header .header-actions nav a,header .header-actions a.header-subscribe{font-family:Arial,Helvetica,sans-serif;font-size:12px;font-weight:400;line-height:1.4;letter-spacing:0}
@media(max-width:650px){header .header-actions nav a,header .header-actions a.header-subscribe{font-size:clamp(12px,3.3vw,14px)}}

/* One masthead width, inset and fine gold rule throughout public pages. */
body>header{max-width:1440px;margin-inline:auto;padding:30px min(5vw,72px);border-bottom:1px solid #65563e;gap:24px}
@media(max-width:650px){body>header{padding:24px 6% 12px;gap:18px}}