<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{!! $siteName !!}</title>

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Bootstrap Icons -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <!-- Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;600;700&family=Quicksand:wght@400;500;600;700&display=swap" rel="stylesheet">

    <style>
        :root{
            --green-900:#22392a;
            --green-800:#2e4a35;
            --green-700:#3d5c44;
            --green-200:#cddac9;
            --green-100:#e4ecdf;
            --gold:#b9975b;
            --cream:#f7f5ee;
            --olive-bg:#efeee3;
            --ink:#3a4a3f;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            font-family:'Quicksand',sans-serif;
            color:var(--ink);
            background:var(--cream);
        }
        .font-display { font-family:'Playfair Display',serif; }
    </style>
</head>
<body>
    {!! $__header__ !!}
    {!! $__page__ !!}
    {!! $__footer__ !!}

        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script></body>
</html>