/* @group @o-mutual-footer */

[class*="o-mutual-footer"] {
display: grid;
gap: 1.5rem;
padding-top: 3rem;
padding-right: var(--x-padding-right);
padding-bottom: 3.375rem;
padding-left: var(--x-padding-left);
background-color: hsl(220deg 5% 20%);
text-align: var(--mutual-footer-text-align);
backface-visibility: hidden;
content-visibility: auto;
contain-intrinsic-size: 0 30rem;
contain: layout;
}

/* @end @page-footer */

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

/* @group @variables */

[class*="a-footer-nav"] {
--footer-nav-grid-auto-flow: row;
--text-align: center;
--font-weight: var(--font-weight-bold);
--footer-nav-flex-direction: column;
}

@media (width >= 50em) { /* 800px -> * */

[class*="a-footer-nav"] {
--footer-nav-grid-auto-flow: column;
}

}

/* @end @variables */

/* @group @a-footer-nav */

[class*="a-footer-nav"] {
display: grid;
justify-content: center;
grid-auto-flow: var(--footer-nav-grid-auto-flow);
gap: .75rem 1.5rem;
}

/* @end @a-footer-nav */

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

/* @group @variables */

[class*="a-footer-copyright"] {
--small-font-family: 'Oswald'system-ui, -apple-system, 'Meiryo', sans-serif;
--small-font-size: .75rem;
--small-line-height: 1.5;
--small-color: hsl(0deg 0% 100%);
--small-letter-spacing: .05em;
--small-text-transform: uppercase;
--small-text-align: center;
}

/* @end @variables */

/* @group @a-footer-copyright */

[class*="a-footer-copyright"] {
display: grid;
place-content: center;
place-items: center;
grid-auto-flow: column;
}

/* @end @a-footer-copyright */

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

/* @group @variables */

[class*="a-page-top"] {
--page-top-opacity: 0;
}

[class*="is-fit-sticky"] [class*="a-page-top"] {
--page-top-opacity: 1;
}

:root {
--page-top-right: var(--x-padding-right);
}

@media (width >= 82.5em) { /* 1320px -> * */

[class*="a-page-top"] {
--page-top-transform: translateX(-4.125rem);
}

}

[class*="a-page-top"] {
--link-background-color: hsl(247deg 42% 57% / 90%);
--page-top-link-transition: background-color 0s 0s var(--transition-cubic-bezier);
}

[class*="is-fit-sticky"] [class*="a-page-top"] {
--page-top-opacity: 1;
}

[class*="a-page-top"] a:hover,
[class*="a-page-top"] a:focus {
--link-background-color: hsl(247deg 42% 52% / 90%)/
}

/* @end @variables */

/* @group @a-page-top */

[class*="a-page-top"] {
box-sizing: border-box;
position: fixed;
z-index: 11;
bottom: 1.5rem;
right: var(--page-top-right);
width: var(--page-top-icon-size);
height: var(--page-top-icon-size);
border-radius: .1875rem;
opacity: var(--page-top-opacity);
transition: opacity .3s 0s var(--transition-cubic-bezier);
}

[class*="a-page-top"] a {
position: relative;
display: grid;
place-items: center;
width: 3.375rem;
height: 3.375rem;
background-color: var(--link-background-color);
background-image: url('../img/sprite-svg.svg#icon-pagetop');
background-size: 1.5rem 1.5rem;
background-position: center center;
background-repeat: no-repeat;
border-radius: inherit;
transition: background-color .3s 0s var(--transition-cubic-bezier);
-webkit-backdrop-filter: blur(.125rem);
backdrop-filter: blur(.125rem);
}

@media print {[class*="a-page-top"] {display: none;}}

/* @end @a-page-top */