diff --git a/README.md b/README.md
index 0a95c74..74e2a82 100644
--- a/README.md
+++ b/README.md
@@ -1,7 +1,8 @@
 # 🌐 web-project
 
 Welcome to **web-project**!  
-This repository is a simple web project, crafted with care using **HTML** and **CSS**. If you're looking for a clear, straightforward, and human example of a website, you've come to the right place! 😄
+
+This repository is a simple web project, crafted with care using **HTML** and **CSS**. If you're looking for a clear example of a website, you've come to the right place! 😄
 
 ## 🚀 What is this project?
 
diff --git a/src/pages/pagina1/home.html b/src/pages/pagina1/home.html
index 45f0a8b..3a7a81f 100644
--- a/src/pages/pagina1/home.html
+++ b/src/pages/pagina1/home.html
@@ -9,7 +9,7 @@
 </head>
 <body>
     <header>
-        <div class="logo">Fragpunk | simple gallery</div>
+        <div class="logo">gallery</div>
         <nav class="menu">
             <a href="../pagina2/galeria-flexbox.html">Flexbox</a>
             <a href="../pagina3/galeria-grid.html">Grid</a>
@@ -18,7 +18,7 @@
     </header>
     <main>
         <h2>Bem-vindo ao nosso site</h2>
-        <p>Esta é a página inicial usando Flexbox.</p>
+        <p>Esta é uma galeria de imagens do jogo FragPunk.</p>
     </main>
     <footer>
         <p>&copy; built by <a href="https://github.com/petrixia">cris</a>. all rights reserved.</p>
diff --git a/src/pages/pagina2/galeria-flexbox.html b/src/pages/pagina2/galeria-flexbox.html
index 8ba89bf..5d8a067 100644
--- a/src/pages/pagina2/galeria-flexbox.html
+++ b/src/pages/pagina2/galeria-flexbox.html
@@ -9,7 +9,7 @@
 </head>
 <body>
     <header>
-        <div class="logo">Fragpunk | simple gallery</div>
+        <div class="logo">gallery</div>
         <nav class="menu">
             <a href="../pagina1/home.html">Home</a>
             <a href="../pagina3/galeria-grid.html">Grid</a>
diff --git a/src/pages/pagina3/galeria-grid.html b/src/pages/pagina3/galeria-grid.html
index 4862216..c649ab4 100644
--- a/src/pages/pagina3/galeria-grid.html
+++ b/src/pages/pagina3/galeria-grid.html
@@ -9,7 +9,7 @@
 </head>
 <body>
     <header>
-        <div class="logo">Fragpunk | simple gallery</div>
+        <div class="logo">gallery</div>
         <nav class="menu">
             <a href="../pagina1/home.html">Home</a>
             <a href="../pagina2/galeria-flexbox.html">Flexbox</a>
diff --git a/src/pages/pagina4/galeria-hibrida.html b/src/pages/pagina4/galeria-hibrida.html
index de36b8c..ccabd06 100644
--- a/src/pages/pagina4/galeria-hibrida.html
+++ b/src/pages/pagina4/galeria-hibrida.html
@@ -9,7 +9,7 @@
 </head>
 <body>
     <header>
-        <div class="logo">Fragpunk | simple gallery</div>
+        <div class="logo">gallery</div>
         <nav class="menu">
             <a href="../pagina1/home.html">Home</a>
             <a href="../pagina2/galeria-flexbox.html">Flexbox</a>
