body {
    margin: 10px;
    font-family: Arial, sans-serif;
}

.hero-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 80px 10%;

    /* The gradient */
    background: radial-gradient(circle at right, #f0d4ff, #ffffff 60%);
}

.hero-text {
    max-width: 450px;
}

.hero-text h1 {
    font-size: 48px;
    margin: 0 0 20px;
    color: #111;
}

.hero-text p {
    font-size: 18px;
    color: #444;
}

.hero-img img {
    width: 300px;
    border-radius: 25px;
}