/**
 * ============================================================
 * DOMATEN Technology Stack
 * Responsive Styles
 * Version: 1.0.0
 * ============================================================
 */


/* ============================================================
   LARGE DESKTOP
============================================================ */

@media (min-width:1600px){

    .domaten-tech-stack{

        padding:110px 40px;

    }

}


/* ============================================================
   DESKTOP
============================================================ */

@media (max-width:1400px){

    .domaten-tech-grid{

        grid-template-columns:repeat(4,1fr);

        gap:22px;

    }

}


/* ============================================================
   TABLET
============================================================ */

@media (max-width:1024px){

    .domaten-tech-stack{

        padding:80px 24px;

    }

    .domaten-tech-grid{

        grid-template-columns:repeat(4,1fr);

        gap:20px;

    }

    .domaten-tech-tile{

        min-height:100px;

        padding:20px;

    }

    .domaten-tech-logo{

        max-width:54px;

        max-height:54px;

    }

}


/* ============================================================
   LARGE MOBILE
============================================================ */

@media (max-width:768px){

    .domaten-tech-stack{

        padding:70px 20px;

    }

    .domaten-tech-stack__title{

        font-size:2rem;

    }

    .domaten-tech-stack__description{

        font-size:.95rem;

        line-height:1.7;

    }

    .domaten-tech-grid{

        grid-template-columns:repeat(3,1fr);

        gap:18px;

        margin-top:45px;

    }

    .domaten-tech-tile{

        min-height:90px;

        padding:18px;

        border-radius:18px;

    }

    .domaten-tech-logo{

        max-width:46px;

        max-height:46px;

    }

}


/* ============================================================
   SMALL MOBILE
============================================================ */

@media (max-width:480px){

    .domaten-tech-stack{

        padding:60px 16px;

    }

    .domaten-tech-stack__badge{

        font-size:.72rem;

        padding:8px 14px;

    }

    .domaten-tech-stack__title{

        font-size:1.75rem;

    }

    .domaten-tech-grid{

        gap:14px;

    }

    .domaten-tech-tile{

        min-height:82px;

        padding:14px;

        border-radius:16px;

    }

    .domaten-tech-logo{

        max-width:40px;

        max-height:40px;

    }

}


/* ============================================================
   EXTRA SMALL DEVICES
============================================================ */

@media (max-width:340px){

    .domaten-tech-grid{

        grid-template-columns:repeat(2,1fr);

    }

}


/* ============================================================
   POPUP RESPONSIVE
============================================================ */

@media (max-width:768px){

    .domaten-tech-popup{

        max-width:100%;

        padding:30px 24px;

        border-radius:20px;

    }

    .domaten-tech-popup-title{

        font-size:1.6rem;

    }

    .domaten-tech-popup-description{

        font-size:.95rem;

    }

    .domaten-tech-popup-logo{

        width:64px;

        height:64px;

    }

}


@media (max-width:480px){

    .domaten-tech-popup{

        padding:24px 20px;

    }

    .domaten-tech-popup-close{

        width:38px;

        height:38px;

    }

}