File size: 2,514 Bytes
dc816ed
3bb6bde
 
 
7b9c6f5
3bb6bde
 
 
 
 
 
 
 
 
e7097c7
3bb6bde
 
 
 
e7097c7
 
 
 
 
 
 
 
3bb6bde
 
 
 
 
 
 
 
 
 
7b9c6f5
 
3bb6bde
 
7b9c6f5
 
3bb6bde
 
 
 
7b9c6f5
 
3bb6bde
 
7b9c6f5
3bb6bde
e7097c7
3bb6bde
7b9c6f5
3bb6bde
 
e7097c7
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3bb6bde
dc816ed
 
3bb6bde
dc816ed
 
3bb6bde
 
dc816ed
 
3bb6bde
dc816ed
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3bb6bde
 
dc816ed
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118

/* Custom styles that complement Tailwind */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

body {
    font-family: 'Inter', sans-serif;
}

/* Smooth scroll behavior */
html {
    scroll-behavior: smooth;
}
/* Custom gradient text */
.text-gradient {
    background: linear-gradient(90deg, #6366f1, #8b5cf6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Glassmorphism effect */
.glass-card {
    background: rgba(30, 41, 59, 0.7);
    backdrop-filter: blur(16px);
    border: 1px solid rgba(99, 102, 241, 0.2);
    box-shadow: 0 8px 32px 0 rgba(99, 102, 241, 0.2);
}
/* Animation for section entries */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out forwards;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}
::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #6366f1, #8b5cf6);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #8b5cf6;
}

/* Glowing hover effect */
.hover-glow:hover {
    box-shadow: 0 0 15px rgba(139, 92, 246, 0.7);
    transition: box-shadow 0.3s ease;
}

/* Tech grid pattern */
.tech-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: 
        linear-gradient(rgba(99, 102, 241, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(99, 102, 241, 0.1) 1px, transparent 1px);
    background-size: 30px 30px;
    opacity: 0.3;
    z-index: -1;
}
/* Hero section */
.hero-image {
    position: relative;
    overflow: hidden;
    border-radius: 1rem;
}

.hero-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.1), rgba(0,0,0,0.3));
}

/* Project cards */
.project-card {
    transition: all 0.3s ease;
}

.project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Contact form */
.contact-form input,
.contact-form textarea {
    transition: all 0.2s ease;
}

.contact-form input:focus,
.contact-form textarea:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}