:root{
    --color-primary:#6c63ff;
    --color-success:#00bf8e;
    --color-warning: #f7c94b;
    --color-danger:#f75842;
    --color-danger-variant:rgb(247, 88, 66,0.4);
    --color-white:#fff;
    --color-light:#dfdfdfb4;
    --color-black:#000;
    --color-bg1: #2e3267;
    --color-bg2: #424890;
    --color-bg: #1f2641;

    --container-width-lg: 76%;
    --container-width-md: 98%;
    --container-width-sm: 94%;

    --transition: all 900ms ease;
}

body{
    height: auto;
    width: auto;
}

.about-achievements{
    margin-top: 3rem;
}

.about-achievements-container{
    display: grid;
    grid-template-columns: 40% 60%;
    gap: 1rem;
}

.about-achievements-right > p{
    margin: 1.6rem 0 2.5rem;
}

.achievements-cards{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.achievements-card{
    background: var(--color-bg1);
    padding: 1.6rem;
    border-radius: 2rem;
    text-align: center;
    transition: var(--transition);
}

.achievements-card:hover{
    background: var(--color-bg2);
    box-shadow: 0 3rem 3rem rgba(0, 0, 0, 0.3);
}

.achievement-con img{
    padding: 0.6rem;
    display: inline-block;
    margin-bottom: 2rem;
    font-size: 2rem;
    border-radius: 2rem
}

.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.6s ease-out;
}

.reveal.show {
    opacity: 1;
    transform: translateY(0);
}


.counter {
  font-size: 2rem;
  font-weight: 700;
  color: var(--primary-color, #00296b); /* change color to your theme */
  transition: color 0.3s ease;
}

.achievements-card:hover .counter {
  color: var(--accent-color, #ff8c00);
}


.achevement-con img:nth-child(1){
    background: none;
}

.achevement-con img:nth-child(2){
    background: var(--color-warning);
}

.achevement-con img:nth-child(3){
    background: var(--color-success);
}

@media screen and (max-width: 1024) {
    .team-container{
        display: grid;
        grid-template-columns: 1fr;
        gap: 0;
    }
}