diff --git a/src/styles/galeria-flexbox.css b/src/styles/galeria-flexbox.css
index 72f44a3..0992c4a 100644
--- a/src/styles/galeria-flexbox.css
+++ b/src/styles/galeria-flexbox.css
@@ -1,80 +1,45 @@
 body {
-    background: var(--color-bg-main);
-    display: flex;
-    flex-direction: column;
-    font-family: var(--font-family-main);
-    min-height: 100vh;
-}
-
-header {
-    align-items: center;
-    background: var(--color-bg-header);
-    color: var(--color-text-main);
-    display: flex;
-    justify-content: space-between;
-    padding: var(--space-lg) var(--space-page-side);
-}
-
-.logo {
-    color: var(--color-text-main);
-    font-size: var(--font-size-lg);
-    font-weight: var(--font-weight-bold);
-    letter-spacing: var(--letter-spacing-logo);
-}
-
-.menu {
-    display: flex;
-    gap: var(--space-xl);
-}
-
-.menu a {
-    color: var(--color-text-link);
-    font-size: var(--font-size-base);
-    font-weight: var(--font-weight-normal);
-    text-decoration: none;
-    transition: color 0.2s;
-}
-
-.menu a:hover {
-    color: var(--color-text-link-hover);
-    text-shadow: 0 0 2px var(--color-accent-2);
-}
-
-.menu a:active {
-    color: var(--color-text-link-active);
+  display: flex;
+  flex-direction: column;
 }
 
 main {
-    align-items: flex-start;
-    display: flex;
-    flex: 1;
-    justify-content: center;
-    min-height: 60vh;
-    padding: 0 4vw;
+  align-items: flex-start;
+  display: flex;
+  flex: 1;
+  justify-content: center;
 }
 
 section.gallery-container {
-    align-items: flex-start;
-    display: flex;
-    flex-wrap: wrap;
-    gap: var(--space-md);
-    justify-content: center;
-    max-width: var(--max-width-gallery);
-    padding: var(--space-md) 0;
-    width: 100%;
-}
-
-section.gallery-container > div {
-    aspect-ratio: 1/1;
-    background-position: center;
-    background-repeat: no-repeat;
-    background-size: cover;
-    border: var(--border-width-card) solid var(--color-card-border);
-    border-radius: var(--border-radius-card);
-    box-shadow: 0 2px 8px var(--color-card-shadow);
-    flex: 0 1 calc(33.33% - var(--space-md));
-    min-width: 200px;
-    width: 100%;
+  align-items: flex-start;
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--space-md);
+  justify-content: center;
+  max-width: var(--max-width-gallery);
+  padding: var(--space-md) 0;
+  width: 100%;
+}
+
+section.gallery-container>div {
+  aspect-ratio: 1/1;
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+  border: var(--border-width-card) solid var(--color-card-border);
+  border-radius: var(--border-radius-card);
+  box-shadow: 0 2px 8px var(--color-card-shadow);
+  flex: 0 1 calc(33.33% - var(--space-md));
+  min-width: min(200px, 100vw);
+  width: 100%;
+}
+
+@media (max-width: 600px) {
+  section.gallery-container>div {
+    flex-basis: 100%;
+    min-width: 0;
+    padding-bottom: 20px;
+  }
 }
 
 .image1 { background-image: url('../assets/foto1.png'); }
