assets/business-analysis-template.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Business Engineer Visual</title>
<style>
:root{--be-teal:#0d7377;--be-teal-light:#14a3a8;--be-red:#c41e3a;--be-gold:#d4a017;--be-dark:#1a1a2e;--be-gray:#6c757d;--line:#e1f5ee}
*{box-sizing:border-box}body{margin:0;background:#fff;font-family:Inter,"Segoe UI",system-ui,sans-serif;color:var(--be-dark)}
.poster{width:1080px;min-height:1350px;margin:0 auto;padding:0 54px 44px;background:#fff}.topbar{height:8px;background:var(--be-teal);margin:0 -54px 34px}
.brand{font-family:Georgia,serif;font-size:12px;letter-spacing:3px;color:var(--be-teal);font-weight:700;text-transform:uppercase}.masthead{display:flex;justify-content:space-between;border-bottom:1.5px solid var(--line);padding-bottom:24px;margin-bottom:30px}h1{font-size:46px;line-height:1.02;margin:0;letter-spacing:-1.4px}.subtitle{max-width:380px;font-size:16px;line-height:1.45;color:var(--be-gray);text-align:right;margin-top:28px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:26px}.card{border:1.5px solid var(--line);border-radius:5px;background:#fff;position:relative;padding:22px;min-height:250px}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--be-teal)}.section-label{font-size:11px;letter-spacing:2px;color:var(--be-teal);font-weight:800;text-transform:uppercase;margin-bottom:16px}.footer{border-top:1.5px solid var(--line);margin-top:34px;padding-top:18px;display:flex;justify-content:space-between;color:var(--be-gray);font-size:11px}.footer strong{font-family:Georgia,serif;color:var(--be-teal)}
</style>
</head>
<body>
<main class="poster">
<div class="topbar"></div>
<header class="masthead"><div><div class="brand">The Business Engineer</div><h1>[Title]</h1></div><div class="subtitle">[One-line thesis]</div></header>
<section class="grid">
<div class="card"><div class="section-label">[Card 1]</div>[Content]</div>
<div class="card"><div class="section-label">[Card 2]</div>[Content]</div>
<div class="card"><div class="section-label">[Card 3]</div>[Content]</div>
<div class="card"><div class="section-label">[Card 4]</div>[Content]</div>
</section>
<footer class="footer"><div><strong>The Business Engineer</strong><br/>by Gennaro Cuofano</div><div>Analysis by The Business Engineer</div></footer>
</main>
</body>
</html>