x

apps/spa/src/pages/CustomPage.tsx

@@ -23,6 +23,9 @@ export default function CustomPage() {
     (section) => !(section.isActive && section.type.toUpperCase() === 'ANNOUNCEMENT_BAR')
   );
 
+  const HERO_TYPES = new Set(['HERO', 'HERO_V2', 'HERO_VIDEO']);
+  const hasHeroFirst = contentSections.length > 0 && HERO_TYPES.has(contentSections[0].type.toUpperCase());
+
   useEffect(() => {
     const fetchCategories = async () => {
       try {
@@ -74,7 +77,7 @@ export default function CustomPage() {
           categoriesLoading={categoriesLoading}
         />
       ))}
-      <Navbar categories={categories} topOffsetClassName={topOffsetClassName} />
+      <Navbar categories={categories} topOffsetClassName={topOffsetClassName} isTransparent={hasHeroFirst} />
 
       {loading ? (
         <div className="min-h-[60vh] flex items-center justify-center">
@@ -83,7 +86,7 @@ export default function CustomPage() {
       ) : error ? (
         <NotFoundPage />
       ) : (
-        <div className={`animate-fade-in ${announcementSections.length > 0 ? 'pt-[32px] md:pt-[40px]' : ''}`}>
+        <div className={`animate-fade-in ${announcementSections.length > 0 ? (hasHeroFirst ? 'pt-[32px] md:pt-[40px]' : 'pt-[110px] md:pt-[128px]') : (hasHeroFirst ? '' : 'pt-[70px] md:pt-[80px]')}`}>
           <DynamicPageRenderer
             sections={contentSections}
             categories={categories}