Decompose into partials

app/views/home/_accommodations.html.erb

@@ -0,0 +1,39 @@
+<div id="accommodations" class="w-screen text-slate-900 lg:my-8 bg-[<%= color %>] lg:bg-[#fdfefe]">
+  <div class="container mx-auto bg-[<%= color %>] lg:rounded-2xl py-4 px-4 lg:mt-4 lg:pb-2 lg:shadow-2xl lg:mb-4">
+    <div class="w-fit mx-auto lg:flex lg:flex-row lg:justify-center lg:items-center">
+      <!-- <span class="text-7xl pl-4">🛏️</span> -->
+      <span class="text-5xl pl-4 lg:pt-4 rogue-script lg:text-7xl">Accommodations</span>
+    </div>
+
+    <div class="lg:w-2/3 px-8 lg:mx-auto">
+      <p class="text-lg text-justify">We have a wedding block for our guests at the Holiday Inn Express, which is a few minutes away from the venue. The block is booked now, but there are other hotels close by.</p>
+    </div>
+
+    <div class="flex flex-col my-4 lg:flex-row lg:w-fit lg:mx-auto lg:my-12">
+      <div class="flex flex-row basis-1/3  bg-[#fdfefe] rounded-lg mx-4 mt-4 px-4 py-4 items-center lg:p-12">
+	<img src="<%= image_path 'hiexpress.svg' %>" class="w-16 h-16" />
+	<div class="flex flex-col pl-2">
+	  <a href="" class="text-3xl">Holiday Inn</a>
+	  <span class="text-xl">3 minutes away</span>
+	  <span>610-399-4600</span>
+	</div>
+      </div>
+      <div class="flex flex-row basis-1/3  bg-[#fdfefe] rounded-lg mx-4 mt-4 px-4 py-4 items-center lg:p-12">
+	<img src="<%= image_path 'home2.svg' %>" class="w-16 h-16" />
+	<div class="flex flex-col pl-2">
+	  <a href="" class="text-3xl">Home2 Suites</a>
+	  <span class="text-xl">7 minutes away</span>
+	  <span>484-354-2985</span>
+	</div>
+      </div>
+      <div class="flex flex-row basis-1/3  bg-[#fdfefe] rounded-lg mx-4 mt-4 px-4 py-4 items-center lg:p-12">
+	<img src="<%= image_path 'residence-inn.svg' %>" class="w-16 h-16" />
+	<div class="flex flex-col pl-2">
+	  <a href="" class="text-3xl">Residence Inn</a>
+	  <span class="text-xl">12 minutes away</span>
+	  <span>610-459-1190</span>
+	</div>
+      </div>
+    </div>
+  </div>
+</div>