Fix: Footer and Hero Cermony buttons remove

src/components/EventDetails.tsx

@@ -36,50 +36,61 @@ export default function EventDetails() {
           </h2>
         </Reveal>
 
-        {/* Meeting details + location, as simple points below the title */}
+        <div className="mt-8 grid gap-8 lg:grid-cols-2 lg:items-stretch">
-        <Reveal delay={60}>
+          {/* Left: photo + details */}
-          <ul className="mx-auto mt-6 max-w-2xl space-y-3">
+          <Reveal delay={60}>
-            {DETAILS.map((d) => (
+            <div className="flex h-full flex-col">
-              <li key={d.label} className="flex items-start gap-3">
+              <div className="relative mx-auto overflow-hidden rounded-[1.5rem] shadow-[0_20px_50px_-20px_rgba(3,20,58,0.35)] ring-4 ring-white sm:mx-0">
-                <span className="mt-0.5 flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-rotary-blue/[0.08] text-rotary-blue">
+                <div className="relative h-56 w-full sm:h-64">
-                  <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" className="h-3.5 w-3.5">
+                  <Image
-                    {d.icon}
+                    src="/images/meeting.png"
-                  </svg>
+                    alt="Rotary Club of Vellore weekly meeting"
-                </span>
+                    fill
-                <p className="text-sm leading-relaxed text-rotary-ink/75">
+                    sizes="(min-width: 1024px) 560px, 100vw"
-                  <span className="font-semibold text-rotary-navy">{d.label}: </span>
+                    className="object-cover"
-                  {d.value}
+                  />
-                </p>
+                  <div className="absolute inset-x-0 bottom-0 bg-gradient-to-t from-rotary-navy/85 to-transparent px-4 pb-4 pt-10">
-              </li>
+                    <p className="text-[10px] uppercase tracking-widest text-rotary-goldlight">
-            ))}
+                      Fellowship, every week
-          </ul>
+                    </p>
-        </Reveal>
+                    <p className="text-base font-semibold leading-tight text-white">
-
+                      Fridays · 7:30 PM
-        {/* Premium portrait photo */}
+                    </p>
-        <Reveal delay={120}>
+                  </div>
-          <div className="mt-8 flex justify-center">
-            <div className="relative">
-              <div className="absolute -inset-3 rounded-[1.75rem] border border-rotary-gold/30" />
-              <div className="relative h-64 w-64 overflow-hidden rounded-[1.5rem] shadow-[0_20px_50px_-20px_rgba(3,20,58,0.35)] ring-4 ring-white sm:h-80 sm:w-[880px]">
-                <Image
-                  src="/images/meeting.png"
-                  alt="Rotary Club of Vellore weekly meeting"
-                  fill
-                  sizes="288px"
-                  className="object-cover"
-                />
-                <div className="absolute inset-x-0 bottom-0 bg-gradient-to-t from-rotary-navy/85 to-transparent px-4 pb-4 pt-10">
-                  <p className="text-[10px] uppercase tracking-widest text-rotary-goldlight">
-                    Fellowship, every week
-                  </p>
-                  <p className="font-serif text-base font-semibold leading-tight text-white">
-                    Fridays · 7:30 PM
-                  </p>
                 </div>
               </div>
+
+              <ul className="mt-6 space-y-3">
+                {DETAILS.map((d) => (
+                  <li key={d.label} className="flex items-start gap-3">
+                    <span className="mt-0.5 flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-rotary-blue/[0.08] text-rotary-blue">
+                      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" className="h-3.5 w-3.5">
+                        {d.icon}
+                      </svg>
+                    </span>
+                    <p className="text-sm leading-relaxed text-rotary-ink/75">
+                      <span className="font-semibold text-rotary-navy">{d.label}: </span>
+                      {d.value}
+                    </p>
+                  </li>
+                ))}
+              </ul>
             </div>
-          </div>
+          </Reveal>
-        </Reveal>
+
+          {/* Right: map */}
+          <Reveal delay={120}>
+            <div className="h-72 overflow-hidden rounded-[1.5rem] shadow-[0_20px_50px_-20px_rgba(3,20,58,0.35)] ring-4 ring-white sm:h-full sm:min-h-[22rem]">
+              <iframe
+                title="Ladies Recreation Club location map"
+                src="https://www.google.com/maps?q=12.9102532,79.1310174&hl=en&z=16&output=embed"
+                className="h-full w-full border-0"
+                loading="lazy"
+                referrerPolicy="no-referrer-when-downgrade"
+              />
+            </div>
+          </Reveal>
+        </div>
       </div>
     </section>
   );

src/components/Footer.tsx

@@ -77,9 +77,9 @@ export default function Footer() {
               href="https://www.rootxwire.com"
               target="_blank"
               rel="noopener noreferrer"
-              className="font-medium text-white/60 transition-colors duration-200 hover:text-rotary-goldlight"
+              className="font-large text-white transition-colors duration-200 hover:text-rotary-goldlight"
             >
-              Rootxwire
+              Root<span className="font-bold text-amber-600">X</span>wire
             </a>
           </p>
           {/* <a

src/components/Guests.tsx

@@ -24,7 +24,7 @@ export default function Guests() {
           <p className="text-center text-xs font-semibold uppercase tracking-[0.28em] text-rotary-azure">
             With us this evening
           </p>
-          <h2 className="mt-2 text-center font-serif text-3xl font-semibold text-rotary-navy sm:text-4xl">
+          <h2 className="mt-2 text-center text-3xl font-semibold text-rotary-navy sm:text-4xl">
             Distinguished Guests
           </h2>
         </Reveal>

src/components/Handover.tsx

@@ -152,7 +152,7 @@ export default function Handover() {
           <p className="text-center text-xs font-semibold uppercase tracking-[0.28em] text-rotary-azure">
             The gavel passes
           </p>
-          <h2 className="mt-2 text-center font-serif text-3xl font-semibold text-rotary-navy sm:text-4xl">
+          <h2 className="mt-2 text-center text-3xl font-semibold text-rotary-navy sm:text-4xl">
             A year of service, handed forward
           </h2>
         </Reveal>

src/components/OfficeBearers.tsx

@@ -77,7 +77,7 @@ export default function OfficeBearers() {
           <p className="text-center text-xs font-semibold uppercase tracking-[0.28em] text-rotary-azure">
             Office Bearers of 2026 – 27
           </p>
-          <h2 className="mt-2 text-center font-serif text-3xl font-semibold text-rotary-navy sm:text-4xl">
+          <h2 className="mt-2 text-center text-3xl font-semibold text-rotary-navy sm:text-4xl">
             The Directory
           </h2>
         </Reveal>