feat(home): rebuild front-page template to match Carbon Blue mockup

front-page.php

@@ -1,27 +1,83 @@
 <?php
 /**
- * Front Page Template
+ * Front Page Template — Portfolio 2026 home
  *
- * @package SoloFrameEvo
+ * @package KsPortfolio
  */
 
-namespace SoloFrameEvo;
+namespace KsPortfolio;
 
 get_header();
+
+$hero_heading = get_field( 'homepage_hero_heading' );
+$hero_intro   = get_field( 'homepage_hero_intro' );
+$hero_cta_1   = get_field( 'homepage_hero_cta_1' ); // array( url, title, target )
+$hero_cta_2   = get_field( 'homepage_hero_cta_2' );
 ?>
+<section class="home-hero aura-bg">
+	<div class="aura-bg__content">
+		<div class="container mx-auto my-section">
+			<div class="home-hero__inner">
+				<?php if ( $hero_heading ) : ?>
+					<h1 class="home-hero__heading"><?php echo esc_html( $hero_heading ); ?></h1>
+				<?php endif; ?>
+				<?php if ( $hero_intro ) : ?>
+					<p class="home-hero__intro"><?php echo esc_html( $hero_intro ); ?></p>
+				<?php endif; ?>
 
-<div class="container my-section lg:my-0 mx-auto">
+				<div class="home-hero__actions">
-	<div>
+					<?php if ( ! empty( $hero_cta_1['url'] ) && ! empty( $hero_cta_1['title'] ) ) : ?>
-		<?php
+						<a class="button button--primary" href="<?php echo esc_url( $hero_cta_1['url'] ); ?>"<?php echo ! empty( $hero_cta_1['target'] ) ? ' target="_blank" rel="noopener noreferrer"' : ''; ?>>
-		// Content block
+							<?php echo esc_html( $hero_cta_1['title'] ); ?>
-		if ( have_posts() ) {
+						</a>
-			while ( have_posts() ) {
+					<?php endif; ?>
-				the_post();
+					<?php if ( ! empty( $hero_cta_2['url'] ) && ! empty( $hero_cta_2['title'] ) ) : ?>
-				the_content();
+						<a class="button button--outline" href="<?php echo esc_url( $hero_cta_2['url'] ); ?>"<?php echo ! empty( $hero_cta_2['target'] ) ? ' target="_blank" rel="noopener noreferrer"' : ''; ?>>
-			}
+							<?php echo esc_html( $hero_cta_2['title'] ); ?>
-		}
+						</a>
-		?>
+					<?php endif; ?>
+				</div>
+			</div>
+		</div>
 	</div>
-</div>
+</section>
 
-<?php get_footer(); ?>
+<section class="home-recent container mx-auto my-section">
+	<header class="home-recent__head">
+		<h2 class="home-recent__title"><?php echo esc_html__( 'Recent Projects', 'ks-portfolio' ); ?></h2>
+		<a class="home-recent__view-all" href="<?php echo esc_url( get_post_type_archive_link( 'projects' ) ); ?>">
+			<?php echo esc_html__( 'View All', 'ks-portfolio' ); ?> &rarr;
+		</a>
+	</header>
+	<hr class="home-recent__divider" />
+
+	<?php
+	$recent = new \WP_Query(
+		array(
+			'post_type'      => 'projects',
+			'posts_per_page' => 3,
+			'no_found_rows'  => true,
+		)
+	);
+
+	if ( $recent->have_posts() ) : ?>
+		<div class="home-recent__grid grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+			<?php
+			while ( $recent->have_posts() ) :
+				$recent->the_post();
+				get_template_part( 'views/components/project-card' );
+			endwhile;
+			wp_reset_postdata();
+			?>
+		</div>
+	<?php else : ?>
+		<div class="home-recent__empty">
+			<h3><?php echo esc_html__( 'Nothing here yet&hellip;', 'ks-portfolio' ); ?></h3>
+			<p><?php echo esc_html__( 'No published projects found.', 'ks-portfolio' ); ?></p>
+		</div>
+	<?php endif; ?>
+</section>
+
+<?php
+get_template_part( 'views/partials/aura-bg' );
+get_footer();

styles/components/project-card.css

@@ -299,3 +299,50 @@
 	grid-template-columns: repeat(2, 1fr);
 	gap: 0.75rem;
 }
+
+.home-hero { min-height: 60vh; display: flex; align-items: center; padding: 4rem 0; }
+.home-hero__inner { max-width: 50rem; }
+.home-hero__heading {
+	font-family: var(--font-sans);
+	font-weight: 700;
+	font-size: clamp(2rem, 4vw, 3.5rem);
+	line-height: 1.1;
+	color: var(--color-on-surface, #e3e1e9);
+	margin: 0 0 1rem;
+}
+.home-hero__intro {
+	color: var(--color-on-surface-variant, #c5c5d3);
+	font-size: clamp(1rem, 1.5vw, 1.25rem);
+	line-height: 1.6;
+	max-width: 50ch;
+	margin: 0 0 1.5rem;
+}
+.home-hero__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
+
+.home-recent__head {
+	display: flex;
+	align-items: baseline;
+	justify-content: space-between;
+	margin-bottom: 0.5rem;
+}
+.home-recent__title {
+	font-family: var(--font-sans);
+	font-weight: 700;
+	font-size: 1.75rem;
+	color: var(--color-on-surface, #e3e1e9);
+	margin: 0;
+}
+.home-recent__view-all {
+	color: var(--color-primary, #b6c4ff);
+	font-weight: 600;
+	text-decoration: none;
+}
+.home-recent__view-all:hover { text-decoration: underline; }
+
+.home-recent__divider {
+	border: 0;
+	border-top: 1px solid var(--color-outline-variant, #444651);
+	margin: 0 0 1.5rem;
+}
+
+.home-recent__empty { text-align: center; padding: 4rem 1rem; color: var(--color-on-surface-variant, #c5c5d3); }