/* ================================
   About Page Specific Styles
================================ */
.hero-section {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('/assets/images/hero-bg.jpg');
    background-size: cover;
    background-position: center;
    color: white;
    text-align: center;
    padding: 100px 0;
}

/* Skills Section */
.skill-card {
    background-color: white;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    transition: transform 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.skill-card:hover {
    transform: translateY(-5px);
}

.text-secondary {
    color: var(--color-secondary) !important;
}
/* Add more styles as needed */