﻿/* Hero Section Styles */
.about-hero {
    padding: 100px 0;
    position: relative;
}

/* Content Section Styles */
.about-content {
    margin-top: -50px;
    position: relative;
    z-index: 1;
}

.stats-box {
    border: 2px dashed #33b8a8;
}

    .stats-box h3 {
        color: #33b8a8 !important;
    }

.global-presence {
    border-left: 4px solid var(--pp-primary);
}

.improvement-box {
    background-color: var(--pp-primary) !important;
    border-left: 4px solid var(--pp-secondary);
}

.text-success {
    color: #33b8a8 !important;
}

.btn-success {
    background-color: var(--pp-primary) !important;
    border-color: var(--pp-primary) !important;
}

    .btn-success:hover {
        background-color: #0c2d52 !important;
        border-color: #0c2d52 !important;
    }

/* Card Hover Effects */
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
    }

/* Responsive Adjustments */
@media (max-width: 768px) {
    .about-hero {
        padding: 60px 0;
    }

    .about-content {
        margin-top: 0;
        padding: 2rem !important;
    }

    .stats-box {
        margin-top: 2rem;
    }
}

/* Ensure variables are defined */
:root {
    --pp-primary: #0f3b6c; /* Primary color */
    --pp-secondary: #fa9128; /* Secondary color */
}
