/*---------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*---------------------------------------------------------------------- STYLE TO PHONE --------------------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 400px) {
    
    /*---------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
    /*------------------------------------------------------------------- REMOVE OS EFEITOS DE HOVER -------------------------------------------------------------------------*/
    /*---------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

        section.home .initial-text .social-links .bi:hover {
            opacity: 1;
            transform: none;
        }
        
        section.home .initial-text .button-cta .btn-projects:hover {
            opacity: 1;
            transform: none;
        }
        
        section.home .interface .flex .initial-text .button-cta .btn-about:hover {
            transform: none;
            background: none;
        }

    /*---------------------------------------------------------------------------------------------------------*/
    /*-------------------------------------------------  HOME  ------------------------------------------------*/
    /*---------------------------------------------------------------------------------------------------------*/
        section.home {
            height: auto; 
            padding: 20px; 
        }

        section.home .flex {
            flex-direction: column; 
            padding: 20px; 
        }

        section.home  .initial-img {
            margin-left: 0; 
            width: 100%; 
            max-width: 100%; 
            height: auto; 
            justify-content: center; 
        }

        section.home  .initial-img img {
            width: 80%; 
            height: auto;
        }

        section.home  .initial-text {
            align-items: center; 
            text-align: center; 
        }
    
        section.home .initial-text h2 {
            margin-top: 10px; 
            line-height: 35px;
            text-align: justify;
            text-justify: inter-word; 
            line-height: 25px;
        }

        section.home .initial-text p {
            margin-top: 5px;
            text-align: justify;
            text-justify: inter-word;
        }

        section.home .initial-text .social-links {
            justify-content: center; 
            padding-top: 20px; 
        }

        section.home .initial-text .social-links i {
            font-size: 32px; 
        }

        section.home .initial-text .button-cta {
            flex-direction: column; 
            align-items: center; 
            gap: 20px;
        }

}