diff --git a/components/drops/view/BoostedDropCard.tsx b/components/drops/view/BoostedDropCard.tsx
index 8343bd735b..bbc3173629 100644
--- a/components/drops/view/BoostedDropCard.tsx
+++ b/components/drops/view/BoostedDropCard.tsx
@@ -11,6 +11,7 @@ import { buildProcessedContent } from "@/components/waves/drops/media-utils";
 import type { ApiDrop } from "@/generated/models/ApiDrop";
 import { convertApiDropToExtendedDrop } from "@/helpers/waves/drop.helpers";
 import { useDropBoostMutation } from "@/hooks/drops/useDropBoostMutation";
+import { ChevronRightIcon } from "@heroicons/react/24/outline";
 import Image from "next/image";
 import { memo, useCallback, useContext, useMemo } from "react";
 
@@ -70,14 +71,12 @@ const BoostedDropCard = memo(
         tabIndex={0}
       >
         <div className="tw-flex tw-items-center tw-gap-x-3">
-          {/* Rank badge */}
           <div className="tw-flex tw-size-6 tw-flex-shrink-0 tw-items-center tw-justify-center tw-rounded-full tw-bg-amber-600/20 tw-ring-1 tw-ring-amber-500/40">
             <span className="tw-text-xs tw-font-bold tw-text-amber-400">
               {rank}
             </span>
           </div>
 
-          {/* Author avatar */}
           <div className="tw-relative tw-size-8 tw-flex-shrink-0 tw-overflow-hidden tw-rounded-lg tw-bg-iron-900">
             {resolvedPfp ? (
               <Image
@@ -92,7 +91,6 @@ const BoostedDropCard = memo(
             )}
           </div>
 
-          {/* Content */}
           <div className="tw-min-w-0 tw-flex-1">
             <div className="tw-flex tw-items-center tw-gap-x-2">
               <UserCICAndLevel
@@ -109,7 +107,6 @@ const BoostedDropCard = memo(
             />
           </div>
 
-          {/* Boost count - clickable toggle */}
           <button
             onClick={handleBoostClick}
             disabled={!canBoost || isPending}
@@ -129,20 +126,7 @@ const BoostedDropCard = memo(
             </span>
           </button>
 
-          {/* Arrow indicator */}
-          <svg
-            className="tw-size-4 tw-flex-shrink-0 tw-text-iron-500 tw-transition-colors group-hover:tw-text-amber-400"
-            fill="none"
-            viewBox="0 0 24 24"
-            stroke="currentColor"
-          >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              d="M9 5l7 7-7 7"
-            />
-          </svg>
+          <ChevronRightIcon className="tw-size-4 tw-flex-shrink-0 tw-text-iron-500 tw-transition-colors group-hover:tw-text-amber-400" />
         </div>
       </div>
     );
diff --git a/components/home/HomePageContent.tsx b/components/home/HomePageContent.tsx
index 24e78a6171..c4726d38c9 100644
--- a/components/home/HomePageContent.tsx
+++ b/components/home/HomePageContent.tsx
@@ -1,52 +1,18 @@
 "use client";
 
-import { useState, useRef, useCallback } from "react";
-import type { ExtendedDrop } from "@/helpers/waves/drop.helpers";
-import SubmissionCarousel, {
-  type SubmissionCarouselHandle,
-} from "./carousel/SubmissionCarousel";
-import CarouselActiveItemVote from "./carousel/CarouselActiveItemVote";
-import CarouselActiveItemDetails from "./carousel/CarouselActiveItemDetails";
+import SubmissionCarouselSection from "./SubmissionCarouselSection";
 import { NowMintingSection } from "./now-minting";
 import { NextMintLeadingSection } from "./next-mint-leading";
 import { BoostedSection } from "./boosted";
 import { ExploreWavesSection } from "./explore-waves";
-import { CarouselHeader, HeroHeader } from "./hero";
+import { HeroHeader } from "./hero";
 
 export default function HomePageContent() {
-  const [activeDrop, setActiveDrop] = useState<ExtendedDrop | null>(null);
-  const carouselRef = useRef<SubmissionCarouselHandle>(null);
-
-  const pauseAutoplay = useCallback(
-    () => carouselRef.current?.pauseAutoplay(),
-    []
-  );
-  const resumeAutoplay = useCallback(
-    () => carouselRef.current?.resumeAutoplay(),
-    []
-  );
-
   return (
     <div className="tw-overflow-x-hidden tw-border-y-0 tw-border-l-0 tw-border-r tw-border-solid tw-border-iron-900">
       <HeroHeader />
       <NowMintingSection />
-      <section
-        className="tw-grid tw-h-auto tw-grid-rows-[auto_1fr_auto] sm:tw-h-[100svh] [@media(min-height:1200px)]:tw-h-auto [@media(min-height:1200px)]:tw-grid-rows-[auto_auto_auto] [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-h-auto [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-grid-rows-[auto_auto_auto]"
-        onMouseEnter={pauseAutoplay}
-        onMouseLeave={resumeAutoplay}
-      >
-        <CarouselHeader />
-        <div className="tw-min-h-0 [@media(min-height:1200px)]:tw-max-h-[800px] [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-h-[min(70svh,600px)]">
-          <SubmissionCarousel
-            ref={carouselRef}
-            onActiveDropChange={setActiveDrop}
-          />
-        </div>
-        {activeDrop && <CarouselActiveItemVote drop={activeDrop} />}
-      </section>
-      <div onMouseEnter={pauseAutoplay} onMouseLeave={resumeAutoplay}>
-        <CarouselActiveItemDetails drop={activeDrop} />
-      </div>
+      <SubmissionCarouselSection />
       <div className="tw-mt-10 tw-border tw-border-x-0 tw-border-b-0 tw-border-t tw-border-solid tw-border-iron-800 tw-pt-10 md:tw-mt-16 md:tw-pt-16">
         <NextMintLeadingSection />
         <BoostedSection />
diff --git a/components/home/SubmissionCarouselSection.tsx b/components/home/SubmissionCarouselSection.tsx
new file mode 100644
index 0000000000..0bc32d532c
--- /dev/null
+++ b/components/home/SubmissionCarouselSection.tsx
@@ -0,0 +1,94 @@
+"use client";
+
+import { useCallback, useRef, useState } from "react";
+import type { ExtendedDrop } from "@/helpers/waves/drop.helpers";
+import CarouselActiveItemDetails from "./carousel/CarouselActiveItemDetails";
+import CarouselActiveItemVote from "./carousel/CarouselActiveItemVote";
+import SubmissionCarousel, {
+  type SubmissionCarouselHandle,
+} from "./carousel/SubmissionCarousel";
+import { CarouselHeader } from "./hero";
+
+export default function SubmissionCarouselSection() {
+  const [activeDrop, setActiveDrop] = useState<ExtendedDrop | null>(null);
+  const carouselRef = useRef<SubmissionCarouselHandle>(null);
+  const isPointerInsideRef = useRef(false);
+  const isVotingModalOpenRef = useRef(false);
+  const isAutoplayPausedRef = useRef(false);
+
+  const updateAutoplayState = useCallback(() => {
+    const shouldPause =
+      isPointerInsideRef.current || isVotingModalOpenRef.current;
+    if (shouldPause === isAutoplayPausedRef.current) {
+      return;
+    }
+    isAutoplayPausedRef.current = shouldPause;
+    if (shouldPause) {
+      carouselRef.current?.pauseAutoplay();
+    } else {
+      carouselRef.current?.resumeAutoplay();
+    }
+  }, []);
+
+  const handlePointerEnter = useCallback(() => {
+    isPointerInsideRef.current = true;
+    updateAutoplayState();
+  }, [updateAutoplayState]);
+
+  const handlePointerMove = useCallback(() => {
+    if (isPointerInsideRef.current) {
+      return;
+    }
+    isPointerInsideRef.current = true;
+    updateAutoplayState();
+  }, [updateAutoplayState]);
+
+  const handlePointerLeave = useCallback(() => {
+    isPointerInsideRef.current = false;
+    updateAutoplayState();
+  }, [updateAutoplayState]);
+
+  const handleVoteOpen = useCallback(() => {
+    isVotingModalOpenRef.current = true;
+    updateAutoplayState();
+  }, [updateAutoplayState]);
+
+  const handleVoteClose = useCallback(() => {
+    isVotingModalOpenRef.current = false;
+    updateAutoplayState();
+  }, [updateAutoplayState]);
+
+  const handleCarouselRef = useCallback(
+    (instance: SubmissionCarouselHandle | null) => {
+      carouselRef.current = instance;
+      updateAutoplayState();
+    },
+    [updateAutoplayState]
+  );
+
+  return (
+    <div
+      onPointerEnter={handlePointerEnter}
+      onPointerMove={handlePointerMove}
+      onPointerLeave={handlePointerLeave}
+    >
+      <section className="tw-grid tw-h-auto tw-grid-rows-[auto_1fr_auto] sm:tw-h-[100svh] [@media(min-height:1200px)]:tw-h-auto [@media(min-height:1200px)]:tw-grid-rows-[auto_auto_auto] [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-h-auto [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-grid-rows-[auto_auto_auto]">
+        <CarouselHeader />
+        <div className="tw-min-h-0 [@media(min-height:1200px)]:tw-max-h-[800px] [@media(min-width:768px)_and_(orientation:portrait)_and_(max-height:1199px)]:tw-h-[min(70svh,600px)]">
+          <SubmissionCarousel
+            ref={handleCarouselRef}
+            onActiveDropChange={setActiveDrop}
+          />
+        </div>
+        {activeDrop && (
+          <CarouselActiveItemVote
+            drop={activeDrop}
+            onVoteOpen={handleVoteOpen}
+            onVoteClose={handleVoteClose}
+          />
+        )}
+      </section>
+      <CarouselActiveItemDetails drop={activeDrop} />
+    </div>
+  );
+}
diff --git a/components/home/boosted/BoostedDropCardHome.tsx b/components/home/boosted/BoostedDropCardHome.tsx
index 4d9a55e690..28b120ae39 100644
--- a/components/home/boosted/BoostedDropCardHome.tsx
+++ b/components/home/boosted/BoostedDropCardHome.tsx
@@ -9,7 +9,7 @@ import ContentDisplay from "@/components/waves/drops/ContentDisplay";
 import { buildProcessedContent } from "@/components/waves/drops/media-utils";
 import type { ApiDrop } from "@/generated/models/ApiDrop";
 import { getScaledImageUri, ImageScale } from "@/helpers/image.helpers";
-import { LinkIcon } from "@heroicons/react/24/outline";
+import { LinkIcon, Square2StackIcon } from "@heroicons/react/24/outline";
 import Link from "next/link";
 import { memo, useCallback, useMemo } from "react";
 
@@ -71,6 +71,10 @@ const BoostedDropCardHome = memo(
         <div className="tw-relative tw-aspect-[4/5] tw-w-full tw-overflow-hidden tw-rounded-xl sm:tw-aspect-[3/4]">
           {media ? (
             <div className="tw-relative tw-h-full tw-w-full">
+              <Square2StackIcon
+                className="tw-pointer-events-none tw-absolute tw-left-6 tw-top-8 tw-z-10 tw-size-6 tw-text-iron-700 tw-opacity-50"
+                aria-hidden="true"
+              />
               {/* Glow effect */}
               <div
                 className="tw-pointer-events-none tw-absolute tw-inset-0 tw-opacity-40 tw-blur-3xl tw-transition-opacity tw-duration-700 group-hover:tw-opacity-60"
diff --git a/components/home/carousel/CarouselActiveItemDetails.tsx b/components/home/carousel/CarouselActiveItemDetails.tsx
index d4faec07fb..1a83e5ba0d 100644
--- a/components/home/carousel/CarouselActiveItemDetails.tsx
+++ b/components/home/carousel/CarouselActiveItemDetails.tsx
@@ -6,7 +6,7 @@ import type { ExtendedDrop } from "@/helpers/waves/drop.helpers";
 import { ChevronDownIcon } from "@heroicons/react/24/outline";
 import Image from "next/image";
 import Link from "next/link";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 interface CarouselActiveItemDetailsProps {
   readonly drop: ExtendedDrop | null;
@@ -16,6 +16,11 @@ export default function CarouselActiveItemDetails({
   drop,
 }: CarouselActiveItemDetailsProps) {
   const [isExpanded, setIsExpanded] = useState(false);
+  const dropId = drop?.id;
+
+  useEffect(() => {
+    setIsExpanded(false);
+  }, [dropId]);
 
   if (!drop) {
     return null;
@@ -33,6 +38,7 @@ export default function CarouselActiveItemDetails({
   return (
     <div className="tw-mx-auto tw-flex tw-w-full tw-max-w-2xl tw-flex-col tw-items-center tw-px-4 tw-py-4 md:tw-px-6 lg:tw-px-8">
       <Link
+        prefetch={false}
         href={`/waves?wave=${drop.wave.id}&drop=${drop.id}`}
         className="tw-mb-2 tw-block tw-text-center tw-text-lg tw-font-semibold tw-text-white tw-no-underline desktop-hover:hover:tw-text-white md:tw-text-xl"
       >
@@ -40,6 +46,7 @@ export default function CarouselActiveItemDetails({
       </Link>
 
       <Link
+        prefetch={false}
         href={`/${author.handle ?? author.primary_address}`}
         className="tw-flex tw-items-center tw-gap-x-2 tw-no-underline"
       >
diff --git a/components/home/carousel/CarouselActiveItemVote.tsx b/components/home/carousel/CarouselActiveItemVote.tsx
index 9f2d53d608..9e8d3d24e4 100644
--- a/components/home/carousel/CarouselActiveItemVote.tsx
+++ b/components/home/carousel/CarouselActiveItemVote.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useState } from "react";
+import { useCallback, useState } from "react";
 import type { ExtendedDrop } from "@/helpers/waves/drop.helpers";
 import { WaveDropVoteSummary } from "@/components/waves/drop/WaveDropVoteSummary";
 import { VotingModal, MobileVotingModal } from "@/components/voting";
@@ -9,15 +9,33 @@ import { useDropInteractionRules } from "@/hooks/drops/useDropInteractionRules";
 
 interface CarouselActiveItemVoteProps {
   readonly drop: ExtendedDrop;
+  readonly onVoteOpen?: (() => void) | undefined;
+  readonly onVoteClose?: (() => void) | undefined;
 }
 
 export default function CarouselActiveItemVote({
   drop,
+  onVoteOpen,
+  onVoteClose,
 }: CarouselActiveItemVoteProps) {
   const [isVotingOpen, setIsVotingOpen] = useState(false);
+  const [lockedDrop, setLockedDrop] = useState<ExtendedDrop | null>(null);
   const isMobileScreen = useIsMobileScreen();
   const { canShowVote, isVotingEnded, isWinner } =
     useDropInteractionRules(drop);
+  const modalDrop = lockedDrop ?? drop;
+
+  const handleOpenVote = useCallback(() => {
+    setLockedDrop(drop);
+    setIsVotingOpen(true);
+    onVoteOpen?.();
+  }, [drop, onVoteOpen]);
+
+  const handleCloseVote = useCallback(() => {
+    setIsVotingOpen(false);
+    setLockedDrop(null);
+    onVoteClose?.();
+  }, [onVoteClose]);
 
   return (
     <div className="tw-mt-4 tw-flex tw-items-center tw-justify-center tw-px-4 md:tw-px-6 lg:tw-px-8">
@@ -26,22 +44,23 @@ export default function CarouselActiveItemVote({
         isWinner={isWinner}
         isVotingEnded={isVotingEnded}
         canShowVote={canShowVote}
-        onVoteClick={() => setIsVotingOpen(true)}
+        onVoteClick={handleOpenVote}
       />
 
-      {isMobileScreen ? (
-        <MobileVotingModal
-          drop={drop}
-          isOpen={isVotingOpen}
-          onClose={() => setIsVotingOpen(false)}
-        />
-      ) : (
-        <VotingModal
-          drop={drop}
-          isOpen={isVotingOpen}
-          onClose={() => setIsVotingOpen(false)}
-        />
-      )}
+      {isVotingOpen &&
+        (isMobileScreen ? (
+          <MobileVotingModal
+            drop={modalDrop}
+            isOpen={true}
+            onClose={handleCloseVote}
+          />
+        ) : (
+          <VotingModal
+            drop={modalDrop}
+            isOpen={true}
+            onClose={handleCloseVote}
+          />
+        ))}
     </div>
   );
 }
diff --git a/components/home/carousel/CarouselArrow.tsx b/components/home/carousel/CarouselArrow.tsx
index bce83d25c1..eded57e02e 100644
--- a/components/home/carousel/CarouselArrow.tsx
+++ b/components/home/carousel/CarouselArrow.tsx
@@ -33,7 +33,7 @@ export default function CarouselArrow({
       onClick={onClick}
       disabled={disabled}
       aria-label={isLeft ? "Previous" : "Next"}
-      className={`${placementClasses} tw-z-20 tw-flex tw-h-11 tw-w-11 tw-items-center tw-justify-center tw-rounded-full tw-border tw-border-solid tw-border-white/10 tw-bg-white/20 tw-text-white tw-backdrop-blur-md tw-transition-all tw-duration-300 hover:tw-border-white/20 hover:tw-bg-white/[0.15] disabled:tw-cursor-not-allowed disabled:tw-opacity-40 disabled:hover:tw-border-white/10 disabled:hover:tw-bg-white/10 ${className}`}
+      className={`${placementClasses} tw-z-20 tw-flex tw-h-11 tw-w-11 tw-items-center tw-justify-center tw-rounded-full tw-border tw-border-solid tw-border-white/10 tw-bg-white/20 tw-text-white tw-backdrop-blur-md tw-transition-all tw-duration-300 hover:tw-border-white/20 hover:tw-bg-white/[0.15] disabled:tw-cursor-not-allowed disabled:tw-opacity-45 disabled:tw-text-white/60 disabled:tw-border-white/10 disabled:tw-bg-white/15 disabled:hover:tw-border-white/15 disabled:hover:tw-bg-white/15 ${className}`}
       style={style}
     >
       <FontAwesomeIcon
diff --git a/components/home/carousel/SubmissionArtworkCard.tsx b/components/home/carousel/SubmissionArtworkCard.tsx
index 7602ff8d4e..dd6347cd2e 100644
--- a/components/home/carousel/SubmissionArtworkCard.tsx
+++ b/components/home/carousel/SubmissionArtworkCard.tsx
@@ -6,23 +6,22 @@ import {
   getDropPreviewImageUrl,
   type ExtendedDrop,
 } from "@/helpers/waves/drop.helpers";
-import { useMediaQuery } from "@/hooks/useMediaQuery";
 import { useMemo } from "react";
 
 interface SubmissionArtworkCardProps {
   readonly drop: ExtendedDrop;
   readonly isActive?: boolean;
+  readonly imageScale?: ImageScale;
+  readonly renderMode?: "full" | "preview" | "placeholder";
 }
 
 export default function SubmissionArtworkCard({
   drop,
   isActive = true,
+  imageScale = ImageScale.AUTOx600,
+  renderMode = "full",
 }: SubmissionArtworkCardProps) {
   const media = drop.parts[0]?.media[0];
-  const isTabletOrSmaller = useMediaQuery("(max-width: 1023px)");
-  const mediaImageScale = isTabletOrSmaller
-    ? ImageScale.AUTOx450
-    : ImageScale.AUTOx600;
 
   const previewImageUrl = useMemo(
     () => getDropPreviewImageUrl(drop.metadata),
@@ -33,6 +32,11 @@ export default function SubmissionArtworkCard({
     return null;
   }
 
+  const isImage = media.mime_type?.includes("image");
+  const canRenderPreview = !!previewImageUrl || isImage;
+  const shouldRenderPlaceholder =
+    renderMode === "placeholder" || (renderMode === "preview" && !canRenderPreview);
+
   const mediaWrapperClasses = `tw-h-full tw-w-full ${
     isActive
       ? "tw-shadow-[0_8px_32px_rgba(255,255,255,0.08)]"
@@ -40,19 +44,23 @@ export default function SubmissionArtworkCard({
   }`;
 
   return (
-    <div className="tw-h-full tw-w-full tw-overflow-hidden tw-bg-black">
+    <div className="tw-relative tw-h-full tw-w-full tw-overflow-hidden tw-bg-black">
       <div className="tw-pointer-events-none tw-absolute tw-inset-0 tw-z-10 tw-mt-2 tw-rounded-lg tw-shadow-[inset_0_0_20px_rgba(0,0,0,0.3)] tw-ring-1 tw-ring-inset tw-ring-white/[0.15]" />
       <div
         className={mediaWrapperClasses}
         onClick={isActive ? (event) => event.stopPropagation() : undefined}
       >
-        <MediaDisplay
-          media_mime_type={drop.parts[0]?.media[0]!.mime_type ?? "image/jpeg"}
-          media_url={drop.parts[0]?.media[0]!.url!}
-          disableMediaInteraction={true}
-          imageScale={mediaImageScale}
-          previewImageUrl={previewImageUrl}
-        />
+        {shouldRenderPlaceholder ? (
+          <div className="tw-h-full tw-w-full tw-rounded-lg tw-bg-iron-950" />
+        ) : (
+          <MediaDisplay
+            media_mime_type={media.mime_type ?? "image/jpeg"}
+            media_url={media.url ?? ""}
+            disableMediaInteraction={true}
+            imageScale={imageScale}
+            previewImageUrl={previewImageUrl}
+          />
+        )}
       </div>
     </div>
   );
diff --git a/components/home/carousel/SubmissionCarousel.tsx b/components/home/carousel/SubmissionCarousel.tsx
index c67bb31db4..e7cb2a5e31 100644
--- a/components/home/carousel/SubmissionCarousel.tsx
+++ b/components/home/carousel/SubmissionCarousel.tsx
@@ -1,14 +1,17 @@
 "use client";
 
 import { useSeizeSettings } from "@/contexts/SeizeSettingsContext";
+import { ImageScale } from "@/helpers/image.helpers";
 import type { ExtendedDrop } from "@/helpers/waves/drop.helpers";
 import useDeviceInfo from "@/hooks/useDeviceInfo";
+import { useMediaQuery } from "@/hooks/useMediaQuery";
 import {
   useWaveDropsLeaderboard,
   WaveDropsLeaderboardSort,
 } from "@/hooks/useWaveDropsLeaderboard";
 import {
   forwardRef,
+  memo,
   useCallback,
   useEffect,
   useImperativeHandle,
@@ -32,11 +35,14 @@ interface SubmissionCarouselProps {
   readonly onActiveDropChange?: (drop: ExtendedDrop | null) => void;
 }
 
-const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarouselProps>(
-  function SubmissionCarousel({ onActiveDropChange }, ref) {
+const SubmissionCarousel = forwardRef<
+  SubmissionCarouselHandle,
+  SubmissionCarouselProps
+>(function SubmissionCarousel({ onActiveDropChange }, ref) {
   const { seizeSettings, isLoaded } = useSeizeSettings();
   const { hasTouchScreen } = useDeviceInfo();
   const waveId = seizeSettings.memes_wave_id;
+  const isTabletOrSmaller = useMediaQuery("(max-width: 1023px)");
 
   const { drops, isFetching } = useWaveDropsLeaderboard({
     waveId: waveId ?? "",
@@ -46,10 +52,20 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
 
   const swiperRef = useRef<SwiperInstance | null>(null);
 
-  useImperativeHandle(ref, () => ({
-    pauseAutoplay: () => swiperRef.current?.autoplay.pause(),
-    resumeAutoplay: () => swiperRef.current?.autoplay.resume(),
-  }));
+  useImperativeHandle(
+    ref,
+    () => ({
+      pauseAutoplay: () => {
+        if (hasTouchScreen) return;
+        swiperRef.current?.autoplay?.stop?.();
+      },
+      resumeAutoplay: () => {
+        if (hasTouchScreen) return;
+        swiperRef.current?.autoplay?.start?.();
+      },
+    }),
+    [hasTouchScreen]
+  );
 
   const [activeIndex, setActiveIndex] = useState(0);
   const [canScrollLeft, setCanScrollLeft] = useState(false);
@@ -58,7 +74,6 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
   const inactiveScale = 0.68;
   const slideTransition =
     "transform 0.45s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.45s cubic-bezier(0.25, 1, 0.5, 1)";
-  const inactiveFilter = "grayscale(100%) blur(6px)";
   const slideWidth = "var(--carousel-card-width)";
   const carouselVars = {
     "--carousel-inactive-scale": `${inactiveScale}`,
@@ -66,6 +81,13 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
     "--carousel-arrow-offset":
       "calc((var(--carousel-card-width) / 2) + var(--carousel-gap) + (var(--carousel-card-width) * var(--carousel-inactive-scale) / 2))",
   } as CSSProperties;
+  const autoplayConfig = useMemo(
+    () =>
+      hasTouchScreen
+        ? false
+        : { delay: 4000, disableOnInteraction: true },
+    [hasTouchScreen]
+  );
 
   const shuffledDrops = useMemo(() => {
     const filtered = drops.filter(
@@ -87,6 +109,9 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
     () => shuffledDrops[activeIndex] ?? shuffledDrops[0] ?? null,
     [activeIndex, shuffledDrops]
   );
+  const mediaImageScale = isTabletOrSmaller
+    ? ImageScale.AUTOx450
+    : ImageScale.AUTOx600;
 
   const handleSlideChange = useCallback((swiper: SwiperInstance) => {
     setActiveIndex(swiper.activeIndex);
@@ -105,6 +130,12 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
     }
   }, [activeIndex, shuffledDrops.length]);
 
+  useEffect(() => {
+    if (hasTouchScreen) {
+      swiperRef.current?.autoplay?.stop?.();
+    }
+  }, [hasTouchScreen]);
+
   const scroll = useCallback((direction: "left" | "right") => {
     const swiper = swiperRef.current;
     if (!swiper) return;
@@ -150,26 +181,39 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
           )}
 
           <Swiper
-            className="submission-carousel-swiper tw-h-full tw-overflow-hidden tw-overscroll-contain tw-touch-pan-y"
+            className="submission-carousel-swiper tw-h-full tw-overflow-hidden tw-touch-pan-y"
             modules={[Autoplay]}
             slidesPerView="auto"
             centeredSlides
             spaceBetween={cardGap}
             speed={450}
             initialSlide={0}
-            autoplay={hasTouchScreen ? false : { delay: 4000, disableOnInteraction: false }}
+            autoplay={autoplayConfig}
             touchEventsTarget="container"
             touchStartPreventDefault={false}
+            touchMoveStopPropagation={false}
+            touchReleaseOnEdges={true}
             preventInteractionOnTransition={true}
             onSwiper={(swiper) => {
               swiperRef.current = swiper;
               handleSlideChange(swiper);
+              if (hasTouchScreen) {
+                swiper.autoplay?.stop?.();
+              }
             }}
             onSlideChange={handleSlideChange}
           >
           {shuffledDrops.map((drop, index) => {
             const isActive = index === activeIndex;
             const distance = Math.abs(index - activeIndex);
+            let renderMode: "full" | "preview" | "placeholder" = "placeholder";
+            if (distance === 0) {
+              renderMode = "full";
+            } else if (distance === 1) {
+              renderMode = "preview";
+            }
+            const previewFilter =
+              renderMode === "preview" ? "grayscale(100%) blur(3px)" : "none";
 
             return (
               <SwiperSlide
@@ -190,7 +234,7 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
                   className="tw-h-auto tw-w-full tw-aspect-[4/5] tw-cursor-pointer tw-border-none tw-bg-transparent tw-p-0 tw-outline-none focus-visible:tw-ring-2 focus-visible:tw-ring-primary-400 md:tw-aspect-auto md:tw-h-full"
                   style={{
                     opacity: isActive ? 1 : 0.22,
-                    filter: isActive ? "none" : inactiveFilter,
+                    filter: isActive ? "none" : previewFilter,
                     zIndex: isActive ? 10 : 10 - distance,
                     transition: slideTransition,
                     transform: isActive
@@ -200,7 +244,12 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
                     willChange: distance <= 1 ? "transform, opacity" : "auto",
                   }}
                 >
-                  <SubmissionArtworkCard drop={drop} isActive={isActive} />
+                  <SubmissionArtworkCard
+                    drop={drop}
+                    isActive={isActive}
+                    imageScale={mediaImageScale}
+                    renderMode={renderMode}
+                  />
                 </div>
               </SwiperSlide>
             );
@@ -223,4 +272,4 @@ const SubmissionCarousel = forwardRef<SubmissionCarouselHandle, SubmissionCarous
   );
 });
 
-export default SubmissionCarousel;
+export default memo(SubmissionCarousel);
diff --git a/components/home/hero/CarouselHeader.tsx b/components/home/hero/CarouselHeader.tsx
index 17bc5e94a6..bd18ad8f40 100644
--- a/components/home/hero/CarouselHeader.tsx
+++ b/components/home/hero/CarouselHeader.tsx
@@ -2,9 +2,9 @@
 
 export default function CarouselHeader() {
   return (
-    <section className="tw-mb-10 tw-px-4 md:tw-px-6 md:tw-text-center lg:tw-px-8">
+    <section className="tw-mb-8 md:tw-mb-10 tw-px-4 md:tw-px-6 md:tw-text-center lg:tw-px-8">
       <span className="tw-m-0 tw-text-xl tw-font-semibold tw-tracking-tight tw-text-white sm:tw-text-2xl md:tw-text-3xl">
-        Recent works from artists in the network.
+        Community favorites from artists in the network
       </span>
     </section>
   );
diff --git a/components/home/hero/HeroHeader.tsx b/components/home/hero/HeroHeader.tsx
index e2a9a03b4f..e27df4e056 100644
--- a/components/home/hero/HeroHeader.tsx
+++ b/components/home/hero/HeroHeader.tsx
@@ -2,9 +2,9 @@
 
 export default function HeroHeader() {
   return (
-    <section className="tw-px-4 tw-pt-16 md:tw-px-6 lg:tw-px-8 lg:tw-text-center">
+    <section className="tw-px-4 tw-pt-10 md:tw-px-6 lg:tw-px-8 md:tw-text-center">
       <p className="tw-mb-2 tw-text-[11px] tw-font-medium tw-uppercase tw-tracking-[0.2em] tw-text-iron-500">
-        6529 Seize
+        6529
       </p>
       <h1 className="tw-mb-3 tw-text-3xl tw-font-bold tw-leading-tight tw-tracking-tight tw-text-iron-200 md:tw-text-4xl">
         Where art meets community
diff --git a/components/home/now-minting/NowMintingDetails.tsx b/components/home/now-minting/NowMintingDetails.tsx
index 07ae260f49..93a7791934 100644
--- a/components/home/now-minting/NowMintingDetails.tsx
+++ b/components/home/now-minting/NowMintingDetails.tsx
@@ -14,7 +14,7 @@ interface NowMintingDetailsProps {
 
 export default function NowMintingDetails({ nft }: NowMintingDetailsProps) {
   const formatEth = (value: number) => {
-    if (value === 0) return "0 ETH";
+    if (value <= 0) return "N/A";
     return `${value.toFixed(5)} ETH`;
   };
 
diff --git a/components/home/now-minting/NowMintingSection.tsx b/components/home/now-minting/NowMintingSection.tsx
index 33601cd244..801330a1ed 100644
--- a/components/home/now-minting/NowMintingSection.tsx
+++ b/components/home/now-minting/NowMintingSection.tsx
@@ -9,7 +9,7 @@ export default function NowMintingSection() {
 
   if (isFetching && !nft) {
     return (
-      <section className="tw-px-4 tw-pb-32 tw-pt-16 md:tw-px-6 lg:tw-px-8">
+      <section className="tw-px-4 tw-pb-32 tw-pt-10 md:tw-pt-16 md:tw-px-6 lg:tw-px-8">
         <span className="tw-mb-4 tw-block tw-text-xl tw-font-semibold tw-tracking-tight tw-text-zinc-200 md:tw-mb-6 md:tw-text-2xl">
           Latest Drop
         </span>
@@ -50,7 +50,7 @@ export default function NowMintingSection() {
   }
 
   return (
-    <section className="tw-px-4 tw-pb-16 tw-pt-16 md:tw-px-6 md:tw-pb-32 lg:tw-px-8">
+    <section className="tw-px-4 tw-pb-16 tw-pt-10 md:tw-pt-16 md:tw-px-6 md:tw-pb-32 lg:tw-px-8">
       <span className="tw-mb-4 tw-block tw-text-xl tw-font-semibold tw-tracking-tight tw-text-zinc-200 md:tw-mb-6 md:tw-text-2xl">
         Latest Drop
       </span>
diff --git a/components/home/now-minting/NowMintingStatsGrid.tsx b/components/home/now-minting/NowMintingStatsGrid.tsx
index 428af03e28..c877095421 100644
--- a/components/home/now-minting/NowMintingStatsGrid.tsx
+++ b/components/home/now-minting/NowMintingStatsGrid.tsx
@@ -1,5 +1,6 @@
 import {
   formatClaimStatus,
+  formatClaimCost,
   formatEditionSize,
 } from "@/helpers/manifoldDisplayHelpers";
 import { useMemesManifoldClaim } from "@/hooks/useManifoldClaim";
@@ -26,6 +27,7 @@ export default function NowMintingStatsGrid({
   const editionSize = manifoldClaim
     ? formatEditionSize(manifoldClaim)
     : undefined;
+  const mintPrice = manifoldClaim ? formatClaimCost(manifoldClaim) : undefined;
 
   return (
     <div className="tw-grid tw-grid-cols-2 tw-gap-x-8 tw-gap-y-4 tw-border-x-0 tw-border-b-0 tw-border-t tw-border-solid tw-border-iron-800 tw-pt-5">
@@ -36,7 +38,11 @@ export default function NowMintingStatsGrid({
         status={statusTone}
         isLoading={isStatusLoading}
       />
-      <NowMintingStatsItem label="Mint price" value={"0.06529"} />
+      <NowMintingStatsItem
+        label="Mint price"
+        value={mintPrice}
+        isLoading={isStatusLoading}
+      />
       <NowMintingStatsItem label="Floor" value={floorPrice} />
     </div>
   );
diff --git a/components/waves/drops/ContentDisplay.tsx b/components/waves/drops/ContentDisplay.tsx
index 017dd2e077..2efd88e1b1 100644
--- a/components/waves/drops/ContentDisplay.tsx
+++ b/components/waves/drops/ContentDisplay.tsx
@@ -19,7 +19,7 @@ export default function ContentDisplay({
   textClassName,
 }: ContentDisplayProps) {
   const containerClasses = [
-    "tw-break-all tw-text-iron-300 tw-font-normal tw-text-sm tw-flex tw-items-center tw-gap-1.5 tw-line-clamp-1",
+    "tw-text-iron-300 tw-font-normal tw-text-sm tw-flex tw-items-center tw-gap-1.5 tw-line-clamp-1",
     onClick
       ? "tw-cursor-pointer hover:tw-text-iron-400 tw-transition tw-duration-300 tw-ease-out"
       : "",