@include breakpoint("wide", $mobile-last: true) {
    .about-us {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(1, 1fr);
        grid-column-gap: 0;
        grid-row-gap: 0;
    
        &-container {
            grid-area: 1 / 1 / 1 / 1; 
            display: flex;
            flex-direction: column;
            width: 100%;
            gap: 1.5rem;
            margin-bottom: 2rem;
            &__headline {
                font-family: 'Poppins', sans-serif; 
                font-weight: 1000; 
                font-size: 1.5rem;
                margin: 0;
            }
            &__paragraph {
                @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3);  
                font-size: 1rem;
                width: 100%;
                max-width: 100%;
                font-family: 'Roboto Serif', sans-serif;
                margin: 0;
            }
            &__emphasized {
                @include set-font(-1, "single", $weight: "light", $transform: "none",$max-width: 3);  
                font-size: 1rem;
                font-family: 'Roboto Serif', sans-serif;
            }
            &__strong { 
                @include set-font(-1, "multiple", $weight: "bold", $transform: "none",$max-width: 3);
                font-family: 'Roboto Serif', sans-serif;
                font-size: 1rem;
            }
            ul {
                margin-top: 0;
                margin-bottom: 0;
                list-style: none;
            }
            li {
                @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3);  
                font-size: 1rem;
                width: 100%;
                max-width: 100%;
                font-family: 'Roboto Serif', sans-serif;
                margin: 0;
            }
        }
        a.a--text-link {
            @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3);
            font-size: 1rem;
            font-family: 'Roboto Serif', sans-serif;
            border-bottom: 0.1rem dotted #000; /* 2px is the width of the border, and #000 is the color (black) */
            width: auto;
            background-image: none;
            margin: 0;
          } 
        p {
            margin: 0;
        }
    }    
}

@include breakpoint("wide") {
    .about-us {
        display: flex;
        justify-content: center; 
        align-items: flex-start;
    
        aside {
            display: flex;
            flex-direction: column;
            width: 20rem;
            gap: 1.5rem;
            margin-bottom: 2rem;
        }
    
        &-container {
            display: flex;
            flex-direction: column;
            width: 40rem;
            gap: 1.2rem;
            margin-bottom: 2rem;
            &__headline {
                font-family: 'Poppins', sans-serif; 
                font-weight: 1000; 
                font-size: 1.5rem;
                margin: 0;
            }
            &__paragraph {
                @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3);  
                font-size: 1rem;
                width: 100%;
                max-width: 100%;
                font-family: 'Roboto Serif', sans-serif;
                margin: 0;
            }
            &__emphasized {
                @include set-font(-1, "single", $weight: "light", $transform: "none",$max-width: 3);  
                font-size: 1rem;
                font-family: 'Roboto Serif', sans-serif;
            }
            &__strong { 
                @include set-font(-1, "multiple", $weight: "bold", $transform: "none",$max-width: 3);
                font-size: 1rem;
                font-family: 'Roboto Serif', sans-serif;
            }
            ul {
                margin-top: 0;
                margin-bottom: 0;
                list-style: none;
            }
            li {
                @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3); 
                font-size: 1rem; 
                width: 100%;
                max-width: 100%;
                font-family: 'Roboto Serif', sans-serif;
                margin: 0;
            }
        }
        a.a--text-link {
            @include set-font(-1, "multiple", $weight: "light", $transform: "none",$max-width: 3);
            font-size: 1rem;
            font-family: 'Roboto Serif', sans-serif;
            border-bottom: 0.1rem dotted #000; 
            width: auto;
            background-image: none;
            margin: 0;
          } 
        p {
            margin: 0;
        }
    }    
}
