/*
 * About Us Page Specific Stylesheet
 * Dehghan Seir Theme
 */

/* Glassmorphism Panel */
.about-glass-panel {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.35);
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.05);
}

.dark-glass-panel {
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.08);
}

/* Story Image Grid Collage */
.collage-img-wrapper {
    position: relative;
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.collage-img-wrapper::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.15);
    pointer-events: none;
}

.collage-img-wrapper:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15);
}

/* Gradient text highlights */
.about-gradient-text {
    background: linear-gradient(135deg, var(--color-primary, #f77100) 0%, var(--color-secondary, #008bf1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Grid value items */
.value-card {
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    background: #ffffff;
    border: 1px solid rgba(243, 244, 246, 0.9);
}

.value-card:hover {
    transform: translateY(-6px);
    border-color: rgba(var(--color-primary), 0.15);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.05), 0 10px 10px -5px rgba(0, 0, 0, 0.03);
}

/* Dynamic counter animations */
.counter-value {
    font-family: 'MyFaNumFont', sans-serif;
    transition: transform 0.3s ease-out;
}

.about-floating-element {
    animation: floatAboutDoodles 9s ease-in-out infinite alternate;
}

@keyframes floatAboutDoodles {
    0% {
        transform: translateY(0) rotate(0deg);
    }
    100% {
        transform: translateY(-15px) rotate(4deg);
    }
}