.about-section{

    background:
        linear-gradient(
            135deg,
            rgba(108,61,214,.05),
            rgba(232,62,140,.03),
            rgba(255,154,61,.04)
        );

    padding:80px 0;
}

.about-hero{

    text-align:center;

    max-width:800px;

    margin:0 auto 80px;
}

.about-hero h1{

    font-size:3.5rem;

    font-weight:800;

    margin:20px 0;
}

.about-hero p{

    color:#666;

    font-size:1.2rem;

    line-height:1.8;
}

.about-card,
.about-highlight{

    background:white;

    padding:40px;

    border-radius:24px;

    height:100%;

    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.about-highlight{

    background:
    linear-gradient(
        135deg,
        rgba(108,61,214,.08),
        rgba(232,62,140,.08)
    );
}

.about-features{

    margin-top:80px;
}

.feature-card{

    background:white;

    border-radius:24px;

    padding:30px;

    text-align:center;

    height:100%;

    box-shadow:0 10px 30px rgba(0,0,0,.05);

    transition:.3s;
}

.feature-card:hover{

    transform:translateY(-8px);
}

.feature-icon{

    font-size:2rem;

    margin-bottom:15px;
}

.about-contact{

    margin-top:80px;
}

.contact-cta{

    background:white;

    border-radius:24px;

    padding:50px;

    box-shadow:0 10px 30px rgba(0,0,0,.05);
}

.contact-info-card{

    background:white;

    border-radius:24px;

    padding:40px;

    box-shadow:0 10px 30px rgba(0,0,0,.05);

    height:100%;
}

@media(max-width:768px){

    .about-hero h1{

        font-size:2.5rem;
    }

}