body {
  margin: 0; /* remove espaço padrão do navegador */
}

   header {
            width: 100%;
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin: 0;
  padding: 0;
            background-color: #fff;
            color: white;
        }

        .logo {
            font-size: 24px;
            font-weight: bold;
            margin-left: 120px;
        }




        /* Navbar */
        .navbar {
            display: flex;
            gap: 20px;
            margin-right: 120px;

        }

        .navbar a {
            color: #343434;
            text-decoration: none;
            padding: 10px;
        }

        .navbar a:hover {
            
            background-color: #F2F2F2;
            border-radius: 5px;
        }

.h1{

      
 margin-left: 120px;
}
  
  


        /* Links de redes sociais */
        .social-links {
            display: flex;
            gap: 10px;
            margin-top: 10px;
        }

        .social-links a {
            color: white;
            text-decoration: none;
            font-size: 20px;
        }

      



 /* separacao de bloco */
  footer {
            background-color: #333;
            color: white;
            padding: 40px 20px;
        }

        .footer-container {
         max-width: 1200px;   /* largura do conteúdo do footer */
         margin: 0 auto;      /* centraliza o container */
         display: flex;
         justify-content: space-between; /* mantém espaço entre colunas */
         padding: 0 20px;     /* espaço interno nas laterais */
        }

        /* Colunas do Footer */
        .footer-column {             
            display: flex;
            flex-direction: column;
        }

        .footer-column h3 {
            margin-top: 0;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .footer-column p,
        .footer-column a {
            font-size: 14px;
            color: #ddd;
            text-decoration: none;
            margin-bottom: 8px;
        }

        .footer-column a:hover {
            color: #fff;
        }

        .footer-column .contact-info p {
            margin: 5px 0;
        }

        /* Linha de Divisão */
        .footer-line {
            margin: 40px 0;
            border-top: 1px solid #555;
        }

        .footer-bottom {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 20px;
        }


  .footer-bottom-final {
  font-size: 14px;
            color: #ddd;
              align-items:center;
  text-align: center;
        }

        .footer-bottom .certifications,
        .footer-bottom .payment-methods {
            display: flex;
            flex-direction: column;
            
        }

        .footer-bottom .certifications2,
        .footer-bottom .payment-methods2 {
            display: flex;
            flex-direction: row;
            
        }

        .footer-bottom a {
            color: #ddd;
            text-decoration: none;
            margin-top: 10px;
        }

 .footer-bottom-final a {
            color: #ddd;
            text-decoration: none;
            margin-top: 10px;
        }

        .footer-bottom a:hover {
            color: white;
        }

        .footer-bottom .payment-methods img {
            width: 100px;
            margin: 5px;
        }




 /* separacao de bloco */
 @media screen and (max-width: 1024px) {
            .footer-container {
                grid-template-columns: repeat(2, 1fr); /* 2 colunas por linha */
            }

            .footer-bottom {
                grid-template-columns: 1fr; /* 1 coluna por linha */
            }
        }


 @media screen and (max-width: 768px) {

             header {
                flex-direction: column;
                text-align: center;
            }

              .logo {
        flex-direction: column; /* logo em cima, nome embaixo */
         margin-left: 0px;
      }

            .navbar {
                flex-direction: column;
                gap: 10px;
                margin-right: 0px;
            }

            .social-links {
                flex-direction: column;
                text-align: center;
            }

  footer {
            background-color: #333;
            color: white;
            text-align: center;
            padding: 40px 20px;
        }


            .footer-container {
                grid-template-columns: 1fr; /* 1 coluna por linha */
            }

            .footer-bottom {
                grid-template-columns: 1fr; /* 1 coluna por linha */
            }

            .payment-methods .payment-methods2 {           
            align-items:center;
            text-align: center;           
            }



        }



