<style>
    body {
        margin: 0;
        font-family: 'Segoe UI', sans-serif;
        background: linear-gradient(to right, #eef2f3, #dfe9f3);
        padding: 40px;
    }

    .container {
        max-width: 1000px;
        margin: auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    .card {
        background: #fff;
        padding: 30px;
        border-radius: 15px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        transition: transform 0.3s ease;
    }

    .card:hover {
        transform: translateY(-8px);
    }

    .title {
        font-size: 26px;
        font-weight: bold;
        margin-bottom: 15px;
        color: #2c3e50;
    }

    .icon {
        font-size: 35px;
        margin-bottom: 10px;
    }

    .text {
        color: #555;
        line-height: 1.7;
        font-size: 16px;
    }

    .highlight {
        color: #007BFF;
        font-weight: 600;
    }

    /* Responsive */
    @media(max-width: 768px) {
        .container {
            grid-template-columns: 1fr;
        }
    }
</style>
