/* Reset & basic styles */
body {
    margin: 0;
    font-family: Arial, sans-serif;
    line-height: 1.6;
    background-color: #121212; /* dark background */
    color: #FFFFFF; /* white text */
}
a { text-decoration: none; color: #FFB6C1; } /* pastel pink links */
a:hover { text-decoration: underline; }

/* Header */
header {
    background: linear-gradient(to bottom, #222222, #121212); /* vertical pastel pink to dark */
    color: #FFFFFF;
    padding: 2rem 1rem;
    text-align: center;
}
header h1 { margin: 0; font-size: 2rem; }
header p { margin: 0.3rem 0; }
header p a { color: #FFB6C1; margin: 0 0.2rem; }
header p a:hover { text-decoration: underline; }

/* Main */
main { max-width: 1000px; margin: 2rem auto; padding: 0 1rem; }

/* Section Headers */
h2 {
    color: #FFB6C1; /* pastel pink titles */
    margin-bottom: 1rem;
    border-bottom: 2px solid #FFB6C1;
    display: inline-block;
    padding-bottom: 0.2rem;
}

/* Content Card (Profile & Education) */
.content-card {
    background: #1E1E1E; /* dark card background */
    padding: 1.5rem;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    margin-bottom: 2rem;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.content-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.8);
}

/* Project Cards */
.projects-section { display: flex; flex-direction: column; gap: 2rem; }
.project-card {
    display: flex;
    flex-direction: row;
    background: #1E1E1E; /* dark card background */
    border-radius: 8px;
    border: 1px solid #333; /* subtle border for contrast */
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.project-card:hover { transform: translateY(-5px) scale(1.01); box-shadow: 0 8px 20px rgba(0,0,0,0.8); }

/* Image container - vertically centered */
.project-img-container { 
    flex: 1; 
    display: flex; 
    justify-content: center; 
    align-items: center; 
    padding: 0.5rem; 
}
.project-img-container img {
    width: 100%;
    max-width: 450px;
    height: auto;
    border-radius: 4px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.project-card:hover img { transform: scale(1.05); box-shadow: 0 4px 15px rgba(0,0,0,0.7); }

/* Project Info */
.project-info { flex: 1; padding: 1rem; }
.project-info h3 { margin-top: 0; }
.project-info a { display: inline-block; margin-top: 0.5rem; font-weight: bold; color: #FFB6C1; }

/* Skills badges */
.skills-section { margin: 2rem 0; }
.skills-container { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.skill { 
    display: inline-block; 
    color: #FFFFFF; 
    background: linear-gradient(to bottom, #FFB6C1, #FF85A1); /* vertical gradient pastel pink */
    padding: 0.4rem 0.8rem; 
    border-radius: 20px; 
    font-size: 0.9rem; 
    font-weight: bold; 
    box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
}

/* Footer */
footer { 
    text-align: center; 
    padding: 2rem 1rem; 
    background: linear-gradient(to bottom, #121212, #222222); /* subtle vertical pastel pink gradient */
    color: #FFFFFF; 
}

/* Fade-in/out */
.fade-in { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }

/* Lightbox */
#lightbox-overlay {
    position: fixed; top:0; left:0; width:100%; height:100%;
    background: rgba(0,0,0,0.85); /* dark overlay */
    display: none;
    justify-content: center; align-items: center; z-index:1000;
}
#lightbox-image {
    max-width:90%; max-height:90%; border-radius:6px; box-shadow:0 8px 20px rgba(0,0,0,0.8);
}

/* Responsive */
@media(max-width:900px){
    .project-card{flex-direction:column;align-items:center;}
    .project-img-container img{max-width:100%;height:auto;}
}
