body {
    font-family: 'Inter', sans-serif;
    background-color: #0D0D1A;
    color: #E0E0E0;
    overflow-x: hidden;
}

body.modal-open {
    overflow: hidden;
}

#background-effects {
    background: 
        /* Main red glow from top-right */
        radial-gradient(farthest-corner at 100% 0%, rgba(255, 77, 77, 0.15) 0%, transparent 50%),
        /* Subtle balancing glow from mid-left */
        radial-gradient(farthest-corner at 0% 50%, rgba(255, 77, 77, 0.08) 0%, transparent 70%);
    pointer-events: none;
}

.bg-main {
    background-color: #0D0D1A;
}

.accent-color {
    color: #FF4D4D;
}

.bg-accent {
    background-color: #FF4D4D;
}

.border-accent {
    border-color: #FF4D4D;
}

.stat-card, .contact-form-bg {
    background-color: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.portfolio-filter button.active {
    background-color: #FF4D4D;
    color: #FFFFFF;
}

.form-input {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: border-color 0.3s;
}

.form-input:focus {
    outline: none;
    border-color: #FF4D4D;
}

#project-modal {
    transition: opacity 0.3s ease-in-out;
}

#project-modal-content {
    transition: transform 0.3s ease-in-out;
}

/* Custom Scrollbar for Modal */
#project-modal-content::-webkit-scrollbar {
    width: 8px;
}

#project-modal-content::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
}

#project-modal-content::-webkit-scrollbar-thumb {
    background-color: #FF4D4D;
    border-radius: 10px;
}

.hero-photo-circle {
    background-color: #ff5d5d;
    box-shadow: 0 0 40px rgba(255, 77, 77, 0.3), inset 0 0 15px rgba(0,0,0,0.2);
}

/* .photo-fade-overlay {
    background: linear-gradient(to top, #0D0D1A 5%, transparent 100%);
    pointer-events: none;
} */