Arhiva FOCUS Bucure\u0219ti \u2014 CCIB<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@500;600;700;800&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n :root{\r\n --navy:#0b2545;\r\n --navy-2:#123163;\r\n --navy-3:#0e2a52;\r\n --gold:#c9a227;\r\n --gold-light:#e6c869;\r\n --cream:#f7f4ee;\r\n --paper:#ffffff;\r\n --ink:#1c2430;\r\n --muted:#6b7280;\r\n --line:#e7e2d6;\r\n --radius:14px;\r\n --shadow:0 10px 30px rgba(11,37,69,0.10);\r\n }\r\n *{box-sizing:border-box;}\r\n html{scroll-behavior:smooth;}\r\n body{\r\n margin:0; background:var(--cream); color:var(--ink);\r\n font-family:'Inter', sans-serif; -webkit-font-smoothing:antialiased;\r\n }\r\n h1,h2,h3,.serif{ font-family:'Playfair Display', serif; }\r\n .mono{ font-family:'IBM Plex Mono', monospace; letter-spacing:0.02em; }\r\n mark{ background:rgba(201,162,39,.32); color:inherit; border-radius:3px; padding:0 2px; }\r\n\r\n \/* ---------- INTRO BAND ---------- *\/\r\n .intro-band{\r\n background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 55%, var(--navy-3) 100%);\r\n padding:32px 24px; position:relative; overflow:hidden;\r\n }\r\n .intro-band::before{\r\n content:\"\"; position:absolute; top:-60%; right:-8%; width:360px; height:360px; border-radius:50%;\r\n background:radial-gradient(circle, rgba(201,162,39,0.22), transparent 70%); pointer-events:none;\r\n }\r\n .intro-inner{\r\n max-width:1180px; margin:0 auto; position:relative; z-index:1;\r\n display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;\r\n }\r\n .intro-left{ display:flex; align-items:center; gap:16px; }\r\n .intro-icon{\r\n width:52px; height:52px; border-radius:14px; flex-shrink:0;\r\n background:linear-gradient(135deg,var(--gold),var(--gold-light));\r\n display:flex; align-items:center; justify-content:center; font-size:24px;\r\n box-shadow:0 8px 20px rgba(201,162,39,.3);\r\n }\r\n .intro-left h2{ color:#fff; font-size:22px; margin:0 0 4px 0; font-weight:700; }\r\n .intro-left p{ color:#c7d3e6; font-size:13.5px; margin:0; max-width:480px; line-height:1.5; }\r\n .intro-right{\r\n display:flex; align-items:center; gap:9px; color:#eaf0fb; font-family:'IBM Plex Mono',monospace;\r\n font-size:13.5px; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.16);\r\n padding:9px 16px; border-radius:999px; white-space:nowrap;\r\n }\r\n .intro-right b{ color:var(--gold-light); font-size:15px; }\r\n .live-dot{ width:8px;height:8px;border-radius:50%; background:#5fe05f; display:inline-block; animation:pulse 1.6s infinite;}\r\n @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(95,224,95,.6);}70%{box-shadow:0 0 0 8px rgba(95,224,95,0);}100%{box-shadow:0 0 0 0 rgba(95,224,95,0);}}\r\n\r\n \/* ---------- TICKER ---------- *\/\r\n .ticker-wrap{\r\n background:var(--navy-3); border-top:1px solid rgba(255,255,255,0.1);\r\n border-bottom:2px solid var(--gold); overflow:hidden; position:relative;\r\n }\r\n .ticker-wrap::before, .ticker-wrap::after{\r\n content:\"\"; position:absolute; top:0; bottom:0; width:60px; z-index:2; pointer-events:none;\r\n }\r\n .ticker-wrap::before{ left:0; background:linear-gradient(90deg, var(--navy-3), transparent);}\r\n .ticker-wrap::after{ right:0; background:linear-gradient(270deg, var(--navy-3), transparent);}\r\n .ticker{ display:flex; white-space:nowrap; width:max-content; animation:scroll-left 45s linear infinite; padding:11px 0; }\r\n .ticker:hover{ animation-play-state:paused; }\r\n @keyframes scroll-left{ from{transform:translateX(0);} to{transform:translateX(-50%);} }\r\n .ticker span.item{\r\n color:#e8edf6; font-family:'IBM Plex Mono',monospace; font-size:12.5px;\r\n padding:0 26px; display:inline-flex; align-items:center; gap:8px; border-right:1px solid rgba(255,255,255,0.12);\r\n }\r\n .ticker span.item b{ color:var(--gold-light); font-weight:500;}\r\n\r\n \/* ---------- STATS ---------- *\/\r\n .stats{ max-width:1180px; margin:-30px auto 0 auto; padding:0 24px; position:relative; z-index:3; }\r\n .stats-inner{\r\n background:var(--paper); border-radius:16px; box-shadow:var(--shadow);\r\n display:grid; grid-template-columns:repeat(3,1fr); padding:26px 10px;\r\n }\r\n .stat{ text-align:center; border-right:1px solid var(--line); padding:6px 10px;}\r\n .stat:last-child{border-right:none;}\r\n .stat .num{ font-family:'Playfair Display',serif; font-size:30px; color:var(--navy); font-weight:700;}\r\n .stat .lab{ font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:4px;}\r\n @media (max-width:700px){ .stats-inner{grid-template-columns:1fr;} .stat{border-right:none; border-bottom:1px solid var(--line); padding:14px 6px;} .stat:last-child{border-bottom:none;} }\r\n\r\n \/* ---------- MAIN ---------- *\/\r\n main{ max-width:1180px; margin:0 auto; padding:56px 24px 80px 24px; }\r\n .section-head{ text-align:center; margin-bottom:34px; }\r\n .eyebrow{\r\n text-transform:uppercase; font-size:12px; letter-spacing:.16em; color:#a9822b; font-weight:600;\r\n margin-bottom:16px; display:flex; align-items:center; justify-content:center; gap:10px;\r\n }\r\n .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:#a9822b; display:inline-block; box-shadow:0 0 0 4px rgba(169,130,43,.15);}\r\n .section-head h2{ font-size:32px; color:var(--navy); margin:0 0 10px 0; }\r\n .section-head p{ color:var(--muted); max-width:600px; margin:0 auto; font-size:15px; line-height:1.6;}\r\n\r\n .controls{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; margin-bottom:18px; }\r\n .search-wrap{ flex:1; min-width:240px; max-width:420px; }\r\n .search-wrap input{\r\n width:100%; padding:11px 16px; border-radius:999px; border:1px solid var(--line);\r\n background:var(--paper); font-family:'Inter'; font-size:13.5px; outline:none;\r\n transition:border-color .2s ease, box-shadow .2s ease;\r\n }\r\n .search-wrap input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,39,0.18);}\r\n .sort-wrap select{\r\n padding:11px 14px; border-radius:999px; border:1px solid var(--line); background:var(--paper);\r\n font-family:'Inter'; font-size:13px; color:var(--navy); font-weight:600; cursor:pointer; outline:none;\r\n }\r\n\r\n .chips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }\r\n .chip{\r\n font-size:12.5px; font-family:'IBM Plex Mono',monospace; padding:7px 14px; border-radius:8px; border:1px solid var(--line);\r\n background:var(--paper); color:var(--muted); cursor:pointer; transition:all .15s ease; font-weight:500;\r\n }\r\n .chip.active{ background:var(--navy); border-color:var(--navy); color:#fff; font-weight:600;}\r\n .chip:hover:not(.active){ border-color:var(--gold); color:var(--navy);}\r\n\r\n .results-count{ font-size:12.5px; color:var(--muted); margin:0 0 26px 0; font-family:'IBM Plex Mono',monospace; }\r\n .results-count b{ color:var(--navy); }\r\n\r\n \/* ---------- TIMELINE ---------- *\/\r\n .timeline{ position:relative; }\r\n .timeline::before{\r\n content:\"\"; position:absolute; left:50%; top:0; bottom:0; width:2px;\r\n background:linear-gradient(var(--line), var(--gold), var(--line)); transform:translateX(-50%);\r\n }\r\n @media (max-width:820px){ .timeline::before{ left:22px; } }\r\n\r\n .tl-item{\r\n position:relative; width:100%; display:flex; margin-bottom:34px;\r\n animation:fadeUp .45s ease both;\r\n }\r\n @keyframes fadeUp{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }\r\n .tl-item.left{ justify-content:flex-start; }\r\n .tl-item.right{ justify-content:flex-end; }\r\n @media (max-width:820px){ .tl-item.left, .tl-item.right{ justify-content:flex-start; padding-left:52px; } }\r\n\r\n .tl-dot{\r\n position:absolute; left:50%; top:22px; transform:translateX(-50%);\r\n width:16px; height:16px; border-radius:50%; background:var(--paper); border:3px solid var(--gold);\r\n z-index:2; box-shadow:0 0 0 4px var(--cream);\r\n }\r\n .tl-item.latest .tl-dot{ background:var(--gold); animation:noupulse 1.8s infinite; }\r\n @keyframes noupulse{0%{box-shadow:0 0 0 0 rgba(201,162,39,.5), 0 0 0 4px var(--cream);}70%{box-shadow:0 0 0 8px rgba(201,162,39,0), 0 0 0 4px var(--cream);}100%{box-shadow:0 0 0 0 rgba(201,162,39,0), 0 0 0 4px var(--cream);}}\r\n @media (max-width:820px){ .tl-dot{ left:22px; top:22px; } }\r\n\r\n .tl-card{\r\n width:calc(50% - 40px); background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);\r\n padding:22px 22px 20px 22px; box-shadow:0 2px 10px rgba(11,37,69,.05);\r\n transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; position:relative; overflow:hidden;\r\n }\r\n .tl-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--gold); }\r\n .tl-card::before{ content:\"\"; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--gold); opacity:0; transition:opacity .2s ease; }\r\n .tl-card:hover::before{ opacity:1; }\r\n @media (max-width:820px){ .tl-card{ width:100%; } }\r\n\r\n .tl-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }\r\n .tl-year{\r\n font-family:'Playfair Display',serif; font-size:26px; font-weight:700; color:var(--navy);\r\n display:flex; align-items:center; gap:8px;\r\n }\r\n .tl-edition{\r\n font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--muted); background:var(--cream);\r\n padding:3px 9px; border-radius:6px; text-transform:uppercase; letter-spacing:.04em;\r\n }\r\n .nou-badge{\r\n font-family:'Inter',sans-serif; font-size:9.5px; font-weight:700; color:#fff; background:#d84c4c;\r\n padding:2px 7px; border-radius:5px; letter-spacing:.04em;\r\n }\r\n .tl-date{ font-size:11.5px; color:var(--muted); font-family:'IBM Plex Mono',monospace; margin-bottom:10px; }\r\n .tl-card h3{ font-size:17px; line-height:1.35; margin:0 0 6px 0; font-weight:600; color:var(--ink); font-family:'Inter'; }\r\n .tl-slogan{ font-size:13px; font-style:italic; color:#a9822b; margin:0 0 12px 0; }\r\n .tl-highlights{ list-style:none; padding:0; margin:0 0 16px 0; }\r\n .tl-highlights li{\r\n font-size:13px; color:var(--muted); line-height:1.5; padding-left:16px; position:relative; margin-bottom:6px;\r\n }\r\n .tl-highlights li::before{ content:\"\u2014\"; position:absolute; left:0; color:var(--gold); }\r\n\r\n .card-actions{ display:flex; align-items:center; gap:8px; }\r\n .go{\r\n flex:1; font-size:12.5px; font-weight:600; color:var(--navy); text-decoration:none;\r\n display:inline-flex; align-items:center; gap:6px; padding-top:10px; border-top:1px solid var(--line);\r\n }\r\n .go:hover{ color:#a9822b; }\r\n .go span.arrow{ transition:transform .15s ease;}\r\n .go:hover span.arrow{ transform:translateX(4px);}\r\n .copy-btn{\r\n flex-shrink:0; width:32px; height:32px; border-radius:8px; border:1px solid var(--line);\r\n background:var(--paper); color:var(--muted); cursor:pointer; display:flex; align-items:center; justify-content:center;\r\n font-size:13px; transition:all .15s ease; margin-top:10px;\r\n }\r\n .copy-btn:hover{ border-color:var(--gold); color:var(--navy); background:var(--cream); }\r\n .copy-btn.copied{ color:#2f9e44; border-color:#2f9e44; }\r\n\r\n .empty{ text-align:center; padding:60px 20px; color:var(--muted); }\r\n .empty .big{ font-size:38px; margin-bottom:10px;}\r\n\r\n .toast{\r\n position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px);\r\n background:var(--navy); color:#fff; padding:12px 20px; border-radius:10px; font-size:13.5px;\r\n font-family:'Inter'; box-shadow:0 10px 30px rgba(0,0,0,.25); opacity:0; pointer-events:none;\r\n transition:opacity .25s ease, transform .25s ease; z-index:50;\r\n }\r\n .toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }\r\n\r\n ::selection{ background:var(--gold); color:var(--navy); }\r\n a{ -webkit-tap-highlight-color:transparent; }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"intro-band\">\r\n <div class=\"intro-inner\">\r\n <div class=\"intro-left\">\r\n <div class=\"intro-icon\">\ud83c\udfdb\ufe0f<\/div>\r\n <div>\r\n <h2>Arhiva FOCUS Bucure\u0219ti<\/h2>\r\n <p>Conferin\u021ba anual\u0103 a CCIB dedicat\u0103 dezvolt\u0103rii Capitalei \u2014 toate edi\u021biile, de la prima din 2018 p\u00e2n\u0103 la cea mai recent\u0103.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"intro-right\"><span class=\"live-dot\"><\/span> <b id=\"totalLive\">0<\/b> edi\u021bii desf\u0103\u0219urate<\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<div class=\"ticker-wrap\">\r\n <div class=\"ticker\" id=\"ticker\"><\/div>\r\n<\/div>\r\n\r\n<div class=\"stats\">\r\n <div class=\"stats-inner\">\r\n <div class=\"stat\"><div class=\"num\" data-count=\"8\">0<\/div><div class=\"lab\">Edi\u021bii desf\u0103\u0219urate<\/div><\/div>\r\n <div class=\"stat\"><div class=\"num\" data-count=\"2018\">0<\/div><div class=\"lab\">Prima edi\u021bie<\/div><\/div>\r\n <div class=\"stat\"><div class=\"num\" data-count=\"2026\">0<\/div><div class=\"lab\">Cea mai recent\u0103<\/div><\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<main id=\"explore\">\r\n <div class=\"section-head\">\r\n <div class=\"eyebrow\"><span class=\"dot\"><\/span> ISTORIC CONFERIN\u021a\u0102<\/div>\r\n <h2>Opt edi\u021bii, un singur ora\u0219<\/h2>\r\n <p>De la mobilitate \u0219i economie urban\u0103, la digitalizare, sustenabilitate \u0219i turism \u2014 parcurge temele care au marcat fiecare edi\u021bie FOCUS Bucure\u0219ti.<\/p>\r\n <\/div>\r\n\r\n <div class=\"controls\">\r\n <div class=\"search-wrap\">\r\n <input id=\"search\" type=\"text\" placeholder=\"Caut\u0103 dup\u0103 tem\u0103, an, subiect\u2026\">\r\n <\/div>\r\n <div class=\"sort-wrap\">\r\n <select id=\"sortSelect\">\r\n <option value=\"desc\">Cele mai recente primele<\/option>\r\n <option value=\"asc\">Cele mai vechi primele<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"chips\" id=\"yearChips\"><\/div>\r\n <p class=\"results-count\" id=\"resultsCount\"><\/p>\r\n\r\n <div class=\"timeline\" id=\"timeline\"><\/div>\r\n <div class=\"empty\" id=\"emptyState\" style=\"display:none;\">\r\n <div class=\"big\">\ud83d\udd0d<\/div>\r\n Nicio edi\u021bie g\u0103sit\u0103. \u00cencearc\u0103 alt termen de c\u0103utare.\r\n <\/div>\r\n<\/main>\r\n\r\n<div class=\"toast\" id=\"toast\"><\/div>\r\n\r\n<script>\r\nconst EDITIONS = [\r\n {\r\n year:2018, edition:\"Edi\u021bia I\", date:\"10 mai 2018\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Prima edi\u021bie a conferin\u021bei anuale FOCUS Bucure\u0219ti, organizat\u0103 \u00een anul aniversar al celor 150 de ani ai CCIB.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/aniversare-150-ani\/conferinta-focus-bucuresti-dezvoltare-urbana-economie-mobilitate\/\"\r\n },\r\n {\r\n year:2019, edition:\"Edi\u021bia a II-a\", date:\"2019\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"A doua edi\u021bie a seriei anuale de dezbateri dedicate dezvolt\u0103rii Capitalei.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/focus-bucuresti-editia2\/\"\r\n },\r\n {\r\n year:2021, edition:\"Edi\u021bia a III-a\", date:\"23 iunie 2021\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Digitalizarea administra\u021biei \u0219i accesul operatorilor economici la serviciile publice.\",\r\n \"Bucure\u0219ti Smart City \u2014 solu\u021bii \u0219i oportunit\u0103\u021bi.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-2021-dezvoltare-urbana-economie-mobilitate\/\"\r\n },\r\n {\r\n year:2022, edition:\"Edi\u021bia a IV-a\", date:\"8 iunie 2022\",\r\n title:\"Dezvoltare urban\u0103, digitalizare, economie circular\u0103\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Axele prioritare de finan\u021bare din Programul Opera\u021bional Regional: digitalizare, mediu, mobilitate, regenerare.\",\r\n \"Priorit\u0103\u021bi ale administra\u021biei publice pentru digitalizarea serviciilor \u0219i aplica\u021bii smart pentru Capital\u0103.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/focus-bucuresti-ed4-2022\/\"\r\n },\r\n {\r\n year:2023, edition:\"Edi\u021bia a V-a\", date:\"13 iunie 2023\",\r\n title:\"Infrastructur\u0103 \u0219i dezvoltare urban\u0103 sustenabil\u0103\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Planificarea sustenabil\u0103 a infrastructurii urbane \u0219i oportunit\u0103\u021bile de finan\u021bare prin PNRR.\",\r\n \"Transport public verde, regenerare urban\u0103 \u0219i gestionarea durabil\u0103 a de\u0219eurilor.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-infrastructura-dezvoltare-urbana-2023\/\"\r\n },\r\n {\r\n year:2024, edition:\"Edi\u021bia a VI-a\", date:\"22 mai 2024\",\r\n title:\"Conect\u00e2nd tehnologia cu sustenabilitatea pentru un Bucure\u0219ti mai bun\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Evenimentul a reunit speciali\u0219ti \u0219i oficiali pentru a dezbate integrarea tehnologiei \u00een dezvoltarea sustenabil\u0103 a ora\u0219ului.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-tehnologie-conectata-sustenabilitate-editia6-mai2024\/\"\r\n },\r\n {\r\n year:2025, edition:\"Edi\u021bia a VII-a\", date:\"21 mai 2025\",\r\n title:\"Dezvoltarea sustenabil\u0103 a Capitalei: Infrastructur\u0103, Digitalizare \u0219i Economia Circular\u0103\",\r\n slogan:\"Capitala \u00een mi\u0219care: verde, digital\u0103, circular\u0103\",\r\n highlights:[\r\n \"Au fost invita\u021bi primarii celor \u0219ase sectoare ale Capitalei, al\u0103turi de reprezentan\u021bi ai administra\u021biei centrale.\",\r\n \"Dialog despre transformarea verde, digital\u0103 \u0219i incluziv\u0103 a Bucure\u0219tiului.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-dezvoltare-sustenabila-capitala-editia7-21mai2025\/\"\r\n },\r\n {\r\n year:2026, edition:\"Edi\u021bia a VIII-a\", date:\"20 mai 2026\",\r\n title:\"Turism, Infrastructur\u0103 \u0219i Patrimoniu Istoric \u00een Capital\u0103\",\r\n slogan:\"Ora\u0219ul nostru, destina\u021bia lor\",\r\n highlights:[\r\n \"Panel I \u2014 Patrimoniu istoric, identitate urban\u0103 \u0219i finan\u021bare, cu ADRBI, Ministerul Culturii \u0219i Institutul Na\u021bional al Patrimoniului.\",\r\n \"Panel II \u2014 Infrastructur\u0103 turistic\u0103 \u0219i promovarea Capitalei, cu MEDA, ANAT, HORA \u0219i prim\u0103riile de sector.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-turism-infrastructura-patrimoniu-istoric-editia-a-viii-a-20-mai-2026\/\"\r\n }\r\n];\r\n\r\nconst LATEST_YEAR = Math.max(...EDITIONS.map(e=>e.year));\r\n\r\nlet currentSort = \"desc\";\r\nlet activeYear = \"all\";\r\n\r\nfunction escapeRegExp(str){ return str.replace(\/[.*+?^${}()|[\\]\\\\]\/g, '\\\\$&'); }\r\nfunction highlight(text, q){\r\n if(!q) return text;\r\n const re = new RegExp('(' + escapeRegExp(q) + ')', 'ig');\r\n return text.replace(re, '<mark>$1<\/mark>');\r\n}\r\nfunction showToast(msg){\r\n const t = document.getElementById('toast');\r\n t.textContent = msg;\r\n t.classList.add('show');\r\n clearTimeout(showToast._t);\r\n showToast._t = setTimeout(()=> t.classList.remove('show'), 2200);\r\n}\r\n\r\nfunction buildTicker(){\r\n const items = EDITIONS.slice().sort((a,b)=>b.year-a.year);\r\n const html = items.map(e=>`<span class=\"item\">\ud83c\udfa4 <b>${e.year}<\/b> \u2014 ${e.title}<\/span>`).join('');\r\n document.getElementById('ticker').innerHTML = html + html;\r\n}\r\n\r\nfunction buildChips(){\r\n const years = EDITIONS.map(e=>e.year).sort((a,b)=>b-a);\r\n const wrap = document.getElementById('yearChips');\r\n let html = `<div class=\"chip active\" data-year=\"all\">Toate edi\u021biile<\/div>`;\r\n years.forEach(y=>{ html += `<div class=\"chip\" data-year=\"${y}\">${y}<\/div>`; });\r\n wrap.innerHTML = html;\r\n wrap.querySelectorAll('.chip').forEach(chip=>{\r\n chip.addEventListener('click',()=>{\r\n wrap.querySelectorAll('.chip').forEach(x=>x.classList.remove('active'));\r\n chip.classList.add('active');\r\n activeYear = chip.dataset.year;\r\n render();\r\n });\r\n });\r\n}\r\n\r\nfunction render(){\r\n const qRaw = document.getElementById('search').value.trim();\r\n const q = qRaw.toLowerCase();\r\n\r\n let filtered = EDITIONS.filter(e=>{\r\n const matchYear = activeYear===\"all\" || String(e.year)===activeYear;\r\n const haystack = (e.title+' '+e.slogan+' '+e.highlights.join(' ')+' '+e.year).toLowerCase();\r\n const matchQ = !q || haystack.includes(q);\r\n return matchYear && matchQ;\r\n });\r\n\r\n filtered.sort((a,b)=> currentSort===\"desc\" ? b.year-a.year : a.year-b.year);\r\n\r\n const countEl = document.getElementById('resultsCount');\r\n countEl.innerHTML = filtered.length\r\n ? `<b>${filtered.length}<\/b> edi\u021bi${filtered.length===1?'e g\u0103sit\u0103':'i g\u0103site'}`\r\n : '';\r\n\r\n document.getElementById('emptyState').style.display = filtered.length ? 'none' : 'block';\r\n\r\n const tl = document.getElementById('timeline');\r\n tl.innerHTML = filtered.map((e,i)=>{\r\n const side = i%2===0 ? 'left' : 'right';\r\n const isLatest = e.year===LATEST_YEAR;\r\n return `\r\n <div class=\"tl-item ${side} ${isLatest?'latest':''}\">\r\n <div class=\"tl-dot\"><\/div>\r\n <div class=\"tl-card\">\r\n <div class=\"tl-top\">\r\n <div class=\"tl-year\">${highlight(String(e.year),qRaw)} ${isLatest?'<span class=\"nou-badge\">CEA MAI RECENT\u0102<\/span>':''}<\/div>\r\n <span class=\"tl-edition\">${e.edition}<\/span>\r\n <\/div>\r\n <div class=\"tl-date\">${e.date}<\/div>\r\n <h3>${highlight(e.title,qRaw)}<\/h3>\r\n ${e.slogan ? `<p class=\"tl-slogan\">\u201e${highlight(e.slogan,qRaw)}\u201d<\/p>` : ''}\r\n <ul class=\"tl-highlights\">\r\n ${e.highlights.map(h=>`<li>${highlight(h,qRaw)}<\/li>`).join('')}\r\n <\/ul>\r\n <div class=\"card-actions\">\r\n <a class=\"go\" href=\"${e.url}\" target=\"_blank\" rel=\"noopener\">Vezi pagina evenimentului <span class=\"arrow\">\u2192<\/span><\/a>\r\n <button class=\"copy-btn\" data-url=\"${e.url}\" title=\"Copiaz\u0103 link\">\ud83d\udd17<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>`;\r\n }).join('');\r\n}\r\n\r\nfunction attachCopyDelegate(){\r\n document.getElementById('timeline').addEventListener('click',(e)=>{\r\n const btn = e.target.closest('.copy-btn');\r\n if(!btn) return;\r\n const url = btn.dataset.url;\r\n navigator.clipboard.writeText(url).then(()=>{\r\n btn.classList.add('copied');\r\n btn.textContent = '\u2713';\r\n showToast('Link copiat \u00een clipboard');\r\n setTimeout(()=>{ btn.classList.remove('copied'); btn.textContent='\ud83d\udd17'; }, 1500);\r\n }).catch(()=> showToast('Nu s-a putut copia linkul'));\r\n });\r\n}\r\n\r\nfunction animateCount(el, target){\r\n let cur = 0;\r\n const step = Math.max(1, Math.round(target\/40));\r\n const t = setInterval(()=>{\r\n cur += step;\r\n if(cur>=target){ cur=target; clearInterval(t); }\r\n el.textContent = cur;\r\n },30);\r\n}\r\nfunction animateStats(){\r\n document.querySelectorAll('.stat .num').forEach(el=>{\r\n animateCount(el, parseInt(el.dataset.count,10));\r\n });\r\n}\r\n\r\ndocument.getElementById('search').addEventListener('input', render);\r\ndocument.getElementById('sortSelect').addEventListener('change', (e)=>{ currentSort = e.target.value; render(); });\r\n\r\n\/\/ ---------------- BOOT ----------------\r\nbuildTicker();\r\nbuildChips();\r\nrender();\r\nattachCopyDelegate();\r\nanimateCount(document.getElementById('totalLive'), EDITIONS.length);\r\n\r\nconst io = new IntersectionObserver((entries)=>{\r\n entries.forEach(entry=>{\r\n if(entry.isIntersecting){ animateStats(); io.disconnect(); }\r\n });\r\n},{threshold:0.4});\r\nio.observe(document.querySelector('.stats'));\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Arhiva FOCUS Bucure\u0219ti \u2014 CCIB \ud83c\udfdb\ufe0f Arhiva FOCUS Bucure\u0219ti Conferin\u021ba anual\u0103 a CCIB dedicat\u0103 dezvolt\u0103rii Capitalei \u2014 toate edi\u021biile, de…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"footnotes":""},"class_list":["post-34472","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=34472"}],"version-history":[{"count":4,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472\/revisions"}],"predecessor-version":[{"id":34476,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472\/revisions\/34476"}],"wp:attachment":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=34472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n \t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nArhiva FOCUS Bucure\u0219ti \u2014 CCIB<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@500;600;700;800&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n :root{\r\n --navy:#0b2545;\r\n --navy-2:#123163;\r\n --navy-3:#0e2a52;\r\n --gold:#c9a227;\r\n --gold-light:#e6c869;\r\n --cream:#f7f4ee;\r\n --paper:#ffffff;\r\n --ink:#1c2430;\r\n --muted:#6b7280;\r\n --line:#e7e2d6;\r\n --radius:14px;\r\n --shadow:0 10px 30px rgba(11,37,69,0.10);\r\n }\r\n *{box-sizing:border-box;}\r\n html{scroll-behavior:smooth;}\r\n body{\r\n margin:0; background:var(--cream); color:var(--ink);\r\n font-family:'Inter', sans-serif; -webkit-font-smoothing:antialiased;\r\n }\r\n h1,h2,h3,.serif{ font-family:'Playfair Display', serif; }\r\n .mono{ font-family:'IBM Plex Mono', monospace; letter-spacing:0.02em; }\r\n mark{ background:rgba(201,162,39,.32); color:inherit; border-radius:3px; padding:0 2px; }\r\n\r\n \/* ---------- INTRO BAND ---------- *\/\r\n .intro-band{\r\n background:linear-gradient(120deg, var(--navy) 0%, var(--navy-2) 55%, var(--navy-3) 100%);\r\n padding:32px 24px; position:relative; overflow:hidden;\r\n }\r\n .intro-band::before{\r\n content:\"\"; position:absolute; top:-60%; right:-8%; width:360px; height:360px; border-radius:50%;\r\n background:radial-gradient(circle, rgba(201,162,39,0.22), transparent 70%); pointer-events:none;\r\n }\r\n .intro-inner{\r\n max-width:1180px; margin:0 auto; position:relative; z-index:1;\r\n display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;\r\n }\r\n .intro-left{ display:flex; align-items:center; gap:16px; }\r\n .intro-icon{\r\n width:52px; height:52px; border-radius:14px; flex-shrink:0;\r\n background:linear-gradient(135deg,var(--gold),var(--gold-light));\r\n display:flex; align-items:center; justify-content:center; font-size:24px;\r\n box-shadow:0 8px 20px rgba(201,162,39,.3);\r\n }\r\n .intro-left h2{ color:#fff; font-size:22px; margin:0 0 4px 0; font-weight:700; }\r\n .intro-left p{ color:#c7d3e6; font-size:13.5px; margin:0; max-width:480px; line-height:1.5; }\r\n .intro-right{\r\n display:flex; align-items:center; gap:9px; color:#eaf0fb; font-family:'IBM Plex Mono',monospace;\r\n font-size:13.5px; background:rgba(255,255,255,0.07); border:1px solid rgba(255,255,255,0.16);\r\n padding:9px 16px; border-radius:999px; white-space:nowrap;\r\n }\r\n .intro-right b{ color:var(--gold-light); font-size:15px; }\r\n .live-dot{ width:8px;height:8px;border-radius:50%; background:#5fe05f; display:inline-block; animation:pulse 1.6s infinite;}\r\n @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(95,224,95,.6);}70%{box-shadow:0 0 0 8px rgba(95,224,95,0);}100%{box-shadow:0 0 0 0 rgba(95,224,95,0);}}\r\n\r\n \/* ---------- TICKER ---------- *\/\r\n .ticker-wrap{\r\n background:var(--navy-3); border-top:1px solid rgba(255,255,255,0.1);\r\n border-bottom:2px solid var(--gold); overflow:hidden; position:relative;\r\n }\r\n .ticker-wrap::before, .ticker-wrap::after{\r\n content:\"\"; position:absolute; top:0; bottom:0; width:60px; z-index:2; pointer-events:none;\r\n }\r\n .ticker-wrap::before{ left:0; background:linear-gradient(90deg, var(--navy-3), transparent);}\r\n .ticker-wrap::after{ right:0; background:linear-gradient(270deg, var(--navy-3), transparent);}\r\n .ticker{ display:flex; white-space:nowrap; width:max-content; animation:scroll-left 45s linear infinite; padding:11px 0; }\r\n .ticker:hover{ animation-play-state:paused; }\r\n @keyframes scroll-left{ from{transform:translateX(0);} to{transform:translateX(-50%);} }\r\n .ticker span.item{\r\n color:#e8edf6; font-family:'IBM Plex Mono',monospace; font-size:12.5px;\r\n padding:0 26px; display:inline-flex; align-items:center; gap:8px; border-right:1px solid rgba(255,255,255,0.12);\r\n }\r\n .ticker span.item b{ color:var(--gold-light); font-weight:500;}\r\n\r\n \/* ---------- STATS ---------- *\/\r\n .stats{ max-width:1180px; margin:-30px auto 0 auto; padding:0 24px; position:relative; z-index:3; }\r\n .stats-inner{\r\n background:var(--paper); border-radius:16px; box-shadow:var(--shadow);\r\n display:grid; grid-template-columns:repeat(3,1fr); padding:26px 10px;\r\n }\r\n .stat{ text-align:center; border-right:1px solid var(--line); padding:6px 10px;}\r\n .stat:last-child{border-right:none;}\r\n .stat .num{ font-family:'Playfair Display',serif; font-size:30px; color:var(--navy); font-weight:700;}\r\n .stat .lab{ font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; margin-top:4px;}\r\n @media (max-width:700px){ .stats-inner{grid-template-columns:1fr;} .stat{border-right:none; border-bottom:1px solid var(--line); padding:14px 6px;} .stat:last-child{border-bottom:none;} }\r\n\r\n \/* ---------- MAIN ---------- *\/\r\n main{ max-width:1180px; margin:0 auto; padding:56px 24px 80px 24px; }\r\n .section-head{ text-align:center; margin-bottom:34px; }\r\n .eyebrow{\r\n text-transform:uppercase; font-size:12px; letter-spacing:.16em; color:#a9822b; font-weight:600;\r\n margin-bottom:16px; display:flex; align-items:center; justify-content:center; gap:10px;\r\n }\r\n .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:#a9822b; display:inline-block; box-shadow:0 0 0 4px rgba(169,130,43,.15);}\r\n .section-head h2{ font-size:32px; color:var(--navy); margin:0 0 10px 0; }\r\n .section-head p{ color:var(--muted); max-width:600px; margin:0 auto; font-size:15px; line-height:1.6;}\r\n\r\n .controls{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; margin-bottom:18px; }\r\n .search-wrap{ flex:1; min-width:240px; max-width:420px; }\r\n .search-wrap input{\r\n width:100%; padding:11px 16px; border-radius:999px; border:1px solid var(--line);\r\n background:var(--paper); font-family:'Inter'; font-size:13.5px; outline:none;\r\n transition:border-color .2s ease, box-shadow .2s ease;\r\n }\r\n .search-wrap input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,39,0.18);}\r\n .sort-wrap select{\r\n padding:11px 14px; border-radius:999px; border:1px solid var(--line); background:var(--paper);\r\n font-family:'Inter'; font-size:13px; color:var(--navy); font-weight:600; cursor:pointer; outline:none;\r\n }\r\n\r\n .chips{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }\r\n .chip{\r\n font-size:12.5px; font-family:'IBM Plex Mono',monospace; padding:7px 14px; border-radius:8px; border:1px solid var(--line);\r\n background:var(--paper); color:var(--muted); cursor:pointer; transition:all .15s ease; font-weight:500;\r\n }\r\n .chip.active{ background:var(--navy); border-color:var(--navy); color:#fff; font-weight:600;}\r\n .chip:hover:not(.active){ border-color:var(--gold); color:var(--navy);}\r\n\r\n .results-count{ font-size:12.5px; color:var(--muted); margin:0 0 26px 0; font-family:'IBM Plex Mono',monospace; }\r\n .results-count b{ color:var(--navy); }\r\n\r\n \/* ---------- TIMELINE ---------- *\/\r\n .timeline{ position:relative; }\r\n .timeline::before{\r\n content:\"\"; position:absolute; left:50%; top:0; bottom:0; width:2px;\r\n background:linear-gradient(var(--line), var(--gold), var(--line)); transform:translateX(-50%);\r\n }\r\n @media (max-width:820px){ .timeline::before{ left:22px; } }\r\n\r\n .tl-item{\r\n position:relative; width:100%; display:flex; margin-bottom:34px;\r\n animation:fadeUp .45s ease both;\r\n }\r\n @keyframes fadeUp{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }\r\n .tl-item.left{ justify-content:flex-start; }\r\n .tl-item.right{ justify-content:flex-end; }\r\n @media (max-width:820px){ .tl-item.left, .tl-item.right{ justify-content:flex-start; padding-left:52px; } }\r\n\r\n .tl-dot{\r\n position:absolute; left:50%; top:22px; transform:translateX(-50%);\r\n width:16px; height:16px; border-radius:50%; background:var(--paper); border:3px solid var(--gold);\r\n z-index:2; box-shadow:0 0 0 4px var(--cream);\r\n }\r\n .tl-item.latest .tl-dot{ background:var(--gold); animation:noupulse 1.8s infinite; }\r\n @keyframes noupulse{0%{box-shadow:0 0 0 0 rgba(201,162,39,.5), 0 0 0 4px var(--cream);}70%{box-shadow:0 0 0 8px rgba(201,162,39,0), 0 0 0 4px var(--cream);}100%{box-shadow:0 0 0 0 rgba(201,162,39,0), 0 0 0 4px var(--cream);}}\r\n @media (max-width:820px){ .tl-dot{ left:22px; top:22px; } }\r\n\r\n .tl-card{\r\n width:calc(50% - 40px); background:var(--paper); border:1px solid var(--line); border-radius:var(--radius);\r\n padding:22px 22px 20px 22px; box-shadow:0 2px 10px rgba(11,37,69,.05);\r\n transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; position:relative; overflow:hidden;\r\n }\r\n .tl-card:hover{ transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--gold); }\r\n .tl-card::before{ content:\"\"; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--gold); opacity:0; transition:opacity .2s ease; }\r\n .tl-card:hover::before{ opacity:1; }\r\n @media (max-width:820px){ .tl-card{ width:100%; } }\r\n\r\n .tl-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }\r\n .tl-year{\r\n font-family:'Playfair Display',serif; font-size:26px; font-weight:700; color:var(--navy);\r\n display:flex; align-items:center; gap:8px;\r\n }\r\n .tl-edition{\r\n font-family:'IBM Plex Mono',monospace; font-size:10.5px; color:var(--muted); background:var(--cream);\r\n padding:3px 9px; border-radius:6px; text-transform:uppercase; letter-spacing:.04em;\r\n }\r\n .nou-badge{\r\n font-family:'Inter',sans-serif; font-size:9.5px; font-weight:700; color:#fff; background:#d84c4c;\r\n padding:2px 7px; border-radius:5px; letter-spacing:.04em;\r\n }\r\n .tl-date{ font-size:11.5px; color:var(--muted); font-family:'IBM Plex Mono',monospace; margin-bottom:10px; }\r\n .tl-card h3{ font-size:17px; line-height:1.35; margin:0 0 6px 0; font-weight:600; color:var(--ink); font-family:'Inter'; }\r\n .tl-slogan{ font-size:13px; font-style:italic; color:#a9822b; margin:0 0 12px 0; }\r\n .tl-highlights{ list-style:none; padding:0; margin:0 0 16px 0; }\r\n .tl-highlights li{\r\n font-size:13px; color:var(--muted); line-height:1.5; padding-left:16px; position:relative; margin-bottom:6px;\r\n }\r\n .tl-highlights li::before{ content:\"\u2014\"; position:absolute; left:0; color:var(--gold); }\r\n\r\n .card-actions{ display:flex; align-items:center; gap:8px; }\r\n .go{\r\n flex:1; font-size:12.5px; font-weight:600; color:var(--navy); text-decoration:none;\r\n display:inline-flex; align-items:center; gap:6px; padding-top:10px; border-top:1px solid var(--line);\r\n }\r\n .go:hover{ color:#a9822b; }\r\n .go span.arrow{ transition:transform .15s ease;}\r\n .go:hover span.arrow{ transform:translateX(4px);}\r\n .copy-btn{\r\n flex-shrink:0; width:32px; height:32px; border-radius:8px; border:1px solid var(--line);\r\n background:var(--paper); color:var(--muted); cursor:pointer; display:flex; align-items:center; justify-content:center;\r\n font-size:13px; transition:all .15s ease; margin-top:10px;\r\n }\r\n .copy-btn:hover{ border-color:var(--gold); color:var(--navy); background:var(--cream); }\r\n .copy-btn.copied{ color:#2f9e44; border-color:#2f9e44; }\r\n\r\n .empty{ text-align:center; padding:60px 20px; color:var(--muted); }\r\n .empty .big{ font-size:38px; margin-bottom:10px;}\r\n\r\n .toast{\r\n position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px);\r\n background:var(--navy); color:#fff; padding:12px 20px; border-radius:10px; font-size:13.5px;\r\n font-family:'Inter'; box-shadow:0 10px 30px rgba(0,0,0,.25); opacity:0; pointer-events:none;\r\n transition:opacity .25s ease, transform .25s ease; z-index:50;\r\n }\r\n .toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }\r\n\r\n ::selection{ background:var(--gold); color:var(--navy); }\r\n a{ -webkit-tap-highlight-color:transparent; }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<section class=\"intro-band\">\r\n <div class=\"intro-inner\">\r\n <div class=\"intro-left\">\r\n <div class=\"intro-icon\">\ud83c\udfdb\ufe0f<\/div>\r\n <div>\r\n <h2>Arhiva FOCUS Bucure\u0219ti<\/h2>\r\n <p>Conferin\u021ba anual\u0103 a CCIB dedicat\u0103 dezvolt\u0103rii Capitalei \u2014 toate edi\u021biile, de la prima din 2018 p\u00e2n\u0103 la cea mai recent\u0103.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"intro-right\"><span class=\"live-dot\"><\/span> <b id=\"totalLive\">0<\/b> edi\u021bii desf\u0103\u0219urate<\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<div class=\"ticker-wrap\">\r\n <div class=\"ticker\" id=\"ticker\"><\/div>\r\n<\/div>\r\n\r\n<div class=\"stats\">\r\n <div class=\"stats-inner\">\r\n <div class=\"stat\"><div class=\"num\" data-count=\"8\">0<\/div><div class=\"lab\">Edi\u021bii desf\u0103\u0219urate<\/div><\/div>\r\n <div class=\"stat\"><div class=\"num\" data-count=\"2018\">0<\/div><div class=\"lab\">Prima edi\u021bie<\/div><\/div>\r\n <div class=\"stat\"><div class=\"num\" data-count=\"2026\">0<\/div><div class=\"lab\">Cea mai recent\u0103<\/div><\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<main id=\"explore\">\r\n <div class=\"section-head\">\r\n <div class=\"eyebrow\"><span class=\"dot\"><\/span> ISTORIC CONFERIN\u021a\u0102<\/div>\r\n <h2>Opt edi\u021bii, un singur ora\u0219<\/h2>\r\n <p>De la mobilitate \u0219i economie urban\u0103, la digitalizare, sustenabilitate \u0219i turism \u2014 parcurge temele care au marcat fiecare edi\u021bie FOCUS Bucure\u0219ti.<\/p>\r\n <\/div>\r\n\r\n <div class=\"controls\">\r\n <div class=\"search-wrap\">\r\n <input id=\"search\" type=\"text\" placeholder=\"Caut\u0103 dup\u0103 tem\u0103, an, subiect\u2026\">\r\n <\/div>\r\n <div class=\"sort-wrap\">\r\n <select id=\"sortSelect\">\r\n <option value=\"desc\">Cele mai recente primele<\/option>\r\n <option value=\"asc\">Cele mai vechi primele<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"chips\" id=\"yearChips\"><\/div>\r\n <p class=\"results-count\" id=\"resultsCount\"><\/p>\r\n\r\n <div class=\"timeline\" id=\"timeline\"><\/div>\r\n <div class=\"empty\" id=\"emptyState\" style=\"display:none;\">\r\n <div class=\"big\">\ud83d\udd0d<\/div>\r\n Nicio edi\u021bie g\u0103sit\u0103. \u00cencearc\u0103 alt termen de c\u0103utare.\r\n <\/div>\r\n<\/main>\r\n\r\n<div class=\"toast\" id=\"toast\"><\/div>\r\n\r\n<script>\r\nconst EDITIONS = [\r\n {\r\n year:2018, edition:\"Edi\u021bia I\", date:\"10 mai 2018\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Prima edi\u021bie a conferin\u021bei anuale FOCUS Bucure\u0219ti, organizat\u0103 \u00een anul aniversar al celor 150 de ani ai CCIB.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/aniversare-150-ani\/conferinta-focus-bucuresti-dezvoltare-urbana-economie-mobilitate\/\"\r\n },\r\n {\r\n year:2019, edition:\"Edi\u021bia a II-a\", date:\"2019\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"A doua edi\u021bie a seriei anuale de dezbateri dedicate dezvolt\u0103rii Capitalei.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/focus-bucuresti-editia2\/\"\r\n },\r\n {\r\n year:2021, edition:\"Edi\u021bia a III-a\", date:\"23 iunie 2021\",\r\n title:\"Dezvoltare urban\u0103, economie, mobilitate\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Digitalizarea administra\u021biei \u0219i accesul operatorilor economici la serviciile publice.\",\r\n \"Bucure\u0219ti Smart City \u2014 solu\u021bii \u0219i oportunit\u0103\u021bi.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-2021-dezvoltare-urbana-economie-mobilitate\/\"\r\n },\r\n {\r\n year:2022, edition:\"Edi\u021bia a IV-a\", date:\"8 iunie 2022\",\r\n title:\"Dezvoltare urban\u0103, digitalizare, economie circular\u0103\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Axele prioritare de finan\u021bare din Programul Opera\u021bional Regional: digitalizare, mediu, mobilitate, regenerare.\",\r\n \"Priorit\u0103\u021bi ale administra\u021biei publice pentru digitalizarea serviciilor \u0219i aplica\u021bii smart pentru Capital\u0103.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/focus-bucuresti-ed4-2022\/\"\r\n },\r\n {\r\n year:2023, edition:\"Edi\u021bia a V-a\", date:\"13 iunie 2023\",\r\n title:\"Infrastructur\u0103 \u0219i dezvoltare urban\u0103 sustenabil\u0103\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Planificarea sustenabil\u0103 a infrastructurii urbane \u0219i oportunit\u0103\u021bile de finan\u021bare prin PNRR.\",\r\n \"Transport public verde, regenerare urban\u0103 \u0219i gestionarea durabil\u0103 a de\u0219eurilor.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-infrastructura-dezvoltare-urbana-2023\/\"\r\n },\r\n {\r\n year:2024, edition:\"Edi\u021bia a VI-a\", date:\"22 mai 2024\",\r\n title:\"Conect\u00e2nd tehnologia cu sustenabilitatea pentru un Bucure\u0219ti mai bun\",\r\n slogan:\"\",\r\n highlights:[\r\n \"Evenimentul a reunit speciali\u0219ti \u0219i oficiali pentru a dezbate integrarea tehnologiei \u00een dezvoltarea sustenabil\u0103 a ora\u0219ului.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-tehnologie-conectata-sustenabilitate-editia6-mai2024\/\"\r\n },\r\n {\r\n year:2025, edition:\"Edi\u021bia a VII-a\", date:\"21 mai 2025\",\r\n title:\"Dezvoltarea sustenabil\u0103 a Capitalei: Infrastructur\u0103, Digitalizare \u0219i Economia Circular\u0103\",\r\n slogan:\"Capitala \u00een mi\u0219care: verde, digital\u0103, circular\u0103\",\r\n highlights:[\r\n \"Au fost invita\u021bi primarii celor \u0219ase sectoare ale Capitalei, al\u0103turi de reprezentan\u021bi ai administra\u021biei centrale.\",\r\n \"Dialog despre transformarea verde, digital\u0103 \u0219i incluziv\u0103 a Bucure\u0219tiului.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-dezvoltare-sustenabila-capitala-editia7-21mai2025\/\"\r\n },\r\n {\r\n year:2026, edition:\"Edi\u021bia a VIII-a\", date:\"20 mai 2026\",\r\n title:\"Turism, Infrastructur\u0103 \u0219i Patrimoniu Istoric \u00een Capital\u0103\",\r\n slogan:\"Ora\u0219ul nostru, destina\u021bia lor\",\r\n highlights:[\r\n \"Panel I \u2014 Patrimoniu istoric, identitate urban\u0103 \u0219i finan\u021bare, cu ADRBI, Ministerul Culturii \u0219i Institutul Na\u021bional al Patrimoniului.\",\r\n \"Panel II \u2014 Infrastructur\u0103 turistic\u0103 \u0219i promovarea Capitalei, cu MEDA, ANAT, HORA \u0219i prim\u0103riile de sector.\"\r\n ],\r\n url:\"https:\/\/ccib.ro\/conferinta-focus-bucuresti-turism-infrastructura-patrimoniu-istoric-editia-a-viii-a-20-mai-2026\/\"\r\n }\r\n];\r\n\r\nconst LATEST_YEAR = Math.max(...EDITIONS.map(e=>e.year));\r\n\r\nlet currentSort = \"desc\";\r\nlet activeYear = \"all\";\r\n\r\nfunction escapeRegExp(str){ return str.replace(\/[.*+?^${}()|[\\]\\\\]\/g, '\\\\$&'); }\r\nfunction highlight(text, q){\r\n if(!q) return text;\r\n const re = new RegExp('(' + escapeRegExp(q) + ')', 'ig');\r\n return text.replace(re, '<mark>$1<\/mark>');\r\n}\r\nfunction showToast(msg){\r\n const t = document.getElementById('toast');\r\n t.textContent = msg;\r\n t.classList.add('show');\r\n clearTimeout(showToast._t);\r\n showToast._t = setTimeout(()=> t.classList.remove('show'), 2200);\r\n}\r\n\r\nfunction buildTicker(){\r\n const items = EDITIONS.slice().sort((a,b)=>b.year-a.year);\r\n const html = items.map(e=>`<span class=\"item\">\ud83c\udfa4 <b>${e.year}<\/b> \u2014 ${e.title}<\/span>`).join('');\r\n document.getElementById('ticker').innerHTML = html + html;\r\n}\r\n\r\nfunction buildChips(){\r\n const years = EDITIONS.map(e=>e.year).sort((a,b)=>b-a);\r\n const wrap = document.getElementById('yearChips');\r\n let html = `<div class=\"chip active\" data-year=\"all\">Toate edi\u021biile<\/div>`;\r\n years.forEach(y=>{ html += `<div class=\"chip\" data-year=\"${y}\">${y}<\/div>`; });\r\n wrap.innerHTML = html;\r\n wrap.querySelectorAll('.chip').forEach(chip=>{\r\n chip.addEventListener('click',()=>{\r\n wrap.querySelectorAll('.chip').forEach(x=>x.classList.remove('active'));\r\n chip.classList.add('active');\r\n activeYear = chip.dataset.year;\r\n render();\r\n });\r\n });\r\n}\r\n\r\nfunction render(){\r\n const qRaw = document.getElementById('search').value.trim();\r\n const q = qRaw.toLowerCase();\r\n\r\n let filtered = EDITIONS.filter(e=>{\r\n const matchYear = activeYear===\"all\" || String(e.year)===activeYear;\r\n const haystack = (e.title+' '+e.slogan+' '+e.highlights.join(' ')+' '+e.year).toLowerCase();\r\n const matchQ = !q || haystack.includes(q);\r\n return matchYear && matchQ;\r\n });\r\n\r\n filtered.sort((a,b)=> currentSort===\"desc\" ? b.year-a.year : a.year-b.year);\r\n\r\n const countEl = document.getElementById('resultsCount');\r\n countEl.innerHTML = filtered.length\r\n ? `<b>${filtered.length}<\/b> edi\u021bi${filtered.length===1?'e g\u0103sit\u0103':'i g\u0103site'}`\r\n : '';\r\n\r\n document.getElementById('emptyState').style.display = filtered.length ? 'none' : 'block';\r\n\r\n const tl = document.getElementById('timeline');\r\n tl.innerHTML = filtered.map((e,i)=>{\r\n const side = i%2===0 ? 'left' : 'right';\r\n const isLatest = e.year===LATEST_YEAR;\r\n return `\r\n <div class=\"tl-item ${side} ${isLatest?'latest':''}\">\r\n <div class=\"tl-dot\"><\/div>\r\n <div class=\"tl-card\">\r\n <div class=\"tl-top\">\r\n <div class=\"tl-year\">${highlight(String(e.year),qRaw)} ${isLatest?'<span class=\"nou-badge\">CEA MAI RECENT\u0102<\/span>':''}<\/div>\r\n <span class=\"tl-edition\">${e.edition}<\/span>\r\n <\/div>\r\n <div class=\"tl-date\">${e.date}<\/div>\r\n <h3>${highlight(e.title,qRaw)}<\/h3>\r\n ${e.slogan ? `<p class=\"tl-slogan\">\u201e${highlight(e.slogan,qRaw)}\u201d<\/p>` : ''}\r\n <ul class=\"tl-highlights\">\r\n ${e.highlights.map(h=>`<li>${highlight(h,qRaw)}<\/li>`).join('')}\r\n <\/ul>\r\n <div class=\"card-actions\">\r\n <a class=\"go\" href=\"${e.url}\" target=\"_blank\" rel=\"noopener\">Vezi pagina evenimentului <span class=\"arrow\">\u2192<\/span><\/a>\r\n <button class=\"copy-btn\" data-url=\"${e.url}\" title=\"Copiaz\u0103 link\">\ud83d\udd17<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>`;\r\n }).join('');\r\n}\r\n\r\nfunction attachCopyDelegate(){\r\n document.getElementById('timeline').addEventListener('click',(e)=>{\r\n const btn = e.target.closest('.copy-btn');\r\n if(!btn) return;\r\n const url = btn.dataset.url;\r\n navigator.clipboard.writeText(url).then(()=>{\r\n btn.classList.add('copied');\r\n btn.textContent = '\u2713';\r\n showToast('Link copiat \u00een clipboard');\r\n setTimeout(()=>{ btn.classList.remove('copied'); btn.textContent='\ud83d\udd17'; }, 1500);\r\n }).catch(()=> showToast('Nu s-a putut copia linkul'));\r\n });\r\n}\r\n\r\nfunction animateCount(el, target){\r\n let cur = 0;\r\n const step = Math.max(1, Math.round(target\/40));\r\n const t = setInterval(()=>{\r\n cur += step;\r\n if(cur>=target){ cur=target; clearInterval(t); }\r\n el.textContent = cur;\r\n },30);\r\n}\r\nfunction animateStats(){\r\n document.querySelectorAll('.stat .num').forEach(el=>{\r\n animateCount(el, parseInt(el.dataset.count,10));\r\n });\r\n}\r\n\r\ndocument.getElementById('search').addEventListener('input', render);\r\ndocument.getElementById('sortSelect').addEventListener('change', (e)=>{ currentSort = e.target.value; render(); });\r\n\r\n\/\/ ---------------- BOOT ----------------\r\nbuildTicker();\r\nbuildChips();\r\nrender();\r\nattachCopyDelegate();\r\nanimateCount(document.getElementById('totalLive'), EDITIONS.length);\r\n\r\nconst io = new IntersectionObserver((entries)=>{\r\n entries.forEach(entry=>{\r\n if(entry.isIntersecting){ animateStats(); io.disconnect(); }\r\n });\r\n},{threshold:0.4});\r\nio.observe(document.querySelector('.stats'));\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Arhiva FOCUS Bucure\u0219ti \u2014 CCIB \ud83c\udfdb\ufe0f Arhiva FOCUS Bucure\u0219ti Conferin\u021ba anual\u0103 a CCIB dedicat\u0103 dezvolt\u0103rii Capitalei \u2014 toate edi\u021biile, de…<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-fullwidth.php","meta":{"footnotes":""},"class_list":["post-34472","page","type-page","status-publish"],"_links":{"self":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=34472"}],"version-history":[{"count":4,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472\/revisions"}],"predecessor-version":[{"id":34476,"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=\/wp\/v2\/pages\/34472\/revisions\/34476"}],"wp:attachment":[{"href":"https:\/\/ccib.cinemaartaarad.ro\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=34472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}