body {
            font-family: 'Poppins', sans-serif;
            margin: 0;
            padding: 0;
            background: #121212; /* Dark background */
            color: #e0e0e0; /* Light text color */
            transition: background 0.3s, color 0.3s; /* Smooth transition */
        }

        .container {
            max-width: 800px;
            margin: 30px auto;
            background: #1e1e1e; /* Darker container */
            padding: 40px;
            box-shadow: 0 0 15px rgba(138, 43, 226, 0.5);
            border-radius: 10px;
            position: relative;
            animation: fadeIn 0.5s; /* Animation for container */
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        .header {
            text-align: center;
            color: #bb86fc; /* Light purple */
            margin-bottom: 30px;
        }

        .header h1 {
            margin-bottom: 5px;
            font-size: 2.5em;
            text-transform: uppercase;
        }

        .sub-header {
            font-size: 1em;
            color: #b0bec5; /* Light grey */
            margin-bottom: 20px;
        }

        .section {
            margin-bottom: 30px;
        }

        .section h2 {
            color: #8a2be2;
            border-bottom: 2px solid #8a2be2;
            padding-bottom: 5px;
            margin-bottom: 15px;
            font-size: 1.4em;
            position: relative;
        }

        .section h2::after {
            content: '';
            position: absolute;
            width: 50px;
            height: 3px;
            background: #8a2be2;
            bottom: -5px;
            left: 0;
        }

        ul {
            list-style: none;
            padding: 0;
        }

        ul li::before {
            content: "•";
            color: #8a2be2;
            display: inline-block;
            width: 1em;
            margin-left: -1em;
        }

        .contact p {
            margin: 5px 0;
        }

        .highlight {
            color: #bb86fc; /* Light purple */
            font-weight: bold;
        }

        .projects li {
            margin-bottom: 10px;
        }

        /* Button Styles */
        .button {
            display: inline-block;
            padding: 10px 20px;
            background: rgb(184, 3, 184);
            color: white;
            text-decoration: none;
            border-radius: 5px;
            transition: background 0.3s ease;
            margin-top: 20px;
            text-align: center;
        }

        .button:hover {
            background: rgb(153, 3, 153);
        }

        /* Responsive Design */
        @media (max-width: 768px) {
            .container {
                padding: 20px;
            }

            .header h1 {
                font-size: 2em;
            }

            .section h2 {
                font-size: 1.2em;
            }
        }