Moved old project components to this new project

2026-05-09 16:46:01 +02:00
parent 1c869b9a7b
commit b08e891020
40 changed files with 2910 additions and 1 deletions
@@ -0,0 +1,90 @@
+/* The main container for your Landing/Hero section */
+.hero-section {
+    width: 100%;
+    /* FIX: Force the hero to take up exactly the remaining vertical space */
+    height: calc(100vh - 142px); /* Header(92) + Footer(50) = 142 */
+
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    position: relative;
+    /* MODIFIED: Changed from 'center' to 'flex-start' so we can manually space it */
+    justify-content: flex-start;
+    /* Aggressive overflow control to stop the "1px leak" */
+    overflow: hidden;
+    box-sizing: border-box;
+    background-color: #001219;
+    background-image: radial-gradient(at 0% 0%, rgba(0, 95, 115, 0.15) 0px, transparent 50%), radial-gradient(at 100% 100%, rgba(10, 147, 150, 0.12) 0px, transparent 50%), radial-gradient(at 80% 20%, rgba(0, 180, 216, 0.08) 0px, transparent 40%);
+}
+
+    /* Invisible spacer before the content to "push" it down visually */
+    .hero-section::before {
+        content: "";
+        /* This pushes the content block down by a fluid amount of available space */
+        flex-grow: 1;
+        max-height: 20vh; /* Limits how far it goes on huge screens */
+        min-height: 5vh; /* Minimum safe distance from header on laptops */
+    }
+
+    /* Ensure other overlays remain z-indexed correctly */
+    .hero-section::after {
+        content: "";
+        /* (keep your subtle grid overlays here) */
+    }
+
+.hero-content {
+    position: relative;
+    z-index: 10; /* Keep content forward */
+    text-align: center;
+    padding: 0 2rem;
+    /* Standard constraints */
+    width: 100%;
+    max-width: 1200px;
+    /* FIX: Make the content itself a flexible stack so it can shrink */
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    /* Proportional spacing between ALL core elements (h1 -> p -> buttons -> icons) */
+    gap: clamp(1vh, 3vh, 30px);
+}
+
+    /* Typography Spacing Fixes */
+    .hero-content h1 {
+        /* Responsive text that shrinks on smaller laptop viewports */
+        font-size: clamp(2rem, 5.5vh, 3.5rem);
+        line-height: 1.1;
+        color: #fff;
+        margin: 0; /* Reset margins in favor of gap */
+    }
+
+    .hero-content p {
+        font-size: clamp(1rem, 2vh, 1.25rem);
+        color: var(--payoff-color);
+        margin: 0; /* Reset margins in favor of gap */
+    }
+
+/* FIX: Refactored Call to Action Container */
+.cta-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 15px;
+    /* Removed margin-bottom in favor of hero-content gap */
+    /* Keep a minimum height for the buttons themselves, but no max-height */
+    min-height: 40px;
+}
+
+/* Ensure the button borders/shadows don't cause the 1px leak */
+.btn-calltoaction-blue, .btn-calltoaction-white {
+    box-sizing: border-box;
+}
+
+/* Features Grid Spacing */
+.features-grid {
+    width: 100%;
+    display: flex;
+    justify-content: space-around;
+    gap: 20px;
+    /* Optional: Ensure this section isn't stretching */
+    align-items: flex-start;
+}