/* Same menu geometry on the homepage and inner pages, with room for weather. */
.site-header{position:relative;z-index:20}
.site-header .header-inner{position:relative;width:min(1160px,calc(100% - 80px));display:grid;grid-template-columns:340px minmax(180px,1fr) auto;align-items:center;gap:16px;min-height:150px;height:auto;padding:20px 0}
.site-header .brand{display:flex;align-items:center;grid-column:1;grid-row:1;gap:12px;width:340px;max-width:100%;height:auto;min-height:0;text-decoration:none}
.site-header .brand .animated-logo{width:110px;height:110px;flex-shrink:0}
.site-header .brand .site-title{display:block;font:700 26px/1.1 BarlowCondensed,Arial,sans-serif;letter-spacing:.005em;text-transform:uppercase;margin:0;white-space:nowrap;text-align:left}
.site-header .brand-o{font:inherit;letter-spacing:-.055em}
.site-header .menu-button{display:none;font:700 15px/1.5 Manrope,Arial,sans-serif}
.site-header #navigation{grid-column:3;grid-row:1;display:flex;flex-direction:row;align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:16px;width:auto;margin:0;padding:0;position:static}
.site-header #navigation>a{display:flex;align-items:center;min-height:44px;padding:0;border:0;font:700 15px/1.5 Manrope,Arial,sans-serif;white-space:nowrap;color:white}
.site-header #navigation>a[aria-current=page]{text-decoration:underline;text-underline-offset:7px}
.site-header .mountain-weather{grid-column:2;grid-row:1;min-width:0}
.site-header .weather-link{grid-template-columns:56px 32px 82px;column-gap:6px}
.site-header .weather-icon{width:56px;height:64px}
.site-header .weather-temperature{font-size:24px}
.site-header .weather-condition{font-size:11px;max-width:82px;overflow-wrap:normal}
.site-header .header-back{display:none}
.notice{display:flex;align-items:center;justify-content:center;min-height:34px;padding:7px 16px;font:700 12px/20px Manrope,Arial,sans-serif}
.route-map-page .map-notice{flex:none;background:white;color:#183341;text-align:center;font:700 12px/20px Manrope,Arial,sans-serif;padding:9px 18px}
.route-map-page .map-notice a{display:inline-flex;align-items:center;gap:12px}
.network-hero h1{font-kerning:normal;letter-spacing:-.02em}
.network-hero h1 .trail-heading-o{letter-spacing:-.07em}

@media(min-width:761px) and (max-width:1240px){
 .site-header .header-inner{width:calc(100% - 56px);grid-template-columns:minmax(0,1fr) 200px auto;gap:22px;min-height:135px;padding-block:20px}
 .site-header .brand{width:320px}
 .site-header .brand .animated-logo{width:95px;height:95px}
 .site-header .brand .site-title{font-size:24px}
 .site-header .menu-button{display:flex;grid-column:3;grid-row:1;align-items:center;gap:12px;min-height:44px;padding:8px 0;white-space:nowrap}
 .site-header #navigation{display:none;position:absolute;top:100%;left:0;right:0;grid-column:auto;grid-row:auto;flex-direction:column;align-items:stretch;gap:0;width:100%;margin:0;padding:12px 22px;background:#6da0c9;z-index:2100}
 .site-header #navigation.is-open{display:flex}
 .site-header #navigation>a{min-height:48px;padding:10px 0;border-top:1px solid #ffffff40}
 .site-header .weather-source{position:absolute;top:3px;right:0;left:auto;margin:0;white-space:nowrap;font-size:8px;color:#ffffffe6}
}
@media(max-width:760px){
 .notice{min-height:28px;padding:5px 12px;font-size:10px;line-height:18px}
 .site-header .header-inner{width:calc(100% - 40px);grid-template-columns:minmax(0,1fr) auto;gap:0;min-height:0;padding:14px 0 8px}
 .site-header .brand{width:auto;gap:12px}
 .site-header .brand .animated-logo{width:80px;height:80px}
 .site-header .brand .site-title{font-size:22px}
 .site-header .menu-button{display:flex;grid-column:2;grid-row:1;align-items:center;gap:12px;min-height:44px;padding:8px 0;white-space:nowrap}
 .site-header .menu-button span{line-height:1}
 .site-header #navigation{display:none;position:static;grid-column:1/-1;grid-row:2;width:100%;flex-direction:column;align-items:stretch;gap:0;padding:16px 0 0;background:transparent}
 .site-header #navigation.is-open{display:flex}
 .site-header #navigation>a{min-height:48px;padding:12px 0;border-top:1px solid #ffffff40}
 .site-header .mountain-weather{position:absolute;top:0;right:0;grid-column:auto;grid-row:auto;width:auto;max-width:calc(100% - 92px);margin:0;padding:0}
 .site-header .weather-link{grid-template-columns:none}
 .site-header .weather-link,.site-header .mountain-weather:not([data-state=ready]) .weather-link{min-height:22px}
 .site-header .weather-icon{width:20px;height:20px}
 .site-header .weather-temperature{font-size:16px}
 .site-header .weather-condition{font-size:11px;max-width:95px}
 .site-header .weather-summary{min-height:0}
 .site-header .mountain-weather:not([data-state=ready]) .weather-summary{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
@media(max-width:620px){
 .site-header .header-inner{width:calc(100% - 32px);min-height:0}
 .site-header .brand .animated-logo{width:70px;height:70px}
 .site-header .brand .site-title{font-size:19px}
 .site-header .mountain-weather{max-width:calc(100% - 82px)}
}
@media(max-width:360px){
 .site-header .brand .animated-logo{width:58px;height:58px}
 .site-header .brand .site-title{font-size:17px}
 .site-header .header-inner{min-height:0;padding-top:22px}
 .site-header .mountain-weather{max-width:calc(100% - 70px)}
 .site-header .weather-link{gap:5px}
 .site-header .weather-wind{padding-left:5px;margin-left:1px}
}
/* Keep the expressly minimal mobile map header and its return button. */
@media(max-width:700px){
 .route-map-page .map-notice{display:none}
 .route-map-page .map-header .header-inner{width:100%;display:flex;flex-wrap:nowrap;min-height:52px;height:52px;padding:4px 14px;gap:8px}
 .route-map-page .map-header .brand{width:auto;gap:8px}
 .route-map-page .map-header .brand .animated-logo{width:30px;height:30px}
 .route-map-page .map-header .brand .site-title{font:700 13px/1.02 BarlowCondensed,Arial,sans-serif;letter-spacing:.1px}
 .route-map-page .map-header .menu-button,.route-map-page .map-header #navigation{display:none!important}
 .route-map-page .map-header .header-back{display:flex!important;align-items:center;justify-content:center;min-height:44px;margin-left:auto;padding:8px 10px;border:1px solid #ffffff80;border-radius:6px;background:#ffffff15;color:white;font:700 12px/1.4 Manrope,Arial,sans-serif;white-space:nowrap}
}