/* Shared masthead: every page uses the same geometry. */
body>.preview{display:flex;height:27px;padding:4px 5.8%;align-items:center;justify-content:space-between;font:10px/19px Arial,sans-serif;letter-spacing:.08em;box-sizing:border-box}
body>.site-header{padding:0 5.8%;background:#17191a;color:#fff}
.site-header .top{height:94px;min-height:94px;padding:16px 0 0;gap:24px;position:relative;display:flex;align-items:center;border-bottom:1px solid #444}
.site-header .top .brand{font:bold 46px/1 Georgia,serif;letter-spacing:-3px;white-space:nowrap}
.site-header .top .tagline{display:block;max-width:125px;font:10px/1.45 Arial,sans-serif;letter-spacing:.15em}
.site-header .issue-link{margin-left:auto;font:12px/1.5 Arial,sans-serif;letter-spacing:.04em;white-space:nowrap}
.site-header .search-link{font:13px/1.5 Arial,sans-serif;white-space:nowrap}.site-header .search-link span{font-size:22px;margin-left:8px}
.site-header .top .header-languages{top:2px;right:0;padding:0;margin:0;gap:14px;font:10px/1.4 Arial,sans-serif;background:transparent}.site-header .header-languages a{padding:3px 0}
.site-header #menu{display:flex;margin:0;flex:none;width:44px;height:44px;padding:10px;border:1px solid transparent}
.site-header #nav{height:48px;min-height:48px;padding:0;display:flex;flex-direction:row;flex-wrap:nowrap;justify-content:space-between;align-items:stretch;gap:18px;font:12px/1.4 Arial,sans-serif}
.site-header #nav>a{display:flex;align-items:center;padding:0;position:relative;border:0;white-space:nowrap}.site-header #nav>a:after{content:none}.site-header #nav>a[aria-current='page']:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--red)}
@media(max-width:1000px){.site-header .top .tagline{display:none}.site-header .top{gap:18px}.site-header .top .brand{font-size:38px}.site-header #nav{gap:12px;font-size:11px}}
@media(max-width:760px){.site-header .issue-link{display:none}.site-header .search-link{margin-left:auto}.site-header #nav{gap:18px;overflow-x:auto;scrollbar-width:none;justify-content:flex-start}.site-header #nav::-webkit-scrollbar{display:none}}
@media(max-width:620px){body>.preview{height:25px;padding:3px 6%;font-size:9px}body>.preview>span{display:none}body>.site-header{padding:0 6%}.site-header .top{height:92px;min-height:92px;padding-top:19px;gap:15px}.site-header .top .brand{font-size:29px;letter-spacing:-2px}.site-header .top .tagline{display:none}.site-header .top .header-languages{top:3px;font-size:10px}.site-header #nav{display:none}.site-header .search-link{font-size:12px}.site-header .search-link span{display:none}.site-header #menu{width:36px;height:40px;padding:8px}}

/* Desktop masthead wordmark spans the left brand band. */
@media(min-width:1001px){.site-header .top .brand{font-size:clamp(54px,4.45vw,88px);letter-spacing:-.065em}}

/* Lift the enlarged brand lockup within the desktop masthead. */
@media(min-width:621px){.site-header .top .brand,.site-header .top .tagline{transform:translateY(-16px)}}

/* Align the old-style numerals with the MEN’S wordmark. */
.site-header .top .brand b{position:relative;top:-.16em}

/* Archive and language links now sit in the red top strip. */
body>.preview{height:34px;min-height:34px;padding:0 5.8%;display:flex;justify-content:flex-end;align-items:center;box-sizing:border-box;letter-spacing:0}
body>.preview .preview-tools{display:flex;align-items:center;justify-content:flex-end;gap:20px;margin-left:auto}
body>.preview .header-archive-link{position:static;top:auto;right:auto;display:block;color:#fff;text-decoration:none;font:bold 14px/1.4 Arial,sans-serif;padding:1px 0;min-height:0;border-bottom:1px solid #fff}
body>.preview .header-languages{position:static;top:auto;right:auto;display:flex;align-items:center;justify-content:flex-end;gap:14px;list-style:none;margin:0;padding:0;background:transparent;color:#fff;font:bold 14px/1.4 Arial,sans-serif}
body>.preview .header-languages li{margin:0;padding:0}
body>.preview .header-languages a{display:block;min-width:24px;padding:0 2px;color:#fff;text-align:center;text-transform:uppercase;text-decoration:none}
body>.preview .header-languages .current-lang a{border-bottom:2px solid #fff}
.site-header .top{height:94px;min-height:94px;padding:0}
.site-header .top .brand,.site-header .top .tagline{transform:none}
@media(max-width:1000px){.site-header .top{height:94px;min-height:94px;padding:0}}
@media(max-width:620px){body>.preview{height:34px;min-height:34px;padding:0 6%}.preview .preview-tools{gap:11px}.preview .header-archive-link{font-size:12px}.preview .header-languages{gap:6px;font-size:12px}.preview .header-languages a{min-width:20px}.site-header .top{height:92px;min-height:92px;padding:0}}

/* Center the MEN’S 404 wordmark in the black masthead row. */
.site-header .brand-lockup{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:24px;white-space:nowrap}
.site-header .brand-lockup .brand{font-size:clamp(54px,4.45vw,88px);letter-spacing:-.065em;transform:none}
.site-header .brand-lockup .tagline{display:block;transform:none}
@media(max-width:1000px){.site-header .brand-lockup{gap:0}.site-header .brand-lockup .brand{font-size:38px}.site-header .brand-lockup .tagline{display:none}}
@media(max-width:620px){.site-header .brand-lockup .brand{font-size:29px;letter-spacing:-2px}}

/* Align the issue and a larger search control with the tagline row. */
@media(min-width:761px){
  .site-header .top .issue-link{position:absolute;right:148px;top:calc(50% - 11px);transform:translateY(-50%);margin:0;font-size:15px}
  .site-header .top .search-link{position:absolute;right:0;top:calc(50% - 11px);transform:translateY(-50%);display:flex;align-items:center;gap:8px;padding:9px 13px;border:1px solid rgba(255,255,255,.55);font-size:20px;line-height:1.2}
  .site-header .top .search-link span{font-size:30px;margin:0;line-height:1}
}
@media(max-width:760px){
  .site-header .top .search-link{font-size:17px;padding:7px 10px;border:1px solid rgba(255,255,255,.45)}
  .site-header .top .search-link span{display:inline;font-size:24px;margin-left:4px}
}
@media(max-width:420px){.site-header .top .search-link{font-size:14px;padding:6px 7px}.site-header .top .search-link span{font-size:20px}}
@media(min-width:761px) and (max-width:1200px){
  .site-header .top .issue-link,.site-header .top .search-link{position:static;top:auto;right:auto;transform:none}
  .site-header .top .issue-link{margin-left:auto;font-size:13px}
  .site-header .top .search-link{display:flex;align-items:center;gap:6px;padding:7px 9px;font-size:17px}
  .site-header .top .search-link span{font-size:25px;margin:0}
}
/* Center the issue and search against the tagline baseline in the masthead. */
@media(min-width:1201px){
  .site-header .top .issue-link,.site-header .top .search-link{top:calc(50% + 3px)}
}

/* Put the current issue at the left of the red utility strip. */
body>.preview{justify-content:space-between;gap:16px}
body>.preview .preview-issue-link{display:block;flex:0 1 auto;min-width:0;color:#fff;text-decoration:none;font:bold 14px/1.4 Arial,sans-serif;white-space:nowrap}
body>.preview .preview-tools{flex:0 0 auto;margin-left:auto}
@media(max-width:620px){body>.preview{gap:8px}body>.preview .preview-issue-link{font-size:11px}.preview .preview-tools{gap:8px}.preview .header-archive-link{font-size:11px}.preview .header-languages{gap:4px;font-size:11px}.preview .header-languages a{min-width:18px}}

/* Keep the menu at the left edge while the wordmark stays centered. */
.site-header .top>#menu{position:absolute;left:0;top:50%;transform:translateY(-50%)}
.site-header .brand-lockup #menu{position:static;transform:none}
@media(min-width:761px){.site-header .top>.search-link{position:absolute;right:0;top:50%;transform:translateY(-50%);margin:0}}
.site-header .top>#menu{top:calc(50% - 18px)}

/* Expand search below the masthead without navigating until a query is submitted. */
.site-header .top .search-link{cursor:pointer;color:#fff;background:transparent;font-family:Arial,sans-serif}
.site-header .header-search-form[hidden]{display:none!important}
.site-header .header-search-form:not([hidden]){display:flex;align-items:center;justify-content:flex-end;gap:12px;min-height:68px;padding:10px 0 14px;box-sizing:border-box;border-bottom:1px solid #444}
.site-header .header-search-form input{width:min(100%,560px);height:48px;padding:0 16px;border:1px solid #888;background:#f7f7f4;color:#17191a;font:18px Arial,sans-serif;box-sizing:border-box}
.site-header .header-search-form button{height:48px;min-width:60px;border:0;background:#c92332;color:#fff;font:30px/1 Arial,sans-serif;cursor:pointer}
@media(max-width:620px){.site-header .header-search-form:not([hidden]){min-height:58px;padding:8px 0 10px;gap:8px}.site-header .header-search-form input{height:42px;font-size:16px;padding:0 10px}.site-header .header-search-form button{height:42px;min-width:48px;font-size:26px}}

/* Move the tagline to the left of the centered wordmark on wide screens. */
@media(min-width:1201px){.site-header .brand-lockup .tagline{position:absolute;right:calc(100% + 210px);top:calc(50% + 3px);transform:translateY(-50%);max-width:240px;white-space:nowrap}}
@media(min-width:1201px){.site-header .brand-lockup .tagline{right:calc(100% + 340px)}}

/* Bring the menu back beside the centered wordmark and tuck the tagline next to it. */
.site-header .brand-lockup #menu{position:absolute;left:auto;right:calc(100% + 20px);top:50%;transform:translateY(-50%)}
@media(min-width:1201px){.site-header .brand-lockup .tagline{right:calc(100% + 72px)}}

/* Align the hamburger and tagline as one left-side group at the logo's center line. */
.site-header .tagline-menu{position:absolute;left:0;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:12px;white-space:nowrap}
.site-header .tagline-menu .tagline{display:block;max-width:none;font:10px/1.45 Arial,sans-serif;letter-spacing:.15em}
.site-header .tagline-menu #menu{position:static;left:auto;right:auto;top:auto;transform:none}
@media(max-width:1000px){.site-header .tagline-menu .tagline{display:none}}

@media(max-width:620px){
 .site-header .top>#search-toggle{position:absolute;right:0;top:50%;transform:translateY(-50%);margin:0;width:44px;height:44px;min-width:44px;padding:8px;border:0;background:transparent;font-size:0}
 .site-header .top>#search-toggle span{display:inline!important;margin:0;font-size:30px;line-height:1}
}

/* Keep the issue label and all utilities on one vertically centered mobile strip. */
@media(max-width:620px){
 body>.preview{height:34px;min-height:34px;display:flex!important;flex-flow:row nowrap;justify-content:space-between;align-items:center;gap:8px;padding:0 12px;box-sizing:border-box;letter-spacing:0;overflow:hidden}
 body>.preview .preview-issue-link{display:block;flex:0 1 auto;min-width:0;max-width:45%;margin:0 auto 0 0;padding:0;font-size:10px;line-height:34px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:center}
 body>.preview .preview-tools{display:flex!important;flex:0 0 auto;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:clamp(5px,1.5vw,9px);width:auto;min-width:0;min-height:34px;margin:0 0 0 auto;padding:0;line-height:1}
 body>.preview .m404-favorites-open,body>.preview .header-archive-link{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:28px;margin:0;padding:0;font:bold 10px/1.2 Arial,sans-serif;white-space:nowrap}
 body>.preview .m404-favorites-open::before{font-size:13px}
 body>.preview .header-languages{display:flex;flex:0 0 auto;flex-wrap:nowrap;align-items:center;gap:2px;margin:0;padding:0;font:bold 10px/1.2 Arial,sans-serif;white-space:nowrap}
 body>.preview .header-languages a{display:flex;align-items:center;justify-content:center;min-width:18px;min-height:28px;margin:0;padding:0 1px;box-sizing:border-box;white-space:nowrap}
 body>.preview .header-languages .pll-switcher-label{display:inline}
}