/* Hero Background */
.hero-section {
position: relative;
overflow: hidden;
}
.hero-section:before {
content: '';
position: absolute;
top: 20px;
right: 0;
width: 64rem;
height: 64rem;
background-color: rgba(142, 63, 254, 0.05);
border-radius: 50%;
filter: blur(100px);
z-index: -1;
}
.hero-section:after {
content: '';
position: absolute;
bottom: 20px;
left: 0;
width: 96rem;
height: 96rem;
background-color: rgba(96, 78, 255, 0.05);
border-radius: 50%;
filter: blur(100px);
z-index: -1;
}
/* Hero Title Gradient */
.hero-title {
background: linear-gradient(90deg, #8E3FFE 0%, #604EFF 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-weight: bold;
}
/* Hero Badge */
.hero-badge {
background-color: #F9FAFF;
color: #8E3FFE;
border: 1px solid rgba(142, 63, 254, 0.2);
border-radius: 9999px;
padding: 0.5rem 1rem;
display: inline-block;
margin-bottom: 1.5rem;
}
/* Hero Buttons */
.primary-button {
background-color: #8E3FFE !important;
color: white !important;
border: none !important;
border-radius: 12px !important;
padding: 1rem 2rem !important;
font-size: 1.125rem !important;
transition: background-color 0.3s ease;
}
.primary-button:hover {
background-color: #7030E0 !important;
}
.secondary-button {
background-color: transparent !important;
color: #374151 !important;
border: 1px solid #D1D5DB !important;
border-radius: 12px !important;
padding: 1rem 2rem !important;
font-size: 1.125rem !important;
}
/* Tool Logos */
.tool-logos {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 1.5rem;
margin-top: 1.5rem;
}
.tool-logo {
display: flex;
align-items: center;
}
.tool-logo img {
height: 1.25rem;
width: 1.25rem;
margin-right: 0.5rem;
}
🔥 New version dropped!
I'm ready to work, Ask me anything.
