<?php
$pageTitle   = $pageTitle   ?? 'FlixCooks | Food Blog & Recipes';
$description = $description ?? 'Seasonal recipes, tested tips, and approachable cooking for busy weeknights.';
?>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="description" content="<?php echo e($description); ?>">
  <title><?php echo e($pageTitle); ?></title>
  <link rel="icon" type="image/png" href="/assets/favicon.png">
  <link rel="alternate icon" type="image/x-icon" sizes="16x16 32x32" href="/favicon.ico">

  <!-- Google Fonts: Playfair Display + Manrope -->
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Manrope:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">

  <!-- Main stylesheet -->
  <link rel="stylesheet" href="/assets/style.css">
  <script src="/assets/fc-local.js" defer></script>

  <!-- GSAP + ScrollTrigger (CDN) -->
  <script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/ScrollTrigger.min.js"></script>

  <!-- Lenis smooth scroll (CDN) -->
  <script src="https://cdn.jsdelivr.net/npm/@studio-freight/lenis@1.0.42/bundled/lenis.min.js"></script>

  <!-- Set theme instantly to avoid flash -->
  <script>
    (function(){
      document.documentElement.setAttribute('data-theme', 'dark');
      localStorage.setItem('fc-theme', 'dark');
    })();
  </script>
</head>
<body>

<!-- ── AuraMarbleBackground (fixed atmospheric grain layer) ── -->
<div class="bg-marble-container" aria-hidden="true">
  <div class="bg-marble-grain"></div>
</div>

