Default page

Edit File: portfolio.php

<?php
$pageTitle       = 'Клиенти и проекти – All Media';
$pageDescription = 'Избрани клиенти и проекти на All Media.';
$currentPage     = 'portfolio';

require __DIR__ . '/includes/header.php';

/**
 * FAST preview image fetch (OG/Twitter/image_src/icons) with cache.
 * Keeps page FAST using short timeout + caching.
 */
function getPagePreviewImage(
    string $url,
    string $fallback = 'assets/img/case-placeholder.jpg',
    int $ttlSeconds = 86400 // 24h
): string {
    $cacheDir = __DIR__ . '/cache';
    if (!is_dir($cacheDir)) {
        @mkdir($cacheDir, 0755, true);
    }

$cacheFile = $cacheDir . '/preview_' . md5($url) . '.json';

// Serve from cache if fresh
    if (is_file($cacheFile)) {
        $raw  = @file_get_contents($cacheFile);
        $data = $raw ? @json_decode($raw, true) : null;
        if (is_array($data) && !empty($data['img']) && !empty($data['ts'])) {
            if ((time() - (int)$data['ts']) < $ttlSeconds) {
                return (string)$data['img'];
            }
        }
    }

$context = stream_context_create([
        'http' => [
            'timeout' => 1.5,
            'follow_location' => 1,
            'user_agent' => 'Mozilla/5.0 (AllMediaBot/1.0)',
        ],
        'ssl' => [
            'verify_peer' => true,
            'verify_peer_name' => true,
        ],
    ]);

$html = @file_get_contents($url, false, $context);
    if (!$html) {
        // Cache fallback so repeated loads stay fast
        @file_put_contents($cacheFile, json_encode(['img' => $fallback, 'ts' => time()], JSON_UNESCAPED_SLASHES));
        return $fallback;
    }

$candidates = [];

// og:image
    if (preg_match_all('~<meta[^>]+property=["\']og:image["\'][^>]+content=["\']([^"\']+)["\']~i', $html, $mm)) {
        foreach ($mm[1] as $v) $candidates[] = trim($v);
    }
    // twitter:image
    if (preg_match_all('~<meta[^>]+name=["\']twitter:image["\'][^>]+content=["\']([^"\']+)["\']~i', $html, $mm)) {
        foreach ($mm[1] as $v) $candidates[] = trim($v);
    }
    // image_src
    if (preg_match_all('~<link[^>]+rel=["\']image_src["\'][^>]+href=["\']([^"\']+)["\']~i', $html, $mm)) {
        foreach ($mm[1] as $v) $candidates[] = trim($v);
    }
    // apple-touch-icon
    if (preg_match_all('~<link[^>]+rel=["\']apple-touch-icon[^"\']*["\'][^>]+href=["\']([^"\']+)["\']~i', $html, $mm)) {
        foreach ($mm[1] as $v) $candidates[] = trim($v);
    }
    // icon
    if (preg_match_all('~<link[^>]+rel=["\']icon["\'][^>]+href=["\']([^"\']+)["\']~i', $html, $mm)) {
        foreach ($mm[1] as $v) $candidates[] = trim($v);
    }

$img = null;
    foreach ($candidates as $cand) {
        if (!$cand) continue;
        $img = $cand;
        break;
    }

if (!$img) {
        @file_put_contents($cacheFile, json_encode(['img' => $fallback, 'ts' => time()], JSON_UNESCAPED_SLASHES));
        return $fallback;
    }

// Resolve protocol-relative
    if (strpos($img, '//') === 0) {
        $img = 'https:' . $img;
    } elseif (!preg_match('~^https?://~i', $img)) {
        // Resolve relative
        $parts = parse_url($url);
        if (!$parts || empty($parts['scheme']) || empty($parts['host'])) {
            @file_put_contents($cacheFile, json_encode(['img' => $fallback, 'ts' => time()], JSON_UNESCAPED_SLASHES));
            return $fallback;
        }

$base = $parts['scheme'] . '://' . $parts['host'];
        if (isset($parts['port'])) $base .= ':' . $parts['port'];

if ($img[0] !== '/') $img = '/' . $img;
        $img = $base . $img;
    }

@file_put_contents($cacheFile, json_encode(['img' => $img, 'ts' => time()], JSON_UNESCAPED_SLASHES));

return $img ?: $fallback;
}

