refactor: fix layout scrolling behavior by enabling sticky headers and adjusting section min-heights

src/app/globals.css

@@ -342,13 +342,11 @@ body.section-overlay-open .app-shell {
   height: 100%;
   height: 100dvh;
   z-index: 50;
-  overflow-x: hidden;
-  overflow-y: auto;
+  overflow: hidden;
   overscroll-behavior: none;
   touch-action: pan-y;
   -webkit-overflow-scrolling: touch;
   padding-inline: 17px;
-  padding-bottom: var(--safe-bottom, 0px);
   box-sizing: border-box;
   background-color: var(--background);
   background-image: var(--default-page-background-image);

src/app/marriage-advisors/page.tsx

@@ -50,7 +50,7 @@ export default function MarriageAdvisorsPage({
         className="-mx-[17px] flex h-dvh flex-col overflow-hidden pb-10"
         style={mainStyle}
       >
-        <StickyHeader sticky={false} className="shrink-0">
+        <StickyHeader sticky className="shrink-0">
           <div className="flex items-center justify-between gap-3">
             <NavigationButton
               variant="transparent"
@@ -68,7 +68,7 @@ export default function MarriageAdvisorsPage({
           </div>
         </StickyHeader>
 
-        <section className="flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-32 pt-5 flex flex-col items-center gap-4">
+        <section className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-32 pt-5 flex flex-col items-center gap-4">
           {isLoading && <AdvisorsSkeleton />}
 
           {isError && (

src/app/new-match/profile/page.tsx

@@ -181,12 +181,12 @@ function NewMatchProfileSkeleton({
     <>
       <PageBackground />
       <main className="-mx-[17px] flex h-dvh flex-col overflow-hidden bg-[#F5F5F5]">
-        <StickyHeader sticky={false} className="shrink-0">
+        <StickyHeader sticky className="shrink-0">
           <div className="flex items-center justify-between gap-3">
             {!hideBackButton ? (
               <NavigationButton
                 variant="transparent"
-                icon="exit"
+                icon="back"
                 iconLabel={t["Go back"]}
                 onClick={onClose}
               />
@@ -203,7 +203,7 @@ function NewMatchProfileSkeleton({
           </div>
         </StickyHeader>
 
-        <section className="flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-6 pt-5">
+        <section className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-6 pt-5">
           <div className="flex flex-col items-center justify-center w-full">
             <LoadingSkeleton className="size-[90px] rounded-full shadow-sm" />
             <LoadingSkeleton className="mt-3.5 h-7 w-44 rounded-xl shadow-xs" />
@@ -619,11 +619,11 @@ export default function NewMatchProfilePage({
       ) : null}
 
       <main className={mainClass} style={mainStyle}>
-        <StickyHeader sticky={false} className="shrink-0">
+        <StickyHeader sticky className="shrink-0">
           <div className="flex items-center justify-between gap-3">
             <NavigationButton
               variant="transparent"
-              icon="exit"
+              icon="back"
               iconLabel={t["Go back"]}
               onClick={onClose}
             />
@@ -637,7 +637,7 @@ export default function NewMatchProfilePage({
           </div>
         </StickyHeader>
 
-        <section className="flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-6 pt-5">
+        <section className="min-h-0 flex-1 overflow-y-auto overflow-x-hidden px-[17px] pb-6 pt-5">
           <div
             className="mx-auto flex flex-col items-center justify-center"
             style={{