@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
    --bg: #0f172a;
    --panel: #111827;
    --primary: #38bdf8;
    /* Brighter base text for stronger contrast */
    --text: #f1f5f9;
    /* Muted text still readable on dark bg */
    --muted: #e2e8f0;
    --card: #1f2933;
}

body {
    background: linear-gradient(180deg, #0b1220, #020617);
    font-family: 'Inter', sans-serif;
    color: var(--text) !important;
    line-height: 1.7;
}

header, footer {
    background: #020617 !important;
}

/* Do not override buttons with generic anchor styles */
.container a:not(.btn) {
    color: var(--primary);
    text-decoration: none;
}

.container a:not(.btn):hover,
.container a:not(.btn):focus-visible {
    color: #7dd3fc;
    text-decoration: underline;
}

.nav-link {
    color: var(--muted) !important;
    font-weight: 500;
}

.nav-link:hover {
    color: var(--primary) !important;
}

.nav-link:focus-visible {
    outline: 2px dashed var(--primary);
    outline-offset: 3px;
}

h1, h2, h3, h4, h5 {
    color: #fff;
}

/* Ensure body copy uses high-contrast color */
p, .card-text, .resume p, .resume li, .resume-bullets li, .resume-skills li {
    color: var(--text);
}

.subtitle {
    color: var(--primary);
    font-size: 1.25rem;
    font-weight: 500;
}

.section-heading {
    font-size: 2rem;
    margin-bottom: 1.5rem;
}

.profile-pic {
    width: 250px;
    height: 300px;
    object-fit: contain;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.4);
}

.profile-img {
    width: 220px;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,.4);
}

.tech-list {
    color: var(--muted);
    font-size: .95rem;
}

.project-card {
    background: linear-gradient(145deg, #020617, #111827);
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.05);
    box-shadow: 0 10px 30px rgba(0,0,0,.4);
    transition: transform .25s ease, box-shadow .25s ease;
}

/* Ensure project card text matches global body copy */
.project-card .card-body,
.project-card .card-text { color: var(--text) !important; }
.project-card .card-title { color: #fff !important; }

.project-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,.6);
}

.project-card iframe {
    border-radius: 16px 16px 0 0;
}

.placeholder-video {
    background: repeating-linear-gradient(
        45deg,
        #020617,
        #020617 10px,
        #0b1220 10px,
        #0b1220 20px
    );
    /* Use higher-contrast text inside dark placeholder */
    color: #e2e8f0;
    font-size: 1.1rem;
}

.resume {
    background: linear-gradient(145deg, #020617, #111827);
    border-radius: 20px;
    padding: 2.5rem;
    border: 1px solid rgba(255,255,255,.05);
}

.resume-block {
    margin-bottom: 1.75rem;
}

.resume-block h3 {
    color: var(--primary);
    margin-bottom: .5rem;
}

.resume-skills,
.resume-bullets {
    padding-left: 1.25rem;
}

.resume-skills li,
.resume-bullets li {
    margin-bottom: .4rem;
}

.btn-primary {
    background: linear-gradient(135deg, #38bdf8, #60a5fa);
    border: none;
    border-radius: 999px;
    padding: .6rem 1.4rem;
    font-weight: 600;
    /* Ensure readable text on light gradient */
    color: #0b1220 !important;
}

.btn-primary:hover {
    opacity: .95;
    color: #082f49 !important;
}

footer {
    color: var(--muted);
}

/* Improve keyboard visibility site-wide */
:focus-visible {
    outline: 2px dashed var(--primary);
    outline-offset: 3px;
}

/* Brand contrast in navbar */
.navbar-brand {
    color: #f8fafc !important;
    font-weight: 700;
}
.navbar-brand:hover,
.navbar-brand:focus-visible {
    color: #7dd3fc !important;
}

@media (max-width: 768px) {
    .profile-img { width: 170px; }
    .profile-pic { width: 200px; height: 240px; }
    .section-heading { font-size: 1.6rem; }
}