.hero {
    gap: var(--space-48);
    overflow: hidden;
}

.hero img {
    max-width: var(--width-384);
    width: 100%;
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow-bottom-left);
}

.hero-text-wrapper {
    background-color: var(--color-yellow-background);
    border-radius: var(--radius-sm);
    padding: var(--space-24);
}

.hero-text-wrapper .hero-text {
    font-weight: var(--font-main-regular);
}

.hero-text span {
    font-weight: var(--font-main-semibold);
}

.experience-paragraph {
    padding-right: var(--space-24);
    padding-left: var(--space-24);
    display: flex;
    flex-direction: row;
    gap: var(--space-48);
    /* flex-wrap: wrap; */
    overflow: hidden;
}

.experience-text {
    max-width: var(--width-384);
    width: 100%;
}

.experience-text p{
    margin-top: var(--space-24);
}

.experience-paragraph h2 {
    text-align: left;
    margin-left: 0;
}

.experience-image {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    align-items: center;
    text-align: center;
}

.experience-image img {
    max-width: 300px;
    width: 100%;
    min-width: 200px;
    box-shadow: var(--shadow-bottom-left);
}

@media (max-width: 800px) {
    .experience-paragraph {
        flex-wrap: wrap;
    }

    .experience-text {
        max-width: none;
    }
}

/* .simple-art {
    padding: var(--space-48) var(--space-0);
} */

.simple-art-text-wrapper {
    padding: var(--space-24) var(--space-24);
    background-color: var(--color-yellow-background);
    border-radius: var(--radius-sm);
}

.simple-art h2 {
    max-width: var(--width-792);
    text-align: left;
    margin-left: 0;
}

.simple-art p{
    margin-top: var(--space-24);
}

.career-wrapper{
    padding-right: var(--space-24);
    padding-left: var(--space-24);
    display: flex;
    flex-direction: column;
    gap: var(--space-24);
}

.career h2{
    max-width: var(--width-792);
    text-align: left;
    margin-left: 0;
}

.career-quote {
    max-width: var(--width-792);
    background-color: var(--color-green-background);
    min-height: 92px;
    border-radius: var(--radius-round);
    display: flex;
    align-items: center;
    justify-content: flex-start; /* align text after icon */
    padding-left: 112px;           /* icon width + gap */
    padding-right: 16px;
    position: relative;
    transition: var(--transition-fast);

}

.quote-icon-wrapper {
    position: absolute;
    left: 0;
    width: 92px;
    height: 92px;
    background-color: var(--color-light-green);
    border-radius: var(--radius-round);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: var(--transition-fast);
}

.career-quote small {
    font-weight: var(--font-main-medium);
    text-align: left;
    flex: 1;
    padding: 4px 0;
    transition: var(--transition-fast);
}

/* Responsive tweaks */
@media (max-width: 618px) {
    .career-quote {
        flex-direction: column;
        min-height: auto;
        padding-left: 0;
        padding-right: 0;
        text-align: center;
        border-radius: var(--radius-sm);
    }

    .quote-icon-wrapper {
        position: static;
        margin-bottom: 8px;
        width: 48px;
        height: 48px;
        width: 100%;
        border-radius: var(--radius-sm) var(--radius-sm) 0 0;
    }

    .career-quote small {
        text-align: center;
        padding: 4px 8px;
    }
}

.recognized-wrapper {
    padding: var(--space-24) var(--space-24);
    background-color: var(--color-yellow-background);
    border-radius: var(--radius-sm);
    max-width: var(--width-792);
    width: 100%;
}

.recognized-wrapper h4 {
    max-width: var(--width-792);
}

.recognized-wrapper ul{
    padding-left: var(--space-48);
    transition: var(--transition-fast);
}

.recognized-wrapper ul li {
    font-size: var(--font-24);
    font-weight: var(--font-main-regular);
    text-align: center;
    padding: var(--space-24);
    text-indent: -24px;
    transition: var(--transition-fast);
}

.recognized-image {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    align-items: center;
    text-align: center;
}

.recognized-image img {
    max-width: var(--width-384);
    width: 100%;
    min-width: 200px;
    box-shadow: var(--shadow-bottom-left);
    border-radius: var(--radius-sm);
}

@media (max-width: 428px) {
    .recognized-wrapper ul {
        /* list-style: none; */
        padding: 0;
    }

    .recognized-wrapper ul li {
        text-align: left;
        text-indent: 0;
        padding: var(--space-12) 0;
    }
}

.more-than-artist-wrapper {
    padding: var(--space-24) var(--space-24);
}

.more-than-artist-wrapper h2 {
    max-width: var(--width-792);
    text-align: left;
    margin-left: 0;
}

.more-than-artist-wrapper p {
    margin-top: var(--space-24);
}

.more-than-artist-wrapper img {
    max-width: var(--width-588);
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: var(--space-48) auto 0 auto;
    box-shadow: var(--shadow-bottom-left);
    /* min-width: 220px; */
}

.about-cta h4{
    margin-top: -48px;
}

@media (max-width: 500px) {
    .simple-art {
        border-radius: 0;
    }

    section {
        padding: var(--space-48) var(--space-8);
    }

    .recognized-wrapper ul {
        padding-left: var(--space-24);
    }
}