feat(telas maiores) últimas alterações das telas maiores com isso finalizando o desafio

docs(fiz um comentário no fim do html fazendo explicações)

index.html

@@ -142,22 +142,22 @@
 
              <footer class="footer">
                      <nav class="redes-sociais">
-                        <div class="centralizar">
+                        <div class="centralizar" width="100%">
                         <a href="/">
-                              <img src="imagens/Group (2).png" alt="logo instragan">
+                              <img src="imagens/Group (2).png" alt="logo instragan" width="11%">
                         </a> 
                         <a href="/">
-                              <img src="imagens/facebook-logo.png" alt="logo facebook">
+                              <img src="imagens/facebook-logo.png" alt="logo facebook" width="11%">
                         </a> 
                         <a href="/">
-                              <img src="imagens/youtube 2.png" alt="logo youtube">
+                              <img src="imagens/youtube 2.png" alt="logo youtube" width="11%">
                         </a> 
                         </div>
 
                         <div>
-                            <p  style="display:none">Copyright © 2020 - Loja  Comércio Eletrônico CNPJ: 000.000.000/0001-00
+                            <p class="copy">Copyright © 2020 - Loja  Comércio Eletrônico CNPJ: 000.000.000/0001-00
                            </p>
-                            <img src="imagens/0001-00.png" alt="copyright" width="90%">
+                            <img class="copy-responsivo" src="imagens/0001-00.png" alt="copyright" width="100%">
                          </div>
                     </nav>
                       
@@ -169,4 +169,16 @@
 
 
 </body>
+<!--finalizei o desafio as 15:20 do 13/10/2022. Explicação: todos os meus commit foram dado direto na main não peguei a ideia do git flow 
+e pelo curto prazo pra entrega decide focar direto no projeto.  A covention commit consegui entender um pouco por isso tentei usar mas não 
+sei se usei da maneira certa. Meu css esta extenso porque não consegui usar direito porcetagem
+fui fazendo breakpoiter com @media decidindo os pontos de partida, e fazendo em pixel as medidas.
+procurei ser o mais fiel possivel ao figman não ficou uma copia exata, mas acredito que fiz um bom trabalho.
+Com certeza deixei passar coisas despercebidas ou adicionei coisas desnecessarias e os códigos não devem estar limpos,porém, com o tempo
+e prática vou assimilando as coisas e ficará algo mais bonito. No mais estou feliz em ter completado e estar entregando.
+
+ Desde já agradeço a quem estiver corrigindo.
+
+ OBRIGADO
+-->
 </html>

style.css

