/* attach-pinning --------------------------------------------------------*/

/* @group @a-attach-pinning */

[class*="a-attach-pinning"] {
position: fixed;
left: -999em;
}

/* @end @a-attach-pinning */

/* --------------------------------------------------------*/

/* @group @variables */

:root {
--grobal-head-height: 7.5rem;
--sticky-grobal-head-height: 6rem;
}

@media all and (max-width:47.9375em) {

:root {
--toggle-transform-width: 80vw;
}

[class*="a-nav-toggle"]:checked ~ [class*="o-mutual-header"],
[class*="a-nav-toggle"]:checked ~ main,
[class*="a-nav-toggle"]:checked ~ [class*="o-mutual-footer"],
[class*="a-nav-toggle"]:checked ~ [class*="a-nav-toggle-close"] {
--body-transition: translateX(calc(-1* var(--toggle-transform-width)));
}

[class*="m-mutual-nav"] {
--toggle-nav-transform: translateX(var(--toggle-transform-width));
}

[class*="a-nav-toggle"]:checked ~ [class*="m-mutual-nav"] {
--toggle-nav-transform: translateX(0);
}

}

/* @end @variables */

/* @group @mobile toggle */

@media all and (max-width: 47.9375em) {

[class*="a-nav-toggle"]:checked ~ [class*="o-mutual-header"],
main,
[class*="o-mutual-footer"],
[class*="a-nav-toggle-close"] {
transition: var(--transition);
transform: var(--body-transition);
}

}

/* @end @mobile toggle */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="o-mutual-header"] {
--mutual-header-grid-template-columns: 1fr .75rem auto;
--mutual-header-gap: .375rem .75rem;
}

@media all and (min-width: 48em) {

[class*="o-mutual-header"] {
--mutual-header-grid-template-columns: 11.25rem 1fr;
}

}

/* @end @variables */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="o-mutual-header"] {
--mutual-header-position: absolute;
--mutual-header-height: var(--grobal-head-height);
--mutual-header-padding: 0 var(--x-padding-right) 0 var(--x-padding-left);
--mutual-header-transform: translateY(0);
--transition-delay: 1s;
--mutual-header-backdrop-filter: blur(.125rem);
}

html:not([class*="is-fit-sticky"][class*="is-watch-nav"]) [class*="o-page-root"] [class*="o-mutual-header"] {
--mutual-header-background-image: linear-gradient(180deg, hsla(220, 5%, 20%, .75) 50%, hsla(0, 0%, 0%, 0) 100%);
--mutual-header-background-color: transparent;
--header-logo-img-filter: brightness(0) invert(1);
}

[class*="is-watch-nav"] [class*="o-mutual-header"] {
--mutual-header-opacity: 0;
--mutual-header-transform: translateY(-16rem);
}

[class*="is-fit-sticky"][class*="is-watch-nav"] [class*="o-mutual-header"] {
--mutual-header-position: fixed;
--mutual-header-height: var(--sticky-grobal-head-height);
--mutual-header-background-image: none;
--mutual-header-background-color: hsla(0, 0%, 100%, .9375);
--mutual-header-opacity: 1;
--mutual-header-transform: translateY(0);
--mutual-header-box-shadow: 0 .25rem 1.5rem 0 hsla(220, 20%, 50%, .125);
--header-logo-img-filter: none;
}

@media all and (max-width:47.9375em) {

[class*="a-nav-toggle"]:checked ~ [class*="o-mutual-header"] {
--mutual-header-transform: translateX(-15rem) translateY(0);
}

[class*="is-watch-nav"] [class*="a-nav-toggle"]:checked ~ [class*="o-mutual-header"] {
--mutual-header-transform: translateX(-15rem) translateY(-16rem);
}

[class*="is-fit-sticky"] [class*="a-nav-toggle"]:checked ~ [class*="o-mutual-header"] {
--mutual-header-transform: translateX(-15rem) translateY(0);
}

html:not([class*="is-fit-sticky"][class*="is-watch-nav"]) [class*="o-site-root"] [class*="o-mutual-header"] {
--mutual-header-position: absolute;
--header-logo-img-filter: brightness(0) invert(1);
}

}

@media print {

html:not([class*="is-fit-sticky"][class*="is-watch-nav"]) [class*="o-mutual-header"],
html:not([class*="is-fit-sticky"][class*="is-watch-nav"]) [class*="o-site-root"] [class*="o-mutual-header"] {
--mutual-header-position: absolute;
}

}

/* @end @variables */

/* @group @o-mutual-header */

[class*="o-mutual-header"] {
box-sizing: border-box;
position: var(--mutual-header-position);
z-index: 12;
top: 0;
right: 0;
left: 0;
display: grid;
justify-content: space-between;
align-items: center;
grid-template-columns: var(--mutual-header-grid-template-columns);
gap: var(--mutual-header-gap);
height: var(--mutual-header-height);
padding: var(--mutual-header-padding);
background-image: var(--mutual-header-background-image);
background-color: var(--mutual-header-background-color);
box-shadow: var(--mutual-header-box-shadow);
opacity: var(--mutual-header-opacity);
text-transform: uppercase;
transform: var(--mutual-header-transform);
transition: var(--transition);
-webkit-backdrop-filter: var(--mutual-header-backdrop-filter);
backdrop-filter: var(--mutual-header-backdrop-filter);
}

[class*="a-nav-toggle"] {
align-self: center;
grid-column: 3;
}

[class*="a-mutual-header-logo"] {
grid-column: 1;
}

/* @end @o-mutual-header */

/* --------------------------------------------------------*/

/* @group @variables */

[class*="a-mutual-header-logo"] {
--header-logo-img-height: 3.75rem;
}＝