// Project links
$linkUslugi  = 'https://uslugi.gov.mk/';
$linkChalpha = 'https://ch-alpha.rs/';
$linkDoppel  = 'https://www.doppelherz.mk/';

// Images (fast + cached)
$imgUslugi  = getPagePreviewImage($linkUslugi);
$imgChalpha = getPagePreviewImage($linkChalpha);
$imgDoppel  = getPagePreviewImage($linkDoppel);
?>

<section class="section-padding">
  <div class="container">
    <div class="text-center mb-5">
      <span class="section-kicker">Досегашни соработници</span>
      <h1 class="section-title mt-2">Дел од нашите успешни приказни.</h1>
      <p class="section-text mx-auto" style="max-width: 720px;">
        Работиме со компании од различни индустрии – retail, услуги, производство,
        образование, здравство, угостителство. Подолу се избрани case studies со целосна структура и детали.
      </p>
    </div>

.portfolio-stack { margin-top: 1.25rem; }

/* =======================
   FIXED LOGO GRID
   ======================= */
.clients-grid-fixed{
  background: var(--bg-elevated);
  border: 1px solid var(--border-subtle);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
  padding: 1.1rem;
}

/* ✅ Responsive columns:
   - mobile: 2
   - >=480px: 3
   - >=768px: 4
   - >=1200px: 5
*/
.clients-grid-fixed .grid-wrap{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 480px){
  .clients-grid-fixed .grid-wrap{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 768px){
  .clients-grid-fixed .grid-wrap{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 1200px){
  .clients-grid-fixed .grid-wrap{
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

/* ✅ Square tiles (“kocki”) */
.client-tile{
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.08);
  background: #ffffff;
  padding: 16px;
  aspect-ratio: 1 / 1;
  min-height: 0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.client-tile:hover{
  transform: translateY(-2px);
  border-color: rgba(248, 113, 113, 0.45);
  box-shadow: 0 14px 28px rgba(15, 23, 42, 0.10);
}

/* ✅ Bigger logos inside square tile */
.client-tile img,
.client-tile object.client-pdf{
  width: 100%;
  height: 70%;
  max-width: 180px;
  object-fit: contain;
  display:block;
  opacity: .98;
  border: 0;
}

@media (min-width: 992px){
  .client-tile{
    padding: 18px;
    border-radius: 20px;
  }
  .client-tile img,
  .client-tile object.client-pdf{
    max-width: 210px;
    height: 74%;
  }
}

/* =======================
   CASE STUDY CARDS
   ======================= */
.case-card{
  border-radius: var(--card-radius);
  overflow: hidden;
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  box-shadow: var(--card-shadow);
}

.case-media{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #0b1220;
  overflow: hidden;
}

.case-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
}

.case-overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(to top, rgba(2,6,23,.78), rgba(2,6,23,.10) 55%, rgba(2,6,23,0));
  pointer-events:none;
}

.case-badges{
  position:absolute;
  left: 14px;
  bottom: 14px;
  display:flex;
  gap: 8px;
  flex-wrap: wrap;
}

.case-chip{
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .33rem .62rem;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  color: #f9fafb;
  border: 1px solid rgba(148,163,184,.35);
  backdrop-filter: blur(10px);
}

.case-body{
  padding: 1.25rem 1.25rem 1.3rem;
}

.case-title{
  font-weight: 650;
  line-height: 1.2;
  margin: 0 0 .4rem 0;
}

.case-subtitle{
  color: var(--text-muted);
  font-size: .95rem;
  margin-bottom: 1rem;
}

.case-snippet{
  color: var(--text-soft);
  font-size: .98rem;
  margin-bottom: 1rem;
  max-width: 980px;
}

.case-actions{
  display:flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: .35rem;
}
.case-actions .btn{ border-radius: 999px; }

.case-section{
  margin-top: 1rem;
  background: var(--bg-elevated-alt);
  border: 1px solid var(--border-subtle);
  border-radius: 14px;
  padding: 1rem 1.05rem;
}

.case-section h3{
  font-size: .9rem;
  font-weight: 650;
  margin: 0 0 .35rem 0;
  color: var(--text-main);
}

.case-section p{
  font-size: .96rem;
  color: var(--text-soft);
  margin-bottom: .8rem;
}
.case-section p:last-child{ margin-bottom: 0; }

.case-list{
  margin: 0;
  padding-left: 1.05rem;
}
.case-list li{
  font-size: .96rem;
  color: var(--text-soft);
  margin-bottom: .35rem;
}

/* Mobile: buttons full width */
@media (max-width: 575.98px){
  .case-actions .btn{ width: 100%; }
  .case-body{ padding: 1.05rem 1.05rem 1.1rem; }
}
</style>

<div class="clients-grid-fixed mb-4">
      <div class="grid-wrap">
        <div class="client-tile"><img src="assets/img/logo1.png"  alt="Лого 1"  loading="lazy"></div>
        <div class="client-tile"><img src="assets/img/logo2.png"  alt="Лого 2"  loading="lazy"></div>
        <div class="client-tile"><img src="assets/img/logo3.png"  alt="Лого 3"  loading="lazy"></div>

<div class="portfolio-stack d-grid gap-4">

<article class="case-card">
        <div class="case-media">
          <img src="<?= htmlspecialchars($imgUslugi) ?>" alt="uslugi.gov.mk – case study" loading="lazy">
          <div class="case-overlay"></div>
          <div class="case-badges">
            <span class="case-chip">Case Study</span>
            <span class="case-chip">Национално</span>
            <span class="case-chip">46.000+ ваучери</span>
          </div>
        </div>

<div class="case-body">
          <h2 class="h4 case-title mb-1">Министерство за дигитална трансформација: uslugi.gov.mk и MK Safe Net</h2>
          <div class="case-subtitle">Брендинг · Социјални мрежи · Медиуми · Теренски настани · Институционален маркетинг</div>

<div class="case-snippet">
            Интегрирана кампања за подигнување на јавната свест, зголемување на користењето на електронски услуги
            и едукација за дигитална безбедност – присутна дигитално, во традиционални медиуми и на терен.
          </div>

<div class="case-actions">
            <a href="https://uslugi.gov.mk/" target="_blank" rel="noopener" class="btn btn-primary btn-sm">uslugi.gov.mk</a>
            <a href="https://mksafenet.mk/en/" target="_blank" rel="noopener" class="btn btn-outline-primary btn-sm">MK Safe Net</a>
            <a href="https://mdt.gov.mk/" target="_blank" rel="noopener" class="btn btn-outline-primary btn-sm">mdt.gov.mk</a>

<button class="btn btn-outline-primary btn-sm" type="button" data-bs-toggle="collapse" data-bs-target="#cs3" aria-expanded="false" aria-controls="cs3">
              Види повеќе
            </button>
          </div>

<div class="collapse" id="cs3">
            <div class="case-section">
              <h3>Контекст и предизвик</h3>
              <p>
                Министерството за дигитална трансформација на Република Северна Македонија го развива националниот портал uslugi.gov.mk, централизирана платформа за пристап до електронски услуги за граѓаните. Клучниот предизвик беше подигнување на јавната свест, зголемување на користењето на електронските услуги и градење доверба во дигиталните алатки на државата, паралелно со едукација за дигитална безбедност.
              </p>

<h3 class="mt-3">Нашата улога</h3>
              <p>
                ALL Media беше ангажирана како целосен маркетинг и комуникациски партнер на Министерството, задолжена за развој на бренд идентитет, стратешка комуникација, теренски активности и мултиканална промоција на порталот uslugi.gov.mk, како и за кампањата за безбеден интернет MK Safe Net, проект поддржан од Европската Унија и управуван од Министерството за дигитална трансформација.
              </p>

<h3 class="mt-3">Брендинг и визуелен идентитет</h3>
              <p>
                За потребите на порталот uslugi.gov.mk, ALL Media изработи целосен brand book и визуелен идентитет, со јасно дефинирани комуникациски и визуелни стандарди. Идентитетот беше применет на сите дигитални и физички материјали, обезбедувајќи препознатлив и конзистентен настап на национално ниво.
              </p>

<h3 class="mt-3">Маркетинг и комуникација</h3>
              <p>
                ALL Media го водеше целокупниот маркетинг и комуникација на порталот, вклучувајќи управување со социјалните мрежи, креирање информативни и едукативни содржини, развој на кампањи и координација на сите комуникациски активности. Посебен фокус беше ставен на јасна и разбирлива комуникација со граѓаните, со цел олеснето користење на електронските услуги.
              </p>

<h3 class="mt-3">Теренски промотивни активности</h3>
              <p>
                Организирани беа бројни промотивни настани низ повеќе градови во државата, меѓу кои Скопје, Битола, Прилеп, Охрид и други. На овие настани, граѓаните имаа можност директно да се информираат за функционалностите на порталот, додека вработени од Министерството, со логистичка и организациска поддршка од ALL Media, им отвораа кориснички профили, им помагаа при користење на услугите и им го зголемуваа нивото на безбедност на профилите.
              </p>

<h3 class="mt-3">Владина програма за вредносни ваучери</h3>
              <p>
                ALL Media беше маркетинг партнер и на владината програма за доделување вредносни ваучери за електронски услуги на студенти. Преку порталот uslugi.gov.mk беа подигнати и успешно реализирани над 46.000 ваучери, што претставува еден од најуспешните примери за масовно користење на електронски услуги во државата.
              </p>

<h3 class="mt-3">Продукција и медиумска кампања</h3>
              <p>
                За потребите на порталот и поврзаните кампањи, ALL Media реализираше повеќе видео и ТВ реклами, радио кампањи, како и изработка на промотивни материјали. Кампањата беше присутна на дигитални канали, традиционални медиуми и на терен, со цел максимален досег и информираност.
              </p>

<h3 class="mt-3">MK Safe Net – Национална кампања за безбеден интернет</h3>
              <p>
                Покрај порталот uslugi.gov.mk, ALL Media го реализираше и целокупниот маркетинг за кампањата MK Safe Net, национална иницијатива за дигитална безбедност, поддржана од Европската Унија и управувана од Министерството за дигитална трансформација.
              </p>

<h3 class="mt-3">Резултат</h3>
              <p>
                Со интегриран пристап, ALL Media придонесе кон значително зголемување на видливоста и користењето на порталот uslugi.gov.mk, подигнување на дигиталната писменост и зајакнување на довербата на граѓаните во електронските услуги.
              </p>

<h3 class="mt-3">Услуги</h3>
              <p class="mb-0">
                Брендинг и brand book, визуелен идентитет, маркетинг стратегија, управување со социјални мрежи, теренски промоции, организација на настани, видео и ТВ продукција, радио кампањи, ПР и интегрирани комуникации, институционален маркетинг.
              </p>
            </div>
          </div>
        </div>
      </article>

<article class="case-card">
        <div class="case-media">
          <img src="<?= htmlspecialchars($imgChalpha) ?>" alt="CH Alpha – case study" loading="lazy">
          <div class="case-overlay"></div>
          <div class="case-badges">
            <span class="case-chip">Case Study</span>
            <span class="case-chip">ЈИЕ</span>
            <span class="case-chip">Ребрендинг</span>
          </div>
        </div>

<div class="case-body">
          <h2 class="h4 case-title mb-1">GELITA – CH Alpha: целосен ребрендинг и регионален настап</h2>
          <div class="case-subtitle">Brand book · Социјални мрежи · Видео/ТВ · OOH · Influencer · Спонзорства</div>

<div class="case-snippet">
            Освежување и усогласување на визуелен и комуникациски настап на пазарите во Југоисточна Европа,
            со цел конзистентен, современ и препознатлив идентитет — целосно усогласен со глобалните стандарди.
          </div>

<div class="case-actions">
            <a href="<?= htmlspecialchars($linkChalpha) ?>" target="_blank" rel="noopener" class="btn btn-primary btn-sm">Отвори проект</a>
            <button class="btn btn-outline-primary btn-sm" type="button" data-bs-toggle="collapse" data-bs-target="#cs2" aria-expanded="false" aria-controls="cs2">
              Види повеќе
            </button>
          </div>

<div class="collapse" id="cs2">
            <div class="case-section">
              <h3>Предизвик</h3>
              <p>
                GELITA - CH Alpha, дел од реномирана германска групација, имаше потреба од целосно освежување и усогласување на својот визуелен и комуникациски настап на пазарите во Југоисточна Европа.
              </p>
              <h3 class="mt-3">Нашиот пристап</h3>
              <p>
                ALL Media беше избрана како регионален маркетинг и креативен партнер, задолжен за развој и имплементација на новиот бренд идентитет и водење на целокупната маркетинг комуникација.
              </p>
              <h3 class="mt-3">Услуги</h3>
              <p class="mb-0">
                Brand strategy, brand book, ребрендирање, визуелен идентитет, дигитален маркетинг, социјални мрежи, видео и ТВ продукција, influencer маркетинг, OOH и брендирање.
              </p>
            </div>
          </div>
        </div>
      </article>

<article class="case-card">
        <div class="case-media">
          <img src="<?= htmlspecialchars($imgDoppel) ?>" alt="Doppel Herz – case study" loading="lazy">
          <div class="case-overlay"></div>
          <div class="case-badges">
            <span class="case-chip">Case Study</span>
            <span class="case-chip">Македонија</span>
            <span class="case-chip">Фармација</span>
          </div>
        </div>

<div class="case-body">
          <h2 class="h4 case-title mb-1">Допел Херц – целосна и доследна имплементација на бренд идентитет</h2>
          <div class="case-subtitle">Дигитално + теренски активности · Брендинг · Социјални мрежи · E-mail маркетинг</div>

<div class="case-snippet">
            Доследна имплементација на глобалниот бренд идентитет во локална комуникација, со силен фокус на конзистентност
            низ сите канали и присуство на терен.
          </div>

<div class="case-actions">
            <a href="<?= htmlspecialchars($linkDoppel) ?>" target="_blank" rel="noopener" class="btn btn-primary btn-sm">Отвори проект</a>
            <button class="btn btn-outline-primary btn-sm" type="button" data-bs-toggle="collapse" data-bs-target="#cs1" aria-expanded="false" aria-controls="cs1">
              Види повеќе
            </button>
          </div>

<div class="collapse" id="cs1">
            <div class="case-section">
              <h3>Реализирани активности</h3>
              <ul class="case-list">
                <li>Имплементација на бренд стандарди и комуникација</li>
                <li>Управување со социјални мрежи и содржини</li>
                <li>E-mail маркетинг кампањи</li>
                <li>Теренски промоции и активности во аптеки</li>
                <li>Брендирање на продажни места</li>
              </ul>

<h3 class="mt-3">Услуги</h3>
              <p class="mb-0">
                Маркетинг стратегија · Брендинг · Дизајн · Дигитален маркетинг · ПР · Теренски промоции
              </p>
            </div>
          </div>
        </div>
      </article>

</div>

<div class="text-center mt-5">
      <p class="section-text mb-3">
        Доколку сакате да видите конкретни примери од ваша индустрија,
        испратете ни порака и ќе ви пратиме custom селекција.
      </p>
      <a href="contact.php" class="btn btn-primary">Побарај примери</a>
    </div>
  </div>
</section>

<?php require __DIR__ . '/includes/footer.php'; ?>