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

/* Light theme overrides: colors, fonts, and accents */
:root {
    --primary: #0b78d1; /* bright blue */
    --primary-dark: #075f9c;
    --secondary: #ff7a59; /* warm coral */
    --bg: #ffffff;
    --bg-light: #fbfdff;
    --text: #0b1220;
    --text-muted: #6b7280;
    --card: #ffffff;
    --border: #e6eef9;
}

body.light, body {
    font-family: 'Nunito', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--bg);
    color: var(--text);
}

/* Make highlights use the new primary/secondary */
.highlight {
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Adjust navbar for bright theme */
body.light .navbar, .navbar {
    background: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid var(--border);
}

/* Buttons */
.btn-primary {
    background: var(--primary);
    color: white;
}

.btn-secondary {
    color: var(--primary);
    border-color: rgba(11,120,209,0.12);
}

/* Project cards lighter */
.project-card {
    background: linear-gradient(180deg, #ffffff, #fbfcff);
    border: 1px solid var(--border);
}

/* About & skill blocks subtle shadow */
.about-block, .skill-card, .modal-content {
    box-shadow: 0 8px 20px rgba(11,18,30,0.04);
}

/* Social icons in light theme */
.social-icons a {
    background: rgba(11,18,30,0.03);
    color: var(--primary);
    border-color: rgba(11,18,30,0.06);
}

/* Footer */
.footer {
    background: #fbfdff;
    border-top: 1px solid var(--border);
}

/* --- Animation utilities & interactive styles (copied from main style.css) --- */
.magnetic-wrap {
    display: inline-block;
    position: relative;
    overflow: visible;
    will-change: transform;
}

@keyframes float3d {
    0% { transform: translateY(0) rotateX(0) rotateY(0); }
    50% { transform: translateY(-6px) rotateX(1deg) rotateY(-1deg); }
    100% { transform: translateY(0) rotateX(0) rotateY(0); }
}

.fade-in { animation: fadeIn 0.6s ease both; }

/* Button ripple (JS-assisted) */
.btn { position: relative; overflow: hidden; }
.btn .ripple { position: absolute; border-radius: 50%; transform: scale(0); background: rgba(255,255,255,0.35); pointer-events: none; animation: rippleEffect 600ms ease-out; }
@keyframes rippleEffect { to { transform: scale(4); opacity: 0; } }

/* Social icons ripple support + transitions */
.social-icons a { position: relative; overflow: hidden; }
.social-icons a .ripple { position: absolute; border-radius: 50%; transform: scale(0); background: rgba(255,255,255,0.18); pointer-events: none; animation: rippleEffect 640ms ease-out; }

/* Secondary CTA entrance helper */
.btn-secondary.entrance { transform: translateY(10px); opacity: 0; animation: btnEntrance 0.8s cubic-bezier(.2,.9,.3,1) forwards; }
@keyframes btnEntrance { to { transform: translateY(0); opacity: 1; } }

/* Small utility keyframe used elsewhere */
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }