html {
    font-size: 3.538vw;
}

html:has(body > header > nav.show) {
    overflow: hidden;
}

html > body:has(header > nav.show) {
    overflow: hidden;
}

body:has(header > nav.show) {
    overflow-y: hidden;
}

body > header {
    position: static;
}

body > header > nav {
    visibility: hidden;
    display: block;
    width: 0;
    transition: width .2s ease-in-out;
}

body > header > nav::before {
    position: absolute;
    top: 0;
    right: 2rem;
    display: flex;
    align-items: center;
    height: 5rem;
    visibility: visible;
    content: '\f0c9';
    font: var(--fa-font-solid);
    font-size: 2rem;
    cursor: pointer;
}

body > header > nav.show {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    visibility: visible;
    width: 100%;
    height: calc(100vh - 5rem);
    padding: 5rem 0 0;
    background: rgba(255, 255, 255, 0.95);
    transition: width .2s ease-in-out;
}

body > header > nav.show::before {
    content: '\f00d';
}

body > header > nav.show {
    display: block;
}

body > header > nav.show > a {
    display: block;
    height: 3rem;
    line-height: 3rem;
    margin: 0;
    padding: 0 2rem;
    font-size: 1.2rem;
}

body > header > nav.show > a:not(:last-of-type) {
    border-bottom: 0.1rem solid #f78c50;;
}

body > header > nav.show > a > em {
    display: inline;
    margin: 0 0 0 1rem;
    font-style: normal;
}

body > aside {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 3;
    visibility: hidden;
    display: block;
    width: 0;
    transition: width .2s ease-in-out;
}

body > aside.show {
    top: 20.3rem;
    visibility: visible;
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    height: 64.776vh;
    background: rgba(255, 255, 255, 0.95);
    transition: width .2s ease-in-out;
}

body > aside > div {
    display: none;
    margin: 0;
    padding: 1rem 2rem;
    border-top: 0.1rem solid #f78c50;
}

body > aside > div > h2 {
    margin: 0;
    font-size: 1.2rem;
    color: #f05b06;
    cursor: pointer;
}

body > aside > div > h2::before {
    content: '\f03a';
    margin: 0 1rem 0 0;
    font: var(--fa-font-solid);
}

body > aside > div > nav {
    visibility: hidden;
    margin: 0;
    max-height: 0;
    transition: max-height .2s ease-in-out;
}

body > aside > div > nav.show {
    visibility: visible;
    margin: 0.8rem 0 0;
    max-height: 15rem;
    transition: max-height .2s ease-in-out;
}

body > main {
    margin: 0;
    padding: 0 1rem;
    width: calc(100% - 2rem);
}

body > main > h2 {
    margin: 0 0 1.4rem;
  }