[class*="is-fit-sticky"][class*="is-watch-nav"] [class*="o-mutual-header"] {
--header-logo-img-height: 2.25rem;
}

/* @end @variables */

/* @group @a-mutual-header-logo */

[class*="a-mutual-header-logo"] {
position: relative;
z-index: 3;
}

[class*="a-mutual-header-logo-img"],
[class*="a-mutual-header-logo-img"][height] {
width: auto;
height: var(--header-logo-img-height);
filter: var(--header-logo-img-filter);
}

/* @end @a-mutual-header-logo */

/* -------------------------------------------------------- */

/* @group @variables */

[class*="a-toggle-nav"] {
--toggle-link-color: var(--color-text);
--toggle-link-action-color: var(--color-text-action);
}

html:not([class*="is-fit-sticky"][class*="is-watch-nav"]) [class*="o-site-root"] [class*="a-toggle-nav"] {
--toggle-link-color: var(--color-white);
--toggle-link-action-color: var(--color-white-action);
}

[for="mutual-nav-toggle"]:checked ~ [class*="o-mutual-nav"] [class*="a-toggle-nav"] {
--toggle-link-action-background-color: var(--color-premier-action);
--toggle-link-action-color: var(--color-white);
}

/* @end @variables */

/* @group @a-toggle-nav */

[class*="a-toggle-nav"] {
position: relative;
align-self: center;
display: grid;
align-items: center;
grid-template-columns: 1fr .125rem 2.25rem;
font-size: .625rem;
line-height: 1.2;
text-transform: uppercase;
text-align: center;
cursor: pointer;
transition: var(--transition);
}

[class*="a-toggle-nav"] {
color: var(--toggle-link-color);
}

[class*="a-toggle-nav"]:hover,
[class*="a-toggle-nav"]:focus {
color: var(--toggle-link-action-color);
}

[class*="a-icon-nav-bar"] {
grid-column: 3;
grid-row: 1;
}

[class*="a-nav-bar-label"] {
grid-column: 1;
grid-row: 1;
}

/* @end @a-toggle-nav */

/* @group @variables */

:root {
--icon-nav-before-width: 2.25rem;
--icon-nav-after-width: 1.5rem;
--icon-nav-before-margin: -.75rem;
--icon-nav-after-margin: .75rem;
--icon-nav-opacity: 1;
}

[name*="mutual-nav-toggle"]:checked ~ [class*="o-mutual-header"] {
--icon-nav-before-margin: 0;
--icon-nav-after-margin: 0;
--icon-nav-opacity: 0;
--icon-nav-before-width: 1.5rem;
--icon-nav-after-width: 1.5rem;
--icon-nav-before-transform: rotate(45deg);
--icon-nav-after-transform: rotate(-45deg);
}

/* @end @variables */

/* @group @a-icon-nav-bar */

[class*="a-icon-nav-bar"] {
position: relative;
overflow: hidden;
display: flex;
width: 2.25rem;
height: 2.25rem;
margin: auto;
}

[class*="a-icon-nav-bar"]:before,
[class*="a-icon-nav-bar"]:after,
[class*="a-icon-nav-bar"]>span {
position: absolute;
top: 50%;
right: 0;
display: block;
height: 1px;
background-color: currentColor;
}

[class*="a-icon-nav-bar"]>span {
width: 1.875rem;
}

[class*="a-icon-nav-bar"]:before,
[class*="a-icon-nav-bar"]:after {
content: '';
}

[class*="a-icon-nav-bar"]>span {
opacity: var(--icon-nav-opacity);
}

[class*="a-icon-nav-bar"]:before {
width: var(--icon-nav-before-width);
margin-top: var(--icon-nav-before-margin);
transform: var(--icon-nav-before-transform);
}

[class*="a-icon-nav-bar"]:after {
width: var(--icon-nav-after-width);
margin-top: var(--icon-nav-after-margin);
transform: var(--icon-nav-after-transform);
}

/* @end @a-icon-nav-bar */

/* toggle -------------------------------------------------------- */

/* @group @variables */

@media all and (max-width:47.9375em) {

:root {
--nav-toggle-close-z-index: -11;
--nav-toggle-close-visibility: hidden;
--nav-toggle-close-pointer-events: none;
--nav-toggle-close-background-color: hsla(30, 20%, 20%, .5); 
}

[class*="a-nav-toggle"]:checked ~ [class*="a-nav-toggle-close"] {
--nav-toggle-close-z-index: 10;
--nav-toggle-close-visibility: visible;
--nav-toggle-close-pointer-events: auto;
}

}

/* @end @variables */

/* @group @a-nav-toggle-close */

@media all and (max-width:47.9375em) {

[class*="a-nav-toggle-close"] {
position: fixed;
visibility: var(--nav-toggle-close-visibility);
z-index: var(--nav-toggle-close-z-index);
top: var(--grobal-head-height);
right: 0;
bottom: 0;
left: 0;
background-color: var(--nav-toggle-close-background-color);
pointer-events: var(--nav-toggle-close-pointer-events);
-webkit-backdrop-filter: blur(.125rem);
backdrop-filter: blur(.125rem);
cursor: pointer;
}

}

/* @end @a-nav-toggle-close */


/* watch header --------------------------------------------------------*/

/* @group @variables */

[class*="a-mutual-header-watch"] {
--header-watch-height: 7.5rem;
}

@media all and (min-width: 48em) {

[class*="a-mutual-header-watch"] {
--header-watch-height: 12rem;
}

}

/* @end @variables */

/* @group @a-mutual-header-watch */

[class*="a-mutual-header-watch"] {
position: absolute;
z-index: -11;
top: 0;
left: 0;
width: 1px;
height: var(--header-watch-height);
pointer-events: none;
}

/* @end @a-mutual-header-watch */