@@ -86,17 +51,3 @@ section.gallery-container > div {
 .image7 { background-image: url('../assets/foto7.png'); }
 .image8 { background-image: url('../assets/foto8.png'); }
 .image9 { background-image: url('../assets/foto9.png'); }
-
-footer {
-    align-items: center;
-    background: var(--color-bg-footer);
-    bottom: 0;
-    color: var(--color-text-main);
-    display: flex;
-    font-size: var(--font-size-base);
-    justify-content: center;
-    min-height: 56px;
-    padding: var(--space-sm) 0;
-    position: fixed;
-    width: 100vw;
-}
\ No newline at end of file
diff --git a/src/styles/galeria-grid.css b/src/styles/galeria-grid.css
index 7bd5d65..c846613 100644
--- a/src/styles/galeria-grid.css
+++ b/src/styles/galeria-grid.css
@@ -1,60 +1,19 @@
 body {
-    background: var(--color-bg-main);
     display: grid;
-    font-family: var(--font-family-main);
     grid-template-areas:
         "cabecalho"
         "galeria"
         "rodape";
     grid-template-columns: 1fr;
     grid-template-rows: auto 1fr auto;
-    min-height: 100vh;
 }
 
 header {
-    align-items: center;
-    background: var(--color-bg-header);
-    color: var(--color-text-main);
-    display: flex;
     grid-area: cabecalho;
-    justify-content: space-between;
-    padding: var(--space-lg) var(--space-page-side);
-}
-
-.logo {
-    color: var(--color-text-main);
-    font-size: var(--font-size-lg);
-    font-weight: var(--font-weight-bold);
-    letter-spacing: var(--letter-spacing-logo);
-}
-
-.menu {
-    display: flex;
-    gap: var(--space-xl);
-}
-
-.menu a {
-    color: var(--color-text-link);
-    font-size: var(--font-size-base);
-    font-weight: var(--font-weight-normal);
-    text-decoration: none;
-    transition: color 0.2s;
-}
-
-.menu a:hover {
-    color: var(--color-text-link-hover);
-}
-
-.menu a:active {
-    color: var(--color-text-link-active);
 }
 
 main {
-    display: grid;
     grid-area: galeria;
-    min-height: 60vh;
-    padding: 0 4vw;
-    place-items: center;
 }
 
 section.gallery-container {
@@ -68,7 +27,14 @@ section.gallery-container {
     width: 100%;
 }
 
-section.gallery-container > div {
+@media (max-width: 600px) {
+    section.gallery-container {
+        grid-template-columns: 1fr;
+        padding-bottom: 40px;
+    }
+}
+
+section.gallery-container>div {
     aspect-ratio: 1/1;
     background-position: center;
     background-repeat: no-repeat;
@@ -89,17 +55,7 @@ section.gallery-container > div {
 .image8 { background-image: url('../assets/foto8.png'); }
 .image9 { background-image: url('../assets/foto9.png'); }
 
+
 footer {
-    align-items: center;
-    background: var(--color-bg-footer);
-    bottom: 0;
-    color: var(--color-text-main);
-    display: flex;
-    font-size: var(--font-size-base);
     grid-area: rodape;
-    justify-content: center;
-    min-height: 56px;
-    padding: var(--space-sm) 0;
-    position: fixed;
-    width: 100vw;
 }
\ No newline at end of file
diff --git a/src/styles/galeria-hibrida.css b/src/styles/galeria-hibrida.css
index d26e6ea..a022d99 100644
--- a/src/styles/galeria-hibrida.css
+++ b/src/styles/galeria-hibrida.css
@@ -1,4 +1,3 @@
-/* Grid no body para estruturar as áreas principais */
 body {
     background: var(--color-bg-main);
     display: grid;
@@ -12,53 +11,12 @@ body {
     min-height: 100vh;
 }
 
-/* Flexbox no header */
 header {
-    align-items: center;
-    background: var(--color-bg-header);
-    color: var(--color-text-main);
-    display: flex;
     grid-area: cabecalho;
-    justify-content: space-between;
-    padding: var(--space-lg) var(--space-page-side);
-}
-
-.logo {
-    color: var(--color-text-main);
-    font-size: var(--font-size-lg);
-    font-weight: var(--font-weight-bold);
-    letter-spacing: var(--letter-spacing-logo);
-}
-
-.menu {
-    display: flex;
-    gap: var(--space-xl);
-}
-
-.menu a {
-    color: var(--color-text-link);
-    font-size: var(--font-size-base);
-    font-weight: var(--font-weight-normal);
-    text-decoration: none;
-    transition: color 0.2s;
 }
 
-.menu a:hover {
-    color: var(--color-text-link-hover);
-    text-shadow: 0 0 2px var(--color-accent-2);
-}
-
-.menu a:active {
-    color: var(--color-text-link-active);
-}
-
-/* Grid no main para galeria de 9 imagens */
 main {
-    display: grid;
     grid-area: galeria;
-    min-height: 60vh;
-    padding: 0 4vw;
-    place-items: center;
 }
 
 section.gallery-container {
@@ -72,7 +30,14 @@ section.gallery-container {
     width: 100%;
 }
 
-.gallery-container > div {
+@media (max-width: 600px) {
+  section.gallery-container {
+    grid-template-columns: 1fr;
+    padding-bottom: 40px;
+  }
+}
+
+.gallery-container>div {
     aspect-ratio: 1/1;
     background-position: center;
     background-size: cover;
@@ -92,18 +57,8 @@ section.gallery-container {
 .image8 { background-image: url('../assets/foto8.png'); }
 .image9 { background-image: url('../assets/foto9.png'); }
 
-/* Flexbox no footer para centralizar conteúdo */
 footer {
-    align-items: center;
-    background: var(--color-bg-footer);
-    bottom: 0;
-    color: var(--color-text-main);
     display: flex;
-    font-size: var(--font-size-base);
     grid-area: rodape;
     justify-content: center;
-    min-height: 56px;
-    padding: var(--space-sm) 0;
-    position: fixed;
-    width: 100vw;
 }
\ No newline at end of file
diff --git a/src/styles/home.css b/src/styles/home.css
index a46759b..72a737c 100644
--- a/src/styles/home.css
+++ b/src/styles/home.css
@@ -1,46 +1,6 @@
 body {
-    background: var(--color-bg-main);
     display: flex;
     flex-direction: column;
-    font-family: var(--font-family-main);
-    min-height: 100vh;
-}
-
-header {
-    align-items: center;
-    background: var(--color-bg-header);
-    color: var(--color-text-main);
-    display: flex;
-    justify-content: space-between;
-    padding: var(--space-lg) var(--space-page-side);
-}
-
-.logo {
-    color: var(--color-text-main);
-    font-size: var(--font-size-lg);
-    font-weight: var(--font-weight-bold);
-    letter-spacing: var(--letter-spacing-logo);
-}
-
-.menu {
-    display: flex;
-    gap: var(--space-xl);
-}
-
-.menu a {
-    color: var(--color-text-link);
-    font-size: var(--font-size-base);
-    font-weight: var(--font-weight-normal);
-    text-decoration: none;
-    transition: color 0.2s;
-}
-
-.menu a:hover {
-    color: var(--color-text-link-hover);
-}
-
-.menu a:active {
-    color: var(--color-text-link-active);
 }
 
 main {
@@ -49,8 +9,6 @@ main {
     flex: 1;
     flex-direction: column;
     justify-content: center;
-    min-height: 60vh;
-    padding: 0 4vw;
 }
 
 main h2 {
@@ -65,25 +23,3 @@ main p {
     max-width: 600px;
     text-align: center;
 }
-
-.image1 { background-image: url('../assets/foto1.png'); }
-.image2 { background-image: url('../assets/foto2.png'); }
-.image3 { background-image: url('../assets/foto3.png'); }
-.image4 { background-image: url('../assets/foto4.png'); }
-.image5 { background-image: url('../assets/foto5.png'); }
-.image6 { background-image: url('../assets/foto6.png'); }
-.image7 { background-image: url('../assets/foto7.png'); }
-.image8 { background-image: url('../assets/foto8.png'); }
-.image9 { background-image: url('../assets/foto9.png'); }
-
-footer {
-    align-items: center;
-    background: var(--color-bg-footer);
-    color: var(--color-text-main);
-    display: flex;
-    font-size: var(--font-size-base);
-    justify-content: center;
-    min-height: 56px;
-    padding: var(--space-sm) 0;
-    width: 100vw;
-}
\ No newline at end of file
diff --git a/src/styles/main.css b/src/styles/main.css
index 66f455d..bb6e96d 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -1,5 +1,4 @@
 :root {
-    /* Cores */   
     --color-bg-main: #18181b;
     --color-bg-header: #18181b;
     --color-bg-footer: #18181b;
@@ -14,7 +13,6 @@
     --color-card-shadow: #0003;
     --color-card-border: #fff;
 
-    /* Fontes */
     --font-family-main: 'Segoe UI', Arial, sans-serif;
     --font-size-base: 1rem;
     --font-size-lg: 1.5rem;
@@ -23,7 +21,7 @@
     --font-weight-bold: 700;
     --letter-spacing-logo: 1px;
 
-    /* Espaçamentos */
+
     --space-xs: 8px;
     --space-sm: 16px;
     --space-md: 20px;
@@ -32,12 +30,10 @@
     --space-section: 40px;
     --space-page-side: 5vw;
 
-    /* Bordas e radius */
     --border-radius-card: 12px;
     --border-radius-small: 8px;
     --border-width-card: 2px;
 
-    /* Larguras */
     --max-width-gallery: 1000px;
 }
 
@@ -55,10 +51,10 @@ header {
     align-items: center;
     background: var(--color-bg-header);
     box-sizing: border-box;
-    color: var(--color-text-main);
+    color: var(--color-accent-4);
     display: flex;
     justify-content: space-between;
-    padding: 24px 5vw;
+    padding: var(--space-lg) var(--space-page-side);
     width: 100vw;
 }
 
@@ -73,6 +69,12 @@ header {
     gap: var(--space-xl);
 }
 
+@media (max-width: 600px) {
+    .menu {
+        gap: var(--space-xs);
+    }
+}
+
 .menu a {
     color: var(--color-text-link);
     font-size: var(--font-size-base);
@@ -89,36 +91,35 @@ main {
     box-sizing: border-box;
     display: grid;
     flex: 1;
-    min-height: 60vh;
-    padding: 0 4vw;
+    min-block-size: 60vh;
+    padding: 0 clamp(1rem, 4vw, 3rem) clamp(3.5rem, 8vw, 4.5rem);
     place-items: center;
 }
 
 footer {
     align-items: center;
     background: var(--color-bg-footer);
+    bottom: 0;
     box-sizing: border-box;
     color: var(--color-text-main);
     display: flex;
     font-size: var(--font-size-base);
     justify-content: center;
     min-height: 56px;
-    padding: 16px 0;
+    padding: var(--space-sm) 0;
+    position: fixed;
     width: 100vw;
 }
 
 a {
-    color: inherit;
+    color: var(--color-text-link);
     text-decoration: none;
+    transition: color 0.3s ease;
 }
 
 a:hover {
     text-decoration: underline;
     transform: scale(0.95);
-}
-
-footer > p > a:hover {
-    color: #c0b88c;
-    text-decoration: underline;
-    transform: scale(0.95);
+    transition: color 0.3s ease, transform 0.2s ease;
+    color: var(--color-text-link-hover);
 }
\ No newline at end of file
