    .content1 {
        text-align: center;
        padding: 8px 12px;
        max-width: 280px;
        margin: 0 auto;

        /* Style retro green/black */
        background: linear-gradient(145deg, #0f1a12, #0a120c);
        border: 2px solid #00ff41;
        border-radius: 20px;
        box-shadow:
            0 0 15px #00ff4133,
            0 0 35px #00ff4122,
            inset 0 0 25px rgba(0, 255, 65, 0.08);

        position: relative;
        overflow: hidden;
    }

    /* Effet scanline retro (optionnel mais très sympa) */

    .content1::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: repeating-linear-gradient(
            to bottom,
            transparent 0px,
            transparent 3px,
            rgba(0, 255, 65, 0.03) 3px,
            rgba(0, 255, 65, 0.03) 6px
        );
        pointer-events: none;
        /*z-index: 1;*/
        border-radius: 18px;
    }

    .construction {
        font-size: 12px;
        font-weight: bold;
        color: #ffdd00;
        text-shadow: 0 0 6px #ff8800, 1px 1px 0 #000, -1px -1px 0 #000;
        margin: 6px 0;
        animation: float-smooth 3.5s ease-in-out infinite;
        letter-spacing: 1.5px;
        position: relative;
        /*z-index: 2;*/
    }

    .progress-container {
        margin: 8px 0;
        display: flex;
        justify-content: center;
        position: relative;
        /*z-index: 2;*/
    }

    .steps-vertical {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: fit-content;
        max-width: 100%;
        margin: 0 auto;
        position: relative;
    }

    .progress-bar {
        position: absolute;
        left: 10px;
        top: 0;
        bottom: 0;
        width: 3px;
        background: #111;
        /*z-index: 1;*/
    }

    .progress-fill {
        border-radius: 6px;
        position: absolute;
        left: 1px;
        top: 0;
        width: 16px;
        background: linear-gradient(to bottom, #ffffff, #ffffff);
        box-shadow: 0 0 12px #00ff41;
        /*z-index: 2;*/

        /* Limited to step 2 */
        height: 20%;           /* Change this more/less */

        /* Original style scanning animation, but capped */
        animation: fillVerticalLimited 0.8s ease-in-out infinite;
    }

    @keyframes fillVerticalLimited {
        0%    { height: 0%; }
        42%   { height: 95%; }     /* stops at step 2 */
        50%   { height: 95%; }     /* stops at step 2 */
        60%   { height: 95%; }
        70%   { height: 95%; opacity: 1; }
        80%   { height: 95%; opacity: 0.2; }
        85%   { height: 0%; opacity: 0; }
        100%  { height: 0%; }
    }

    .step {
        display: flex;
        align-items: center;
        margin: 3px 0;
        width: 100%;
        position: relative;
        /*z-index: 3;*/
    }

    .step-circle {
        width: 18px;
        height: 18px;
        background: #111;
        color: #00ff41;
        border: 1.5px solid #00ff41;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: bold;
        font-size: 9px;
        flex-shrink: 0;
        box-shadow: 0 0 8px #00ff4122;
    }

    .step.completed .step-circle {
        background: #00ff41;
        color: #000;
        box-shadow: 0 0 12px #00ff41;
    }

    .step.active .step-circle {
        background: #000;
        color: #00ff41;
        animation: pulse 1s infinite;
    }

    .step-label {
        margin-left: 10px;
        font-size: 20px;
        color: #00cc33;
        text-align: left;
        line-height: 1.15;
        font-weight: 500;
        white-space: nowrap;
    }

    .info {
        margin-top: 6px;
        color: #00cc33;
        font-size: 10px;
        position: relative;
        /*z-index: 2;*/
    }

    /* Animations */
    @keyframes float-smooth {
        0%, 100% { transform: translateY(0); }
        50%      { transform: translateY(-6px); }
    }


