185 lines
11 KiB
HTML
185 lines
11 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Projects | Kristijan Popovski</title>
|
|
<meta name="description" content="Selected projects by Kristijan Popovski across institutional collaboration, consulting, innovation, and youth leadership.">
|
|
<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=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="css/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="site-shell">
|
|
<header class="site-header">
|
|
<div class="site-header__inner">
|
|
<a class="brand" href="index.html">Kristijan Popovski</a>
|
|
<nav class="site-nav" aria-label="Primary">
|
|
<ul class="site-nav__list">
|
|
<li><a class="site-nav__link" href="index.html">Home</a></li>
|
|
<li><a class="site-nav__link is-current" href="projects.html">Projects</a></li>
|
|
<li><a class="site-nav__link" href="cv.html">CV</a></li>
|
|
<li><a class="site-nav__link" href="contact.html">Contact</a></li>
|
|
</ul>
|
|
</nav>
|
|
<div class="site-header__actions">
|
|
<a class="button button--primary button--small" href="contact.html">Get in Touch</a>
|
|
<button class="menu-toggle" type="button" aria-label="Open menu" aria-expanded="false" data-menu-toggle>
|
|
<span class="menu-toggle__line"></span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<nav class="mobile-nav" aria-label="Mobile" data-mobile-nav>
|
|
<ul class="mobile-nav__list">
|
|
<li><a class="mobile-nav__link" href="index.html">Home</a></li>
|
|
<li><a class="mobile-nav__link is-current" href="projects.html">Projects</a></li>
|
|
<li><a class="mobile-nav__link" href="cv.html">CV</a></li>
|
|
<li><a class="mobile-nav__link" href="contact.html">Contact</a></li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
|
|
<main class="page-main">
|
|
<section class="section section--tight">
|
|
<div class="container">
|
|
<div class="page-hero">
|
|
<div data-animate>
|
|
<div class="eyebrow">Selected Work</div>
|
|
<h1 class="page-title">Architecting <strong>institutional excellence.</strong></h1>
|
|
<p class="page-lede">A portfolio of strategic interventions, institutional collaboration, and practical leadership across governance, consulting, and innovation environments.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="filter-bar" data-animate>
|
|
<button class="filter-chip is-active" type="button" data-filter="all" aria-pressed="true">All</button>
|
|
<button class="filter-chip" type="button" data-filter="institutional" aria-pressed="false">Institutional</button>
|
|
<button class="filter-chip" type="button" data-filter="consulting" aria-pressed="false">Consulting</button>
|
|
<button class="filter-chip" type="button" data-filter="innovation" aria-pressed="false">Innovation</button>
|
|
<button class="filter-chip" type="button" data-filter="moderation" aria-pressed="false">Moderation</button>
|
|
</div>
|
|
|
|
<div class="project-grid">
|
|
<article class="card project-card" data-category="institutional" data-animate>
|
|
<div class="project-card__media">
|
|
<img src="assets/images/project-governance.jpg" alt="Modern conference hall with blue lighting and stage screen" width="1440" height="900">
|
|
<span class="project-card__tag">Institutional</span>
|
|
</div>
|
|
<div class="project-card__body">
|
|
<span class="project-card__meta">International Summit</span>
|
|
<h2 class="project-card__title">International Governance Summit</h2>
|
|
<p class="project-card__text">Spearheaded coordination for a multinational dialogue on digital infrastructure policy, aligning delegations and framing a shared process for decision-making.</p>
|
|
<div class="project-card__outcome">
|
|
<span class="icon-circle">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M4 19h16v2H4zm2-4h3v3H6zm5-6h3v9h-3zm5-4h3v13h-3z"/></svg>
|
|
</span>
|
|
<div>
|
|
<p class="project-card__outcome-title">Key Outcome</p>
|
|
<p class="project-card__outcome-text">Built consensus around a shared digital sovereignty framework across multiple participating delegations.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="card project-card" data-category="consulting" data-animate>
|
|
<div class="project-card__media">
|
|
<img src="assets/images/project-consulting.jpg" alt="Consultant using a stylus on a digital business dashboard" width="1440" height="900">
|
|
<span class="project-card__tag">Consulting</span>
|
|
</div>
|
|
<div class="project-card__body">
|
|
<span class="project-card__meta">Business Model</span>
|
|
<h2 class="project-card__title">Strategic Business Model Pivot</h2>
|
|
<p class="project-card__text">Redesigned an operational model for a logistics environment moving from legacy tracking systems toward a clearer and more automated structure.</p>
|
|
<div class="project-card__outcome">
|
|
<span class="icon-circle">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="m16 6 2.29 2.29-4.88 4.88-4-4L2 16.59 3.41 18l6-6 4 4L19.71 9.7 22 12V6z"/></svg>
|
|
</span>
|
|
<div>
|
|
<p class="project-card__outcome-title">Key Outcome</p>
|
|
<p class="project-card__outcome-text">Created a clearer path for higher processing speed, lower friction, and stronger operational visibility.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="card project-card" data-category="innovation" data-animate>
|
|
<div class="project-card__media">
|
|
<img src="assets/images/project-greenie.jpg" alt="Interior green wall and glass architecture in a sustainable building" width="1440" height="900" loading="lazy">
|
|
<span class="project-card__tag">Innovation</span>
|
|
</div>
|
|
<div class="project-card__body">
|
|
<span class="project-card__meta">Circular Economy</span>
|
|
<h2 class="project-card__title">The Greenie Concept</h2>
|
|
<p class="project-card__text">Developed a circular economy framework for urban workspaces, focused on shared energy thinking, sustainability, and long-term viability.</p>
|
|
<div class="project-card__outcome">
|
|
<span class="icon-circle">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm1 17.93V18h-2v1.93c-3.95-.49-7-3.85-7-7.93 0-4.42 3.58-8 8-8s8 3.58 8 8c0 4.08-3.05 7.44-7 7.93z"/></svg>
|
|
</span>
|
|
<div>
|
|
<p class="project-card__outcome-title">Key Outcome</p>
|
|
<p class="project-card__outcome-text">Positioned the concept as a scalable sustainability-oriented model with strong regional relevance.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="card project-card" data-category="moderation institutional" data-animate>
|
|
<div class="project-card__media">
|
|
<img src="assets/images/project-youth.jpg" alt="Moderator speaking to a youth audience at a leadership event" width="1440" height="900" loading="lazy">
|
|
<span class="project-card__tag">Moderation</span>
|
|
</div>
|
|
<div class="project-card__body">
|
|
<span class="project-card__meta">Youth Leadership</span>
|
|
<h2 class="project-card__title">Global Youth Leadership Summit</h2>
|
|
<p class="project-card__text">Led moderation for a high-stakes youth summit, facilitating dialogue between participants, institutions, and external partners.</p>
|
|
<div class="project-card__outcome">
|
|
<span class="icon-circle">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true"><path fill="currentColor" d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5s-3 1.34-3 3 1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5C15 14.17 10.33 13 8 13zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>
|
|
</span>
|
|
<div>
|
|
<p class="project-card__outcome-title">Key Outcome</p>
|
|
<p class="project-card__outcome-text">Created a credible forum for structured discussion, public visibility, and youth-facing institutional engagement.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="cta-banner" data-animate>
|
|
<div class="cta-banner__content">
|
|
<h2 class="cta-banner__title">Ready to collaborate?</h2>
|
|
<p class="cta-banner__text">Open to conversations around institutional advisory work, project leadership, and structured collaboration.</p>
|
|
<div class="cta-banner__actions">
|
|
<a class="button button--secondary" href="contact.html">Request Collaboration</a>
|
|
<a class="button button--secondary" href="cv.html">View Full CV</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="site-footer site-footer--light">
|
|
<div class="site-footer__inner">
|
|
<div>
|
|
<div class="site-footer__brand">Kristijan Popovski</div>
|
|
<p class="site-footer__text">Selected work across governance, consulting, and leadership initiatives.</p>
|
|
</div>
|
|
<div class="site-footer__links">
|
|
<a class="site-footer__link" href="index.html">Home</a>
|
|
<a class="site-footer__link" href="contact.html">Contact</a>
|
|
<a class="site-footer__link" href="mailto:popovskik02@yahoo.com">Email</a>
|
|
<a class="site-footer__link" href="assets/documents/cv_full.pdf">Download CV</a>
|
|
</div>
|
|
<div class="site-footer__meta">Curated projects and measurable outcomes</div>
|
|
</div>
|
|
</footer>
|
|
</div>
|
|
<script src="js/script.js"></script>
|
|
</body>
|
|
</html>
|