/* Merito CSS Variables - Consistent with Index */
    :root {
        --merito-gradient-start: #4aacc4;
        --merito-gradient-end: #555555;
        --merito-primary: #6c757d;
        --merito-secondary: #495057;
        --merito-accent: #007bff;
        --merito-light: #f8f9fa;
        --merito-card-bg: rgb(225, 225, 225);
        --merito-border: #e9ecef;
    }

    .merito-hero {
        min-height: 100vh;
        background: #f8f9fa;
        background-image:
            radial-gradient(circle at 20% 80%, rgba(117, 117, 117, 0.332) 0%, transparent 50%),
            radial-gradient(circle at 80% 20%, rgba(66, 66, 66, 0.211) 0%, transparent 50%);
    }

    .merito-card {
        background: var(--merito-card-bg);
        border-radius: 20px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.2);
        overflow: hidden;
    }

    .card-header {
        background: linear-gradient(135deg, var(--merito-gradient-start), var(--merito-gradient-end));
        color: white;
        padding: 1.5rem;
        position: relative;
        overflow: hidden;
        border-radius: 15px 15px 0 0;
    }

    .merito-card-header-1 {
        background: linear-gradient(135deg, var(--merito-gradient-start), var(--merito-gradient-end));
        color: white;
        padding: 1.5rem;
        position: relative;
        overflow: hidden;
        border-radius: 15px 15px 0 0;
    }

    .merito-card-header-1::after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: linear-gradient(45deg, transparent 0%, rgba(255, 255, 255, 0.1) 100%);
    }

    .merito-card-body {
        padding: 2rem;
    }

    .merito-button {
        background: linear-gradient(135deg, var(--merito-gradient-start), var(--merito-gradient-end));
        border: none;
        color: white;
        padding: 1rem 2rem;
        border-radius: 50px;
        font-weight: 600;
        transition: all var(--transition-speed) ease;
        box-shadow: 0 4px 15px #4aacc44d;
        position: relative;
        overflow: hidden;
    }

    .merito-button:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(112, 112, 112, 0.4);
        color: white;
    }

    .merito-button::before {
        content: "";
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(120deg,
                transparent,
                rgba(255, 255, 255, 0.2),
                transparent);
        transition: 0.5s;
    }

    .merito-button:hover::before {
        left: 100%;
    }

    .alert-warning {
        background-color: rgba(255, 193, 7, 0.1);
        border-color: #ffc107;
        color: #856404;
        border-radius: 12px;
    }

    .alert-danger {
        background-color: rgba(220, 53, 69, 0.1);
        border-color: #dc3545;
        color: #721c24;
        border-radius: 12px;
    }

    .display-1 {
        font-size: 3.5rem;
        letter-spacing: 2px;
    }

    .display-6 {
        letter-spacing: 1px;
        line-height: 1.4;
    }

    /* Hero Inspiracional Mérito Styles */
    .hero-inspiracional-merito {
        background: linear-gradient(135deg, var(--merito-gradient-start) 0%, var(--merito-gradient-end) 100%);
        color: white;
        position: relative;
        overflow: hidden;
    }

    .hero-inspiracional-merito::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M20 20c0-8 8-8 8 0s-8 8-8 0zm0 0c0 8-8 8-8 0s8-8 8 0z'/%3E%3C/g%3E%3C/svg%3E") center/cover;
        animation: backgroundMove 25s ease infinite;
    }

    .hero-content {
        position: relative;
        z-index: 2;
    }

    .hero-badge-merito {
        display: inline-block;
        background: rgba(255, 255, 255, 0.15);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 50px;
        padding: 0.75rem 1.5rem;
        margin-bottom: 2rem;
        font-size: 0.95rem;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
    }

    .hero-title-merito {
        font-size: 3.2rem;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: 1.5rem;
        color: white;
    }

    .hero-title-merito .highlight-merito {
        background: linear-gradient(135deg, #00d4aa 0%, #00bcd4 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
        position: relative;
    }

    .hero-description-merito {
        font-size: 1.2rem;
        line-height: 1.7;
        margin-bottom: 3rem;
        color: rgba(255, 255, 255, 0.85);
        font-weight: 300;
    }

    .hero-stats-merito {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1.5rem;
        margin-top: 2rem;
    }

    .stat-item-merito {
        text-align: center;
        padding: 1rem;
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.2);
        border-radius: 15px;
        transition: all 0.3s ease;
    }

    .stat-item-merito:hover {
        transform: translateY(-5px);
        background: rgba(255, 255, 255, 0.2);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    }

    .stat-icon-merito {
        width: 60px;
        height: 60px;
        margin: 0 auto 1rem;
        background: linear-gradient(135deg, #00d4aa, #00bcd4);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        color: white;
        animation: pulse 2s infinite;
    }

    .stat-text-merito {
        font-size: 0.9rem;
        font-weight: 600;
        color: rgba(255, 255, 255, 0.9);
    }

    /* Visual Elements Mérito */
    .hero-visual-merito {
        position: relative;
        height: 400px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .floating-elements-merito {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .floating-icon-merito {
        position: absolute;
        width: 60px;
        height: 60px;
        background: rgba(255, 255, 255, 0.15);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.3);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        color: white;
        animation: floatMerito 3s ease-in-out infinite;
    }

    .icon-1-merito {
        top: 20%;
        left: 10%;
        animation-delay: 0s;
    }

    .icon-2-merito {
        top: 10%;
        right: 20%;
        animation-delay: 1.5s;
    }

    .icon-3-merito {
        bottom: 30%;
        left: 15%;
        animation-delay: 3s;
    }

    .icon-4-merito {
        bottom: 15%;
        right: 10%;
        animation-delay: 4.5s;
    }

    @keyframes floatMerito
    {

            0%,
            100% {
                transform: translateY(0px) rotate(0deg);
            }

            25% {
                transform: translateY(-25px) rotate(-5deg);
            }

            50% {
                transform: translateY(-15px) rotate(5deg);
            }

            75% {
                transform: translateY(-20px) rotate(-3deg);
            }
        }

        .central-element-merito {
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .award-trophy {
            width: 120px;
            height: 120px;
            background: linear-gradient(135deg, #00d4aa, #00bcd4);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 3rem;
            color: white;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
            animation: glow 3s ease-in-out infinite alternate;
            position: relative;
            z-index: 2;
        }

        @keyframes glow
        {
                0% {
                    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 20px rgba(0, 212, 170, 0.5);
                }

                100% {
                    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4), 0 0 40px rgba(0, 212, 170, 0.8);
                }
            }

            .ripple-effect-merito {
                position: absolute;
                width: 200px;
                height: 200px;
                border: 2px solid rgba(0, 212, 170, 0.4);
                border-radius: 50%;
                animation: rippleMerito 3s infinite;
            }

        @keyframes rippleMerito {
                    0% {
                        transform: scale(0.5);
                        opacity: 1;
                    }

                    100% {
                        transform: scale(2.2);
                        opacity: 0;
                    }
                }

                /* Responsive adjustments Mérito */
                @media(max-width: 768px) {
                        .hero-title-merito {
                            font-size: 2.5rem;
                        }

                        .hero-description-merito {
                            font-size: 1.1rem;
                        }

                        .hero-stats-merito {
                            grid-template-columns: 1fr;
                            gap: 1rem;
                        }

                        .hero-visual-merito {
                            height: 300px;
                        }

                        .award-trophy {
                            width: 80px;
                            height: 80px;
                            font-size: 2rem;
                        }

                        .floating-icon-merito {
                            width: 40px;
                            height: 40px;
                            font-size: 1rem;
                        }
                    }

                                         /* Submit Confirmation Styles */

                    .confirmation-icon {
                        width: 80px;
                        height: 80px;
                        margin: 0 auto 1.5rem;
                        background: linear-gradient(135deg, var(--merito-gradient-start), var(--merito-gradient-end));
                        border-radius: 50%;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        font-size: 2.5rem;
                        color: white;
                        box-shadow: 0 8px 20px rgba(74, 172, 196, 0.3);
                        animation: confirmationPulse 5s ease-in-out infinite;
                        position: relative;
                        z-index: 2;
                    }

                    @keyframes confirmationPulse {

                            0%,
                            100% {
                                transform: scale(1);
                                box-shadow: 0 8px 20px rgba(74, 172, 196, 0.3);
                            }

                            50% {
                                transform: scale(1.05);
                                box-shadow: 0 12px 30px rgba(74, 172, 196, 0.5);
                            }
                        }

                        .confirmation-title {
                            color: var(--merito-secondary);
                            font-size: 1.8rem;
                            font-weight: 600;
                            margin-bottom: 1rem;
                            position: relative;
                            z-index: 2;
                        }

                        .confirmation-text {
                            color: var(--merito-primary);
                            font-size: 1.1rem;
                            line-height: 1.6;
                            margin-bottom: 2rem;
                            max-width: 500px;
                            margin-left: auto;
                            margin-right: auto;
                            position: relative;
                            z-index: 2;
                        }

                        .submit-button-container {
                            position: relative;
                            z-index: 2;
                        }

                        .submit-button-container .merito-button {
                            font-size: 1.1rem;
                            padding: 1.2rem 3rem;
                            box-shadow: 0 8px 25px rgba(74, 172, 196, 0.4);
                            transition: all 0.3s ease;
                        }

                        .submit-button-container .merito-button:hover {
                            transform: translateY(-3px);
                            box-shadow: 0 12px 35px rgba(74, 172, 196, 0.6);
                        }

                        /* Responsive adjustments for confirmation */
                        @media (max-width: 768px) {
                            .confirmation-icon {
                                width: 60px;
                                height: 60px;
                                font-size: 2rem;
                            }

                            .confirmation-title {
                                font-size: 1.5rem;
                            }

                            .confirmation-text {
                                font-size: 1rem;
                            }

                            .submit-button-container .merito-button {
                                padding: 1rem 2rem;
                                font-size: 1rem;
                            }
                        }