body{
    background:
        radial-gradient(circle at 50% 0%, rgba(138,43,226,0.22), transparent 35%),
        radial-gradient(circle at 0% 100%, rgba(124,252,0,0.12), transparent 30%),
        linear-gradient(180deg,#070707 0%,#160a24 35%,#2b0d46 65%,#0b3018 100%);
    color:#f5f5f5;
    font-family:Arial, Helvetica, sans-serif;
    margin:0;
    padding:30px;
    line-height:1.6;
    font-size:21px;
}


h1{
    text-align:center;
    color:#7CFC00;
    font-size:36px;
    font-weight:bold;
    letter-spacing:1px;
    text-shadow:
        0 0 5px #7CFC00,
        0 0 12px #7CFC00,
        0 0 25px #8A2BE2,
        0 0 45px #8A2BE2;
    border-bottom:3px solid #8A2BE2;
    padding-bottom:12px;
    margin-bottom:35px;
    position:relative;
}


h1::after{
    content:"";
    display:block;
    width:100px;
    height:3px;
    background:#7CFC00;
    margin:10px auto -15px;
    box-shadow:
        0 0 8px #7CFC00,
        0 0 18px #7CFC00;
    border-radius:10px;
}


img{
    display:block;
    margin:30px auto;
    width:320px;
    height:320px;
    max-width:100%;
    object-fit:cover;
    border-radius:18px;
    border:4px solid #4b0082;
    box-shadow:
        0 0 8px rgba(124,252,0,0.8),
        0 0 18px rgba(138,43,226,0.9),
        0 0 35px rgba(75,0,130,0.9),
        inset 0 0 20px rgba(0,0,0,0.5);
    transition:all 0.35s ease;
}


img:hover{
    transform:scale(1.03);
    border-color:#7CFC00;
    box-shadow:
        0 0 12px #7CFC00,
        0 0 25px #8A2BE2,
        0 0 50px #4b0082;
}


img.contador{
    width:150px;
    height:50px;
    object-fit:contain;
    border:2px solid #7CFC00;
    border-radius:10px;
    box-shadow:
        0 0 8px #7CFC00,
        0 0 18px rgba(138,43,226,0.8);
}


h2{
    background:
        linear-gradient(
            90deg,
            rgba(58,0,102,0.95),
            rgba(138,43,226,0.85),
            rgba(58,0,102,0.95)
        );
    color:#7CFC00;
    text-shadow:
        0 0 5px #7CFC00,
        0 0 12px rgba(124,252,0,0.7);
    font-size:27px;
    padding:12px 18px;
    border-left:6px solid #7CFC00;
    border-radius:10px;
    margin-top:40px;
    margin-bottom:18px;
    box-shadow:
        0 4px 15px rgba(0,0,0,0.35),
        0 0 12px rgba(138,43,226,0.35);
    transition:all 0.3s ease;
}


h2:hover{
    border-left-color:#8A2BE2;
    color:#ffffff;
    text-shadow:
        0 0 8px #7CFC00,
        0 0 15px #8A2BE2;
    transform:translateX(4px);
}


p{
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,0.07),
            rgba(255,255,255,0.025)
        );
    border-left:4px solid #7CFC00;
    border-radius:8px;
    padding:14px 16px;
    margin-bottom:16px;
    font-size:21px;
    text-align:justify;
    box-shadow:
        0 4px 15px rgba(0,0,0,0.25);
    transition:all 0.3s ease;
}


p:hover{
    background:
        linear-gradient(
            135deg,
            rgba(124,252,0,0.08),
            rgba(138,43,226,0.08)
        );
    border-left-color:#8A2BE2;
    box-shadow:
        0 0 12px rgba(138,43,226,0.25);
    transform:translateX(3px);
}


@media (max-width:600px){

    body{
        padding:18px;
        font-size:18px;
    }

    h1{
        font-size:29px;
    }

    h2{
        font-size:23px;
        padding:10px 14px;
    }

    p{
        font-size:18px;
        padding:12px;
    }

    img{
        width:280px;
        height:280px;
    }

    img.contador{
        width:150px;
        height:50px;
    }
}