<?php
$assetBase =
    basename(rtrim(FCPATH, "\\/")) === "public" ? "assets/" : "public/assets/";
$articleUrl = base_url("brand-guide/" . $article["slug"]);
$publishedIso = $article["published_at"]
    ? date(DATE_ATOM, strtotime($article["published_at"]))
    : date(DATE_ATOM, strtotime($article["created_at"]));
$updatedIso = date(DATE_ATOM, strtotime($article["updated_at"]));
?>
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title><?= esc($article["meta_title"]) ?></title>
    <meta name="description" content="<?= esc(
        $article["meta_description"],
        "attr",
    ) ?>">
    <link rel="canonical" href="<?= esc($articleUrl, "attr") ?>">
    <meta property="og:type" content="article">
    <meta property="og:title" content="<?= esc(
        $article["meta_title"],
        "attr",
    ) ?>">
    <meta property="og:description" content="<?= esc(
        $article["meta_description"],
        "attr",
    ) ?>">
    <meta property="og:url" content="<?= esc($articleUrl, "attr") ?>">
    <meta property="article:published_time" content="<?= esc(
        $publishedIso,
        "attr",
    ) ?>">
    <meta property="article:modified_time" content="<?= esc(
        $updatedIso,
        "attr",
    ) ?>">
    <meta property="article:section" content="<?= esc(
        $article["category"],
        "attr",
    ) ?>">
    <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=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="<?= base_url(
        $assetBase . "css/landing_1.css",
    ) ?>">
    <link rel="stylesheet" href="<?= base_url($assetBase . "css/main.css") ?>">
    <link rel="stylesheet" href="<?= base_url(
        $assetBase . "css/brand_guide.css",
    ) ?>">
    <script type="application/ld+json"><?= json_encode(
        [
            "@context" => "https://schema.org",
            "@type" => "Article",
            "headline" => $article["title"],
            "description" => $article["meta_description"],
            "datePublished" => $publishedIso,
            "dateModified" => $updatedIso,
            "mainEntityOfPage" => $articleUrl,
            "author" => [
                "@type" => "Organization",
                "name" => $article["author_name"],
            ],
            "publisher" => [
                "@type" => "Organization",
                "name" => "BrandSquare",
                "url" => base_url(),
            ],
            "articleSection" => $article["category"],
            "keywords" => $article["focus_keyword"],
        ],
        JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE,
    ) ?></script>
</head>
<body class="brand-guide-page article-page">
<header class="guide-header"><nav><a class="brand" href="<?= base_url() ?>">Brand<span>Square.</span></a><button class="mobile-menu-toggle" type="button" aria-expanded="false" aria-controls="guide-menu" aria-label="Open navigation menu" data-menu-toggle><span></span><span></span><span></span></button><div id="guide-menu" data-mobile-menu><a href="<?= base_url() ?>">Home</a><a href="<?= base_url(
    "#work",
) ?>">Our Work</a><a class="active" href="<?= base_url(
    "brand-guide",
) ?>">Brand Guide</a><a class="guide-call" href="tel:<?= esc(
    $phoneHref,
) ?>">Call now</a><a class="guide-enquiry" href="<?= base_url(
    "#brief",
) ?>">Send enquiry <span>→</span></a></div></nav></header>

<main>
    <section class="article-hero theme-<?= esc(
        $article["theme"],
    ) ?>"><div><nav aria-label="Breadcrumb"><a href="<?= base_url() ?>">Home</a><span>/</span><a href="<?= base_url(
    "brand-guide",
) ?>">Brand Guide</a><span>/</span><b><?= esc(
    $article["category"],
) ?></b></nav><span class="article-category-label"><?= esc(
    $article["category"],
) ?></span><h1><?= esc($article["title"]) ?></h1><p><?= esc(
    $article["excerpt"],
) ?></p><footer><span>By <?= esc(
    $article["author_name"],
) ?></span><span><?= esc(
    $article["reading_minutes"],
) ?> minute read</span><span>Updated <?= date(
     "d M Y",
     strtotime($article["updated_at"]),
 ) ?></span></footer></div><aside><small>BRANDSQUARE FIELD GUIDE</small><b><?= esc(
    strtoupper(substr($article["category"], 0, 1)),
) ?></b><span><?= esc($article["focus_keyword"]) ?></span></aside></section>

    <section class="article-layout">
        <article class="article-content">
            <?= $article["content"] ?>
            <div class="article-end-note"><span>One useful next step</span><h2>Make the decision with your actual business in mind.</h2><p>Use this guide as a starting point, then evaluate your logo against your audience, positioning, competitors, and real applications.</p><a href="<?= base_url(
                "#brief",
            ) ?>">Discuss your logo with BrandSquare <b>→</b></a></div>
        </article>
        <aside class="article-sidebar">
            <div><span>In this guide</span><p>Practical guidance for <?= esc(
                strtolower($article["category"]),
            ) ?> decisions.</p><b><?= esc(
     $article["reading_minutes"],
 ) ?> MIN READ</b></div>
            <div class="article-sidebar-tool"><span>Free brand tool</span><h2>Does your logo need a redesign?</h2><p>Get a 100-point result in seven minutes.</p><a href="<?= base_url(
                "logo-redesign-scorecard",
            ) ?>">Score my logo <b>→</b></a></div>
        </aside>
    </section>

    <?php if (
        $relatedArticles
    ): ?><section class="related-guides"><div><span>Continue learning</span><h2>Related Brand Guides</h2></div><div><?php foreach (
    $relatedArticles
    as $related
): ?><a class="theme-<?= esc($related["theme"]) ?>" href="<?= base_url(
    "brand-guide/" . $related["slug"],
) ?>"><span><?= esc($related["category"]) ?></span><h3><?= esc(
    $related["title"],
) ?></h3><footer><small><?= esc(
    $related["reading_minutes"],
) ?> min read</small><i>↗</i></footer></a><?php endforeach; ?></div></section><?php endif; ?>
</main>

<a class="whatsapp-button" href="https://wa.me/<?= esc(
    ltrim($whatsappNumber, "+"),
) ?>?text=Hi%20BrandSquare%2C%20I%27d%20like%20some%20guidance%20for%20my%20logo." target="_blank" rel="noopener noreferrer" aria-label="Ask BrandSquare on WhatsApp"><span class="whatsapp-icon" aria-hidden="true"><img src="https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/whatsapp.svg" alt="" width="26" height="26"></span><span class="whatsapp-label"><b>Let’s<br>Talk</b></span></a>
<footer class="guide-footer"><div><a class="brand" href="<?= base_url() ?>">Brand<span>Square.</span></a><p>Strategic logo design and redesign guidance for ambitious businesses.</p></div><nav><a href="<?= base_url() ?>">Home</a><a href="<?= base_url(
    "brand-guide",
) ?>">Brand Guide</a><a href="<?= base_url(
    "logo-redesign-scorecard",
) ?>">Logo Scorecard</a><a href="<?= base_url(
    "sitemap",
) ?>">Sitemap</a></nav><div><a href="tel:<?= esc($phoneHref) ?>"><?= esc(
    $phoneDisplay,
) ?></a><a href="mailto:hello@brandsquare.co.in">hello@brandsquare.co.in</a></div></footer>
<script src="<?= base_url($assetBase . "js/landing.js") ?>"></script>
</body>
</html>
