/* =========================
   ABOUT PAGE
========================= */

/* Entire about section */
.aboutme {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Centers everything below the navbar */
.about_container {
    width: 100%;
    max-width: 1500px;

    margin: 0 auto;
    padding: clamp(55px, 14vw, 220px) clamp(20px, 8vw, 220px);

    text-align: center;
}

/* Heading and text must stack vertically */
.about_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;

    width: 100%;
    gap: 35px;
}

/* Remove automatic browser spacing */
.about_content h1,
.about_content h2,
.about_content p,
.about_content ul,
.about_content li {
    margin: 0;
    padding: 0;
}

/* About Me heading */
.about_content h1 {
    font-family: Poppins, sans-serif;
    font-size: clamp(42px, 5vw, 64px);
    font-weight: 700;
    line-height: 1.1;

    color: #FF0000;
    text-shadow: 0 5px 5px rgb(0 0 0 / 50%);
}

/* "About" is red */
.about_content h1 span {
    color: #ffffff;
}

/* Remove bullet point formatting */
.about_content ul {
    width: 100%;
    list-style: none;
}

/* Make the list item use the available width */
.about_content li {
    width: 100%;
}

/* Text container */
.about_text {
    display: flex;
    flex-direction: column;
    align-items: center;

    width: 100%;
    max-width: 1400px;
    margin: 0 auto;

    gap: 8px;

    color: #777777;
    font-family: Poppins, sans-serif;
    font-size: clamp(22px, 2.3vw, 40px);
    line-height: 1.35;
}

/* Skills line */
.about_text span {
    color: white;
    font-size: clamp(19px, 3vw, 30px);
}

/* Mobile */
@media (max-width: 700px) {
    .about_content {
        gap: 25px;
    }

    .about_text {
        font-size: 20px;
        line-height: 1.4;
    }
}

.about_container hr {
    width: 40%;
    min-width: 180px;
    border: 1px solid #1F1F1F;
}