feat: add more content in homepage

src/components/Hero.tsx

@@ -38,15 +38,6 @@ export default function Hero6() {
           </video>
           <div className="bg-video-overlay bg-dark-alpha-50" />
         </div>
-        {/* <a onClick={toggleMuteUnmute} href="#" role="button" className="bg-video-button-muted">
-          <i className={`mi-volume-${isMuted ? "up" : "off"}`} />
-          <span className="visually-hidden">Volume On</span>
-        </a>
-        <a onClick={togglePlayPause} href="#" role="button" className="bg-video-button-pause">
-          <i className={`mi-${isPlaying ? "pause" : "play"}`} />
-          <span className="visually-hidden">Pause</span>
-        </a> */}
-        {/* End Background Video */}
         {/* Home Section Content */}
         <div className="home-content">
           <div className="row">
@@ -64,13 +55,13 @@ export default function Hero6() {
               <div className="local-scroll wch-unset wow fadeInUp" data-wow-delay="0.4s">
                 <a
                   href="#about"
-                  className="btn btn-mod btn-border-w btn-large btn-round ms-1 me-1 mt-2 align-middle"
+                  className="btn btn-mod btn-border-w btn-large btn-round ms-1 me-1 mt-2 align-middle w-full md:w-1/4"
                   data-btn-animate="y"
                 >
                   Learn More
                 </a>
                 <Link href="/radixact">
-                  <button className="btn btn-mod btn-w btn-border-w btn-round btn-large btn-hover-anim ms-1 me-1 mt-2 align-middle">
+                  <button className="btn btn-mod btn-w btn-border-w btn-round btn-large btn-hover-anim ms-1 me-1 mt-2 align-middle w-full md:w-1/4">
                     <span>Request Consultant</span>
                   </button>
                 </Link>

src/components/Homepage.tsx

@@ -11,6 +11,7 @@ import Link from "next/link";
 import TestimonialsDark from "./TestimonialsDark";
 import ContactDark from "./ContactDark";
 import { features4 } from "@/data/features";
+import Cta3 from "./cta3";
 
 export default function homepage({ onePage = false, dark = false }) {
   return (
@@ -152,10 +153,37 @@ export default function homepage({ onePage = false, dark = false }) {
           </div>
         </div>
       </section>
-      <section className={`page-section  ${dark ? "bg-dark-1 light-content" : ""} `}>
+
-        {dark ? <TestimonialsDark /> : <Testimonials />}
-      </section>
       <hr className={`mt-0 mb-0 ${dark ? "white" : ""} `} />
+      <section
+        className="page-section bg-scroll light-content"
+        style={{
+          backgroundImage: "url(/assets/images/demo-modern/section-bg-3.jpeg)",
+        }}
+      >
+        <div className="bg-overlay bg-gradient-dark-alpha-2 d-none d-md-block" />
+        {/* End Desktop Overlay */}
+        {/* Mobile Overlay */}
+        <div className="bg-overlay bg-dark-1 opacity-09 d-md-none" />
+        {/* End Mobile Overlay */}
+        <div className="container position-relative">
+          <div className="row wow fadeInUp">
+            <div className="col-md-7 offset-md-5 col-lg-6 offset-lg-6 col-xl-5 offset-xl-7">
+              <h2 className="section-title mb-40 mb-sm-30">A Cancer Treatment Center of Excellence</h2>
+              <p className="mb-50 mb-sm-40">
+                We believe our patients deserve and demand the very best in timely treatments, personalized care,
+                professional competence, and advanced technology. We will achieve this vision by employing caring and
+                competent staff with excellent training, developing multidisciplinary collaborations, and using the
+                latest technology available in the most comfortable environment.
+              </p>
+
+              {/* Features List */}
+              <Cta3 />
+              {/* End Features List */}
+            </div>
+          </div>
+        </div>
+      </section>
       <section className={`page-section  scrollSpysection  ${dark ? "bg-dark-1 light-content" : ""} `} id="blog">
         <div className={`bg-shape-3 ${dark ? "opacity-003" : ""} `}>
           <Image src="/assets/images/demo-slick/bg-shape-3.svg" width={1443} height={644} alt="" />

src/components/cta3.tsx

@@ -0,0 +1,26 @@
+import { features2 } from "@/data/features";
+import React from "react";
+
+export default function Cta3() {
+  return (
+    <>
+      <div className="row mt-n10">
+        {/* Features List Item */}
+        {features2.map((elm, i) => (
+          <>
+            <div key={i} className="col-lg-6 d-flex mt-10">
+              <div className="features-list-icon features-list-grad">
+                <i className="mi-check" />
+              </div>
+              <div>
+                <div className="features-list-text">{elm.text}</div>
+                <small className="text-sm">{elm.desc}</small>
+              </div>
+            </div>
+          </>
+        ))}
+        {/* End Features List Item */}
+      </div>
+    </>
+  );
+}

src/data/features.ts

@@ -73,19 +73,23 @@ export const features = [
 export const features2 = [
   {
     id: 1,
-    text: "Business to business",
+    text: "Hope",
+    desc: "Founded in 2006, COCHISE ONCOLOGY became a leader in cancer treatment. Hope lives here, guiding patients through tough times.",
   },
   {
     id: 2,
-    text: "Non-profit business",
+    text: "Strength",
+    desc: "We’ve greatly impacted Southern Arizona. Our facility is recognized for innovative and high-tech treatments.",
   },
   {
     id: 3,
-    text: "Business to customer",
+    text: "Courage",
+    desc: "Fighting cancer requires immense courage. We believe no one should face this alone, so we provide whole patient care.",
   },
   {
     id: 4,
-    text: "Ecommerce",
+    text: "Resilience",
+    desc: "adapt, recover, and grow stronger in the face of challenges and adversity",
   },
 ];