html {
    box-sizing : border-box;
    }
    *, *::before, *::after {
    box-sizing : inherit;
    }
    body {
    margin : 0;
    font-family : sans-serif;
    }
    .wrapper {
    width : min(100%, 800px);
    margin : 0 auto;
    overflow : hidden;
    background : lightcyan;
    }
    header {
    margin-left : 48px;
    display : flex;
    justify-content : center;
    background : limegreen;
    }
    header h1 {
    margin : 0;
    line-height : 48px;
    font-size : clamp(1rem, 5vw, 2.25rem);
    }
    .nav-main {
    position : absolute;
    top : 0;
    left : 0;
    z-index : 9999;
    line-height : 0;
    background : lightblue;
    }
    .nav-main-menu-toggle {
    background : none;
    border : none;
    cursor : pointer;
    padding : 0;
    line-height : 0;
    }
    .nav-main-menu-toggle svg * {
    transform-box : fill-box;
    }
    .nav-main-menu-toggle rect:nth-child(1) {
    transition : all 2s cubic-bezier(0.18,0.89,0.32,1.28);
    transform-origin : center;
    }
    .nav-main-menu-toggle rect:nth-child(2) {
    transition : all 3s linear;
    transform-origin : center;
    }
    .nav-main-menu-toggle rect:nth-child(3) {
    transition : all 5s cubic-bezier(0.18,0.89,0.32,1.28);
    transform-origin : center;
    }
    #nav-main-menu {
    transform : translateX(-100%);
    transition : all 5s ease-in-out;
    position : absolute;
    width : 80vw;
    background : #433d87;
    margin : 0;
    padding : 0;
    list-style : none;
    display : flex;
    visibility : hidden;
    flex-direction : column;
    }
    #nav-main-menu:not([hidden]) {
    visibility : visible;
    transform : translateX(0);
    transition : all 1.8s ease-in-out;
    }
    #nav-main-menu li a {
    color : inherit;
    display : flex;
    line-height : 3;
    padding : 0 2em;
    transition : all 0.50s ease-in-out;
    }
    #nav-main-menu li a:hover, #nav-main-menu li a:focus {
    background : rgb(91, 178, 186);
    }

    .nav-main-menu-toggle[aria-expanded="true"] rect:nth-child(1) {
        rotate: 1.0turn;
        translate: 0 10px;
    }
    
    .nav-main-menu-toggle[aria-expanded="true"] rect:nth-child(2) {
        scale: 0;
    }
    
    .nav-main-menu-toggle[aria-expanded="true"] rect:nth-child(3) {
        rotate: -1.0turn;
        translate: 0 -10px;
    }

    main {
    padding : 1rem;
    background : lightgoldenrodyellow;
    }
    footer {
    display : flex;
    background : lightgreen;
    }
    footer a {
    color : currentColor;
    text-decoration : none;
    line-height : 2;
    padding : 0 1rem;
    }
    footer a:first-child {
    margin-right : auto;
    }
    .cta-more {
        display : flex;
        flex-wrap : wrap;
        align-items : center;
        clear : both;
        margin : 1rem 0;
        padding : 1rem 0;
        }
        .cta-more-center {
        justify-content : center;
        }
        .cta-more-right {
        justify-content : flex-end;
        }
        .cta-more-link {
        font-size : 1.5em;
        line-height : 3;
        margin : 8px;
        padding : 0 1em;
        border-radius : 0.75em;
        border : #000000 solid 1px;
        font-weight : bold;
        transition : all 0.75s ease-in-out;
        }
        .cta-more-link:hover {
        box-shadow : none;
        }
        .cta-more-link-small {
        font-size : 1em;
        }
        .cta-more-link-large {
        font-size : 1.8em;
        }
        .cta-more-link-primary {
        color : rgba(45, 41, 98, 0.576);
        background : linear-gradient(hsl(360 50% 37%) 0, hsl(360 74% 37%) 3px, hsl(360 74% 37%));
        }
        .cta-more-link-secondary {
        color : rgb(211, 171, 111);
        background : linear-gradient(hsl(66 89% 41%) 0, hsl(66 89% 63%), hsl(90 72% 55%));
        box-shadow : 0 0 3em currentColor;
        }
        .cta-more-link-success {
        color : black;
        background : lawngreen;
        box-shadow : 0 0 1em currentColor;
        }
    @media screen and (min-width: 768px) {
    header {
    margin-left : 0;
    background: url(images/dali-bai-1920.webp)
    }
    header h1 {
    margin : 0.67em 0;
    line-height : 2;
    }
    .nav-main {
    position : static;
    top : auto;
    left : auto;
    z-index : auto;
    }
    .nav-main-menu-toggle {
    display : none;
    }
    #nav-main-menu {
    position : relative;
    visibility : visible;
    transform : translateX(0);
    transition : none;
    background : transparent;
    display : flex;
    flex-direction : row;
    }
    }