Remove hero gap below header

Drop min-h-screen vertical centering on hero; use compact top padding so copy and photos sit directly under the nav in light and dark mode.

Co-authored-by: Cursor <[email protected]>
This commit is contained in:
defiQUG
2026-05-26 22:10:57 -07:00
co-authored by Cursor
parent e24cb6379a
commit 83727e217a
3 changed files with 11 additions and 9 deletions
Binary file not shown.
+3 -6
View File
@@ -810,11 +810,10 @@ function Hero() {
offset: ['start start', 'end start']
})
const backgroundY = useTransform(scrollYProgress, [0, 1], ['0%', '50%'])
const contentY = useTransform(scrollYProgress, [0, 1], ['0%', '100%'])
const backgroundY = useTransform(scrollYProgress, [0, 1], ['0%', '30%'])
return (
<section ref={containerRef} className="relative isolate overflow-hidden min-h-screen flex items-center">
<section ref={containerRef} className="hero-section relative isolate overflow-hidden">
{/* Enhanced 3D Background Layers */}
<motion.div
className="absolute inset-0 bg-gradient-to-br from-[var(--mim-cream)] via-white to-secondary-50/40 dark:from-gray-900/30 dark:via-gray-800/30 dark:to-gray-900/30"
@@ -843,10 +842,8 @@ function Hero() {
<Floating3DShapes />
</motion.div>
{/* Content Layer with Parallax */}
<motion.div
className="mx-auto grid max-w-7xl items-center gap-16 px-4 py-20 sm:px-6 lg:grid-cols-12 lg:gap-8 lg:py-28 lg:px-8 relative z-10"
style={{ y: contentY }}
className="mx-auto grid max-w-7xl items-start gap-10 px-4 pb-14 pt-6 sm:px-6 sm:pt-8 lg:grid-cols-12 lg:gap-10 lg:px-8 lg:pb-16 lg:pt-10 relative z-10"
>
<div className="lg:col-span-7">
<ParallaxContainer depth={0.3}>
+8 -3
View File
@@ -219,12 +219,17 @@
@media (min-width: 768px) {
.mim-site-nav {
min-height: 5rem;
padding-top: 0.5rem;
padding-bottom: 0.5rem;
min-height: 4.5rem;
padding-top: 0.375rem;
padding-bottom: 0.375rem;
}
}
/* Hero sits flush under sticky header — no full-viewport vertical centering gap */
.hero-section {
margin-top: 0;
}
.nav-brand-link:hover {
opacity: 0.9;
}