portfolio/assets/styles/components/intro.scss

.intro {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 2em;
}

.intro-text {

} 

.intro-items {
    border: 1px dashed gray;
    border-radius: 3px;
    padding: 1em;
    .intro-item {
        display: flex;
        // margin: .4em 0em;
        margin-bottom: .4em;
        &:last-of-type {
            margin-bottom: 0;
        }
    }
    .item-icon {
        margin-right: 1em;
        color: $primary; 
    }

    .item-content {
        display: flex;
        align-items: center; 
        ul {
            margin-left: .5em;
            display: flex;
            li {
                margin-right: 0.5em;
            }
        }
    }
}

.intro-interests {
   .chip {
        font-size: .8em !important;
        padding: .3em 1em !important;
   }
   .chip-icon {
        svg {
            width: 1.5em;
        }
   }
}

.intro-interests-header {
    width: 100%;
    p {
        margin-bottom: 0.5em;
    }
}

@media (max-width: 1200px) {
    .intro {
        display: block;
    }
    .intro-items {
        margin-top: 1em;
    }
}