/* About Page Styles */
.brandimg{
    margin-top: -1em;
}

.about p {
    max-width: var(--max-width-text);
}

/* Skills Section */
.about-skills {
    margin-top: calc(var(--spacing-xl));
    width: var(--max-width-lg);
}

.about-skills .experience-col {
    margin-right: calc(var(--spacing-xl) * 2.5);
    width: 600px;
}

.about-skills h2 {
    font-size: var(--font-size-small);
    color: var(--color-secondary);
    font-weight: 600;
}

.about-skills h3 {
    font-size: var(--font-size-medium);
    margin: 0;
    font-weight: 600;
}

.about-skills h3:not(:first-of-type) {
    margin-top: var(--spacing-md);
}

/* Skills Lists */
.about-skills ul {
    list-style: none;
    padding: 0;
    margin-left: 0;
}

.about-skills li {
    font-size: var(--font-size-base);
    color: var(--color-primary);
    padding: 0;
    margin: 0;
}

.about-skills ul.skills-list {
    list-style: none;
    padding: 0;
}

.about-skills ul.skills-list li {
    font-size: var(--font-size-small);
    color: var(--color-primary);
    font-weight: 500;
    margin: 0;
}

.about-skills em {
    color: var(--color-secondary);
    font-style: italic;
    font-weight: 300;
    font-size: var(--font-size-small);
}

/* Responsive Styles */
@media (max-width: 1200px) {
    .about-skills {
        width: 100%;
    }

    .about-skills .experience-col {
        margin-right: var(--spacing-lg);
        width: 100%;
        max-width: 600px;
    }
}

@media (max-width: 768px) {
    .about-skills {
        margin-top: var(--spacing-xl);
    }

    .about-skills .experience-col {
        margin-right: 0;
    }
}