diff --git a/new menu page b/new menu page
new file mode 100644
index 0000000..673cd7f
--- /dev/null
+++ b/new menu page	
@@ -0,0 +1,84 @@
+<style>
+.hero-section { display: flex; flex-direction: column; overflow: hidden; }
+.hero-background { border-radius: 200px; background-color: #B26175; min-height: 353px; width: 100%; }
+.hero-content { z-index: 10; margin-top: -46px; width: 100%; }
+.content-wrapper { gap: 20px; display: flex; }
+.text-column { display: flex; flex-direction: column; width: 72%; }
+.text-content { display: flex; width: 100%; flex-direction: column; }
+.hero-title { color: #6D2714; margin: 0 85px 0 50px; font: 700 96px 'Lobster Two', sans-serif; }
+.subtitle-wrapper { display: flex; margin-top: 11px; width: 100%; align-items: start; gap: 40px 65px; color: #6D2714; flex-wrap: wrap; font: 500 37px 'Inter', sans-serif; }
+.subtitle-content { display: flex; margin-top: 20px; gap: 17px; flex-wrap: wrap; flex-grow: 1; flex-basis: auto; }
+.accent-circle-pink { background-color: #FD9485; border-radius: 50%; align-self: start; display: flex; margin-top: 4px; width: 40px; height: 40px; }
+.subtitle-text { flex-basis: auto; flex-grow: 1; }
+.accent-circle-red { background-color: #D2717A; border-radius: 50%; display: flex; width: 40px; height: 40px; }
+.description-wrapper { display: flex; margin-top: 27px; width: 100%; flex-direction: column; padding: 0 57px; }
+.description-text { color: #51140A; margin-right: 26px; font: 300 20px 'Poppins', sans-serif; }
+.cta-wrapper { align-self: end; margin-top: 52px; width: 758px; max-width: 100%; }
+.cta-content { gap: 20px; display: flex; }
+.cta-button-column { display: flex; flex-direction: column; width: 60%; }
+.cta-button { border-radius: 100px; background-color: #6D2714; color: #FFF; text-align: center; width: 100%; padding: 34px 45px; font: 400 33px 'Inter', sans-serif; }
+.accent-column { display: flex; flex-direction: column; width: 40%; margin-left: 20px; }
+.accent-circles { display: flex; margin-top: 32px; flex-grow: 1; flex-direction: column; }
+.accent-circle-yellow { background-color: #FFC368; border-radius: 50%; display: flex; width: 40px; height: 40px; }
+.accent-circle-red-bottom { background-color: #D2717A; border-radius: 50%; align-self: end; display: flex; margin-top: 72px; width: 40px; height: 40px; }
+.image-column { display: flex; flex-direction: column; width: 28%; margin-left: 20px; }
+.image-wrapper { display: flex; margin-top: 56px; flex-grow: 1; flex-direction: column; }
+.accent-circle-orange { background-color: #FDC672; border-radius: 50%; display: flex; margin-left: 118px; width: 40px; height: 40px; }
+.hero-image { aspect-ratio: 0.73; object-fit: contain; object-position: center; width: 100%; margin-top: 123px; }
+
+@media (max-width: 991px) {
+  .hero-background, .hero-content, .text-content, .description-wrapper, .cta-wrapper, .image-wrapper { max-width: 100%; }
+  .content-wrapper, .cta-content { flex-direction: column; align-items: stretch; gap: 0; }
+  .text-column, .cta-button-column, .accent-column, .image-column { width: 100%; margin-left: 0; }
+  .text-content, .image-wrapper { margin-top: 40px; }
+  .hero-title { margin-right: 10px; font-size: 40px; }
+  .description-wrapper { padding: 0 20px; }
+  .description-text { margin-right: 10px; }
+  .cta-button { margin-top: 40px; padding: 0 20px; }
+  .accent-circles, .accent-circle-red-bottom { margin-top: 40px; }
+  .accent-circle-orange { margin-left: 10px; }
+  .hero-image { margin-top: 40px; }
+}
+</style>
+
+<section class="hero-section">
+  <div class="hero-background"></div>
+  <div class="hero-content">
+    <div class="content-wrapper">
+      <div class="text-column">
+        <div class="text-content">
+          <h1 class="hero-title">Taste the Joy: Indulge in Our Heavenly Ice Cream!</h1>
+          <div class="subtitle-wrapper">
+            <div class="subtitle-content">
+              <div class="accent-circle-pink" aria-hidden="true"></div>
+              <p class="subtitle-text">"Discover the Creamiest, Dreamiest Ice Cream Flavors <br /> Crafted Just for You!"</p>
+            </div>
+            <div class="accent-circle-red" aria-hidden="true"></div>
+          </div>
+          <div class="description-wrapper">
+            <p class="description-text">"At Arcticdelights, we believe that every scoop tells a story. From classic favorites to adventurous concoctions, our artisan ice cream is made with the finest ingredients and a whole lot of love. Whether you're treating yourself to a delicious dessert or looking for the perfect gift, we have something for everyone!"</p>
+            <div class="cta-wrapper">
+              <div class="cta-content">
+                <div class="cta-button-column">
+                  <button class="cta-button">Explore Our Flavors</button>
+                </div>
+                <div class="accent-column">
+                  <div class="accent-circles">
+                    <div class="accent-circle-yellow" aria-hidden="true"></div>
+                    <div class="accent-circle-red-bottom" aria-hidden="true"></div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="image-column">
+        <div class="image-wrapper">
+          <div class="accent-circle-orange" aria-hidden="true"></div>
+          <img src="https://cdn.builder.io/api/v1/image/assets/TEMP/2285215a23e1edaf4c302ca5f666a039729a9d875a812fc8eb209f2a792c8ee4?placeholderIfAbsent=true&apiKey=fa22c26009ce45f18ff293ca0a4356fa" alt="Delicious ice cream cone" class="hero-image" />
+        </div>
+      </div>
+    </div>
+  </div>
+</section>