@@ -196,8 +196,11 @@ h3{
 @media (max-width:1024px){
    .img-header{ 
       display: none;
+    }
 
-}
+    .copy{
+        display: none;
+    }
 
 .texto1{
  display: flex;
@@ -220,6 +223,7 @@ h3{
         
         font-size: 100%;
         margin-top: 5px;
+        
     }
 
     .pcs img{
@@ -369,6 +373,10 @@ h3{
         display: none;
     }
 
+    .copy-responsivo{
+        display: none;
+    }
+
     .card-compra{
        
         margin-top: 178px;
@@ -384,8 +392,6 @@ h3{
     }
 
     
-    
-    
     .card-compra2{
        
         margin-top: 129px;
@@ -398,27 +404,62 @@ h3{
     height: 332px;
  }
 
+ .cards p{
+
+    font-size: 13px;
+
+ }
+
+ .artigo{
+      
+      width: 550px;
+ }
+
+  
+
  .imagem_desfocada{
-    margin-top: 30px;
+    margin-top: 50px;
  }
 
 }
 
 @media (min-width: 1200px){
     .paragrafo1{
-        font-size: 18px;
+        font-size: 16px;
+        line-height: 20px;
     }
 
     .card p{
-        font-size: 18px;
+        font-size: 16px;
     }
     .cards p{
-            font-size: 18px;
+            font-size: 16px;
     }
 
     .artigo p{
+        font-size: 16px;
+    }
+}
+
+@media(min-width:1500px){
+    .paragrafo1{
         font-size: 18px;
     }
+    .card p{
+    font-size: 17px;
+    }
+
+    .cards p{
+        font-size: 17px;
+    }
+
+    h4{
+        font-size: 35px;
+    }
+
+    .artigo p{
+        font-size: 17px;
+    }
 }
 
 @media (min-width: 2000px){
@@ -432,6 +473,7 @@ h3{
     }
     .paragrafo1{
         font-size: 22px;
+        line-height: 22px;
     }
 
     
@@ -442,8 +484,13 @@ h3{
         
         }
 
+        .fundo-cinza{
+            margin-top: 450px;
+        }
+
         .card p{
             font-size: 22px;
+            line-height: 35px;
         }
 
         .cards{
@@ -453,14 +500,21 @@ h3{
 
         .cards p{
             font-size: 22px;
+            line-height: 35px;
         }
 
          h4{
             font-size: 35px;
         }
+        .artigo{
+           
+            width: 700px;
+            
+        }
 
         .artigo p{
             font-size: 22px;
+            line-height: 30px;
         }
 }
 
@@ -472,14 +526,15 @@ h3{
      }
 
     h3{
-        font-size: 70px;
+        font-size: 60px;
     }
     .sub-titulo{
-        font-size: 100px;
+        font-size: 80px;
         padding-top: 18px;
     }
     .paragrafo1{
-        font-size: 30px;
+        font-size: 29px;
+        line-height: 30px;
     }
 
     .card{
@@ -487,7 +542,12 @@ h3{
         height: 400px;
     }
     .card p{
-        font-size: 27px;
+        font-size: 30px;
+        line-height: 38px;
+    }
+
+    .fundo-cinza{
+        margin-top: 500px;
     }
 
     .cards{
@@ -496,14 +556,25 @@ h3{
     }
 
     .cards p{
-        font-size: 27px;
+        font-size: 30px;
+        line-height: 38px;
+    }
+
+    .artigo{
+        margin-top: 400px;
+        width: 1000px;
     }
     h4{
         font-size: 43px;
 
     }
     .artigo p{
-        font-size: 25px;
+        font-size: 30px;
+        line-height: 40px;
+    }
+
+    .imagem_desfocada{
+        margin-top: 100px;
     }
 
 }
@@ -513,9 +584,15 @@ h3{
         max-width: 1500px;
         height: 300px;
     }
+      h3{
+         font-size: 70px;
+      }
+      .sub-titulo{
+        font-size: 90px;
+      }
     .paragrafo1{
         
-        font-size:35px;
+        font-size:38px;
         line-height: 45px;
     }
     .card{
@@ -524,9 +601,13 @@ h3{
 
     }
 
+    .fundo-cinza{
+        margin-top: 600px;
+    }
+
     .card p{
-        font-size: 35px;
+        font-size: 38px;
-        line-height: 45px;
+        line-height: 49px;
     }
 
     .cards{
@@ -537,25 +618,89 @@ h3{
     }
 
     .cards p{
-        font-size: 35px;
+        font-size: 38px;
+        line-height: 49px;
     }
 
 
 .artigo{
     margin-top:500px;
+    width: 1600px;
+   
 }
 h4{
-    font-size: 60px;
+    font-size: 65px;
 }
 .artigo p{
-    font-size: 35px;
+    margin-top: 20px;
-    line-height: 45px;
+    font-size: 43px;
+    line-height: 49px;
 }
 .imagem_desfocada{
     margin-top: 150px;
 }
 }
 
+@media(min-width:3600px){
+    h3{
+        font-size: 85px;
+    }
+    .sub-titulo{
+        margin-top: 10px;
+        font-size: 105px;
+    }
+   .paragrafo1{
+     font-size: 45px;
+     line-height: 55px;
+   }
+
+   .card{
+    max-width: 800px;
+    height: 650px;
+    
+    }
+
+    .card p{
+        font-size: 45px;
+        line-height: 60px;
+        
+    }
+
+    .fundo-cinza{
+        margin-top: 900px;
+    }
+
+     .cards{
+        margin-top: 100px;
+        max-width: 900px;
+        height: 700px;
+     }
+
+     .cards p{
+         font-size: 45px;
+         line-height: 70px;
+     }
+
+     .artigo{
+        margin-top: 700px;
+     }
+
+     h4{
+        font-size: 90px;
+     }
+
+     .artigo p{
+        font-size: 50px;
+        line-height: 70px;
+     }
+
+     .imagem_desfocada{
+        margin-top: 300px;
+     }
+}
+
+
+