<style id="elementor-post-21026">:root{--page-title-display:none;}</style>{"id":21026,"date":"2026-09-30T15:17:26","date_gmt":"2026-09-30T12:17:26","guid":{"rendered":"https:\/\/grafus.bg\/?page_id=21026"},"modified":"2026-10-06T11:53:02","modified_gmt":"2026-10-06T08:53:02","slug":"%d0%bf%d1%80%d0%be%d0%b4%d1%83%d0%ba%d1%82%d0%b8","status":"publish","type":"page","link":"https:\/\/grafus.bg\/en\/%d0%bf%d1%80%d0%be%d0%b4%d1%83%d0%ba%d1%82%d0%b8\/","title":{"rendered":"Products"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"21026\" class=\"elementor elementor-21026\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1aa7e03 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"1aa7e03\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-b155c63\" data-id=\"b155c63\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-093aed1 elementor-widget elementor-widget-html\" data-id=\"093aed1\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\r\n\/* =========================================================\r\n   GRAFUS \u2014 ALL PRODUCTS\r\n========================================================= *\/\r\n\r\n.grafus-products-page{\r\n    --green:#00c853;\r\n    --black:#080808;\r\n    --dark:#121212;\r\n    --grey:#666;\r\n    --light:#f5f6f6;\r\n    --border:#dedede;\r\n    --white:#ffffff;\r\n\r\n    font-family:Arial, Helvetica, sans-serif;\r\n    color:var(--black);\r\n    background:#fff;\r\n    overflow:hidden;\r\n}\r\n\r\n.grafus-products-page *,\r\n.grafus-products-page *::before,\r\n.grafus-products-page *::after{\r\n    box-sizing:border-box;\r\n}\r\n\r\n.gpr-container{\r\n    width:min(1380px, calc(100% - 80px));\r\n    margin:0 auto;\r\n}\r\n\r\n.gpr-kicker{\r\n    display:inline-flex;\r\n    align-items:center;\r\n    gap:12px;\r\n    margin-bottom:20px;\r\n    font-size:13px;\r\n    font-weight:800;\r\n    letter-spacing:1.5px;\r\n    text-transform:uppercase;\r\n}\r\n\r\n.gpr-kicker::before{\r\n    content:\"\";\r\n    width:38px;\r\n    height:3px;\r\n    background:var(--green);\r\n}\r\n\r\n.gpr-title{\r\n    margin:0;\r\n    font-size:clamp(48px,6vw,88px);\r\n    line-height:.95;\r\n    letter-spacing:-4px;\r\n    font-weight:800;\r\n}\r\n\r\n.gpr-section-title{\r\n    margin:0;\r\n    font-size:clamp(34px,4vw,58px);\r\n    line-height:1;\r\n    letter-spacing:-2px;\r\n    font-weight:800;\r\n}\r\n\r\n.gpr-copy{\r\n    color:#555;\r\n    font-size:18px;\r\n    line-height:1.75;\r\n}\r\n\r\n.gpr-btn{\r\n    display:inline-flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    min-height:56px;\r\n    padding:0 28px;\r\n    border:2px solid var(--black);\r\n    background:var(--black);\r\n    color:#fff !important;\r\n    text-decoration:none !important;\r\n    text-transform:uppercase;\r\n    font-size:12px;\r\n    font-weight:800;\r\n    letter-spacing:1px;\r\n    transition:.25s ease;\r\n}\r\n\r\n.gpr-btn:hover{\r\n    background:var(--green);\r\n    border-color:var(--green);\r\n    color:#000 !important;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   HERO\r\n========================================================= *\/\r\n\r\n.gpr-hero{\r\n    position:relative;\r\n    padding:140px 0 110px;\r\n    background:\r\n        linear-gradient(135deg,#fff 0%,#f4f4f4 58%,#e7f7eb 100%);\r\n}\r\n\r\n.gpr-hero::after{\r\n    content:\"\";\r\n    position:absolute;\r\n    width:700px;\r\n    height:700px;\r\n    right:-230px;\r\n    top:-300px;\r\n    border:2px solid rgba(0,200,83,.16);\r\n    border-radius:50%;\r\n}\r\n\r\n.gpr-hero-grid{\r\n    position:relative;\r\n    z-index:2;\r\n    display:grid;\r\n    grid-template-columns:1.2fr .8fr;\r\n    gap:100px;\r\n    align-items:end;\r\n}\r\n\r\n.gpr-hero .gpr-title{\r\n    margin-bottom:30px;\r\n}\r\n\r\n.gpr-hero-copy{\r\n    max-width:760px;\r\n    margin:0;\r\n    color:#444;\r\n    font-size:20px;\r\n    line-height:1.75;\r\n}\r\n\r\n.gpr-hero-side{\r\n    padding-left:45px;\r\n    border-left:1px solid #bbb;\r\n}\r\n\r\n.gpr-total{\r\n    display:block;\r\n    font-size:clamp(64px,7vw,100px);\r\n    line-height:.85;\r\n    font-weight:800;\r\n    letter-spacing:-5px;\r\n}\r\n\r\n.gpr-total span{\r\n    color:var(--green);\r\n}\r\n\r\n.gpr-total-label{\r\n    display:block;\r\n    margin-top:20px;\r\n    color:#666;\r\n    font-size:13px;\r\n    font-weight:700;\r\n    letter-spacing:1px;\r\n    text-transform:uppercase;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CATEGORY NAV\r\n========================================================= *\/\r\n\r\n.gpr-category-nav{\r\n    position:sticky;\r\n    top:0;\r\n    z-index:1000;\r\n    padding:18px 0;\r\n    background:rgba(255,255,255,.96);\r\n    border-bottom:1px solid var(--border);\r\n    backdrop-filter:blur(12px);\r\n}\r\n\r\n.gpr-category-buttons{\r\n    display:flex;\r\n    gap:9px;\r\n    overflow-x:auto;\r\n    padding-bottom:2px;\r\n    scrollbar-width:thin;\r\n}\r\n\r\n.gpr-category-button{\r\n    flex:0 0 auto;\r\n    min-height:42px;\r\n    padding:0 18px;\r\n    border:1px solid #ccc;\r\n    background:#fff;\r\n    color:#111;\r\n    font:inherit;\r\n    font-size:12px;\r\n    font-weight:800;\r\n    cursor:pointer;\r\n    transition:.2s ease;\r\n}\r\n\r\n.gpr-category-button:hover,\r\n.gpr-category-button.active{\r\n    background:var(--green);\r\n    border-color:var(--green);\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   PRODUCTS\r\n========================================================= *\/\r\n\r\n.gpr-products-wrapper{\r\n    padding:90px 0 125px;\r\n}\r\n\r\n.gpr-category-section{\r\n    scroll-margin-top:105px;\r\n    padding:35px 0 100px;\r\n    border-bottom:1px solid var(--border);\r\n}\r\n\r\n.gpr-category-section:last-child{\r\n    border-bottom:none;\r\n}\r\n\r\n.gpr-category-head{\r\n    display:grid;\r\n    grid-template-columns:1fr auto;\r\n    gap:40px;\r\n    align-items:end;\r\n    margin-bottom:45px;\r\n}\r\n\r\n.gpr-category-meta{\r\n    display:flex;\r\n    align-items:center;\r\n    gap:15px;\r\n    margin-bottom:15px;\r\n    color:#777;\r\n    font-size:12px;\r\n    font-weight:800;\r\n    text-transform:uppercase;\r\n    letter-spacing:1.2px;\r\n}\r\n\r\n.gpr-category-meta::before{\r\n    content:\"\";\r\n    width:38px;\r\n    height:3px;\r\n    background:var(--green);\r\n}\r\n\r\n.gpr-category-count{\r\n    color:#888;\r\n    font-size:14px;\r\n    font-weight:700;\r\n}\r\n\r\n.gpr-grid{\r\n    display:grid;\r\n    grid-template-columns:repeat(4,1fr);\r\n    gap:18px;\r\n}\r\n\r\n.gpr-product{\r\n    position:relative;\r\n    overflow:hidden;\r\n    background:#fff;\r\n    border:1px solid var(--border);\r\n    cursor:pointer;\r\n    transition:\r\n        transform .25s ease,\r\n        box-shadow .25s ease,\r\n        border-color .25s ease;\r\n}\r\n\r\n.gpr-product:hover{\r\n    transform:translateY(-4px);\r\n    border-color:#aaa;\r\n    box-shadow:0 18px 45px rgba(0,0,0,.08);\r\n}\r\n\r\n.gpr-product-image{\r\n    position:relative;\r\n    height:360px;\r\n    overflow:hidden;\r\n    background:var(--light);\r\n}\r\n\r\n.gpr-product-image img{\r\n    display:block;\r\n    width:100%;\r\n    height:100%;\r\n    padding:20px;\r\n    object-fit:contain;\r\n    transition:transform .35s ease;\r\n}\r\n\r\n.gpr-product:hover .gpr-product-image img{\r\n    transform:scale(1.035);\r\n}\r\n\r\n.gpr-hover{\r\n    position:absolute;\r\n    inset:0;\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    background:rgba(0,0,0,0);\r\n    transition:.25s ease;\r\n}\r\n\r\n.gpr-hover span{\r\n    padding:13px 18px;\r\n    background:var(--green);\r\n    color:#000;\r\n    opacity:0;\r\n    transform:translateY(8px);\r\n    font-size:11px;\r\n    font-weight:800;\r\n    letter-spacing:1px;\r\n    text-transform:uppercase;\r\n    transition:.25s ease;\r\n}\r\n\r\n.gpr-product:hover .gpr-hover{\r\n    background:rgba(0,0,0,.06);\r\n}\r\n\r\n.gpr-product:hover .gpr-hover span{\r\n    opacity:1;\r\n    transform:translateY(0);\r\n}\r\n\r\n.gpr-product-bottom{\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:space-between;\r\n    gap:15px;\r\n    padding:20px 21px;\r\n    border-top:1px solid var(--border);\r\n}\r\n\r\n.gpr-product-code{\r\n    font-size:14px;\r\n    font-weight:800;\r\n    letter-spacing:.3px;\r\n}\r\n\r\n.gpr-product-arrow{\r\n    color:var(--green);\r\n    font-size:20px;\r\n    font-weight:800;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   CTA\r\n========================================================= *\/\r\n\r\n.gpr-cta{\r\n    padding:85px 0;\r\n    background:var(--green);\r\n}\r\n\r\n.gpr-cta-grid{\r\n    display:grid;\r\n    grid-template-columns:1fr auto;\r\n    gap:70px;\r\n    align-items:center;\r\n}\r\n\r\n.gpr-cta h2{\r\n    margin:0 0 14px;\r\n    font-size:clamp(34px,4vw,54px);\r\n    line-height:1;\r\n    letter-spacing:-2px;\r\n}\r\n\r\n.gpr-cta p{\r\n    max-width:800px;\r\n    margin:0;\r\n    font-size:18px;\r\n    line-height:1.7;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   MODAL\r\n========================================================= *\/\r\n\r\n.gpr-modal{\r\n    display:none;\r\n    position:fixed;\r\n    inset:0;\r\n    z-index:999999;\r\n    padding:35px;\r\n    overflow-y:auto;\r\n    background:rgba(0,0,0,.84);\r\n}\r\n\r\n.gpr-modal.open{\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n}\r\n\r\n.gpr-modal-box{\r\n    position:relative;\r\n    display:grid;\r\n    grid-template-columns:1.25fr .75fr;\r\n    width:min(1080px,100%);\r\n    min-height:620px;\r\n    overflow:hidden;\r\n    background:#fff;\r\n    animation:gprModalIn .2s ease;\r\n}\r\n\r\n@keyframes gprModalIn{\r\n    from{\r\n        opacity:0;\r\n        transform:translateY(18px);\r\n    }\r\n    to{\r\n        opacity:1;\r\n        transform:translateY(0);\r\n    }\r\n}\r\n\r\n.gpr-modal-close{\r\n    position:absolute;\r\n    z-index:5;\r\n    top:18px;\r\n    right:18px;\r\n    width:46px;\r\n    height:46px;\r\n    border:0;\r\n    background:#fff;\r\n    color:#000;\r\n    box-shadow:0 4px 18px rgba(0,0,0,.13);\r\n    font-size:27px;\r\n    cursor:pointer;\r\n}\r\n\r\n.gpr-modal-close:hover{\r\n    background:var(--green);\r\n}\r\n\r\n.gpr-modal-image{\r\n    min-height:620px;\r\n    display:flex;\r\n    align-items:center;\r\n    justify-content:center;\r\n    background:#f5f6f6;\r\n}\r\n\r\n.gpr-modal-image img{\r\n    display:block;\r\n    width:100%;\r\n    height:620px;\r\n    padding:35px;\r\n    object-fit:contain;\r\n}\r\n\r\n.gpr-modal-content{\r\n    display:flex;\r\n    flex-direction:column;\r\n    padding:75px 45px 45px;\r\n}\r\n\r\n.gpr-modal-category{\r\n    margin-bottom:16px;\r\n    color:var(--green);\r\n    font-size:11px;\r\n    font-weight:800;\r\n    text-transform:uppercase;\r\n    letter-spacing:1.3px;\r\n}\r\n\r\n.gpr-modal-code{\r\n    margin:0 0 22px;\r\n    font-size:38px;\r\n    line-height:1;\r\n    letter-spacing:-1.5px;\r\n}\r\n\r\n.gpr-modal-text{\r\n    margin:0;\r\n    color:#666;\r\n    font-size:16px;\r\n    line-height:1.7;\r\n}\r\n\r\n.gpr-modal-spacer{\r\n    flex:1;\r\n}\r\n\r\n.gpr-modal-note{\r\n    margin-top:28px;\r\n    padding-top:28px;\r\n    border-top:1px solid var(--border);\r\n    color:#888;\r\n    font-size:12px;\r\n    line-height:1.6;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   FOOTER\r\n========================================================= *\/\r\n\r\n.grafus-footer{\r\n    padding:80px 0 25px;\r\n    background:#080808;\r\n    color:#fff;\r\n}\r\n\r\n.grafus-footer-container{\r\n    width:min(1380px, calc(100% - 80px));\r\n    margin:0 auto;\r\n}\r\n\r\n.grafus-footer-grid{\r\n    display:grid;\r\n    grid-template-columns:1.2fr .7fr .9fr;\r\n    gap:90px;\r\n}\r\n\r\n.grafus-footer-logo{\r\n    width:230px;\r\n    max-width:100%;\r\n    margin-bottom:25px;\r\n    padding:12px;\r\n    background:#fff;\r\n}\r\n\r\n.grafus-footer-text{\r\n    max-width:420px;\r\n    color:#999;\r\n    line-height:1.7;\r\n}\r\n\r\n.grafus-footer-title{\r\n    margin-bottom:24px;\r\n    color:#888;\r\n    font-size:12px;\r\n    font-weight:800;\r\n    text-transform:uppercase;\r\n    letter-spacing:1.2px;\r\n}\r\n\r\n.grafus-footer-links{\r\n    display:flex;\r\n    flex-direction:column;\r\n    gap:13px;\r\n}\r\n\r\n.grafus-footer-links a{\r\n    color:#fff !important;\r\n    text-decoration:none !important;\r\n}\r\n\r\n.grafus-footer-links a:hover{\r\n    color:#00c853 !important;\r\n}\r\n\r\n.grafus-footer-soon{\r\n    color:#777;\r\n}\r\n\r\n.grafus-footer-bottom{\r\n    display:flex;\r\n    justify-content:space-between;\r\n    gap:20px;\r\n    margin-top:60px;\r\n    padding-top:23px;\r\n    border-top:1px solid #292929;\r\n    color:#777;\r\n    font-size:12px;\r\n}\r\n\r\n\r\n\/* =========================================================\r\n   RESPONSIVE\r\n========================================================= *\/\r\n\r\n@media(max-width:1200px){\r\n\r\n    .gpr-grid{\r\n        grid-template-columns:repeat(3,1fr);\r\n    }\r\n}\r\n\r\n@media(max-width:1000px){\r\n\r\n    .gpr-container,\r\n    .grafus-footer-container{\r\n        width:min(100% - 50px,1380px);\r\n    }\r\n\r\n    .gpr-grid{\r\n        grid-template-columns:repeat(2,1fr);\r\n    }\r\n}\r\n\r\n@media(max-width:767px){\r\n\r\n    .gpr-container,\r\n    .grafus-footer-container{\r\n        width:calc(100% - 36px);\r\n    }\r\n\r\n    .gpr-title{\r\n        letter-spacing:-2px;\r\n    }\r\n\r\n    .gpr-hero{\r\n        padding:80px 0 70px;\r\n    }\r\n\r\n    .gpr-hero-grid,\r\n    .gpr-category-head,\r\n    .gpr-cta-grid,\r\n    .grafus-footer-grid{\r\n        grid-template-columns:1fr;\r\n        gap:40px;\r\n    }\r\n\r\n    .gpr-hero-side{\r\n        padding-left:0;\r\n        padding-top:30px;\r\n        border-left:0;\r\n        border-top:1px solid #bbb;\r\n    }\r\n\r\n    .gpr-category-nav{\r\n        top:0;\r\n    }\r\n\r\n    .gpr-products-wrapper{\r\n        padding:55px 0 80px;\r\n    }\r\n\r\n    .gpr-category-section{\r\n        padding:25px 0 70px;\r\n    }\r\n\r\n    .gpr-category-count{\r\n        text-align:left;\r\n    }\r\n\r\n    .gpr-grid{\r\n        grid-template-columns:1fr;\r\n    }\r\n\r\n    .gpr-product-image{\r\n        height:390px;\r\n    }\r\n\r\n    .gpr-modal{\r\n        padding:12px;\r\n        align-items:flex-start !important;\r\n    }\r\n\r\n    .gpr-modal-box{\r\n        grid-template-columns:1fr;\r\n        margin:20px 0;\r\n    }\r\n\r\n    .gpr-modal-image{\r\n        min-height:400px;\r\n    }\r\n\r\n    .gpr-modal-image img{\r\n        height:400px;\r\n        padding:25px;\r\n    }\r\n\r\n    .gpr-modal-content{\r\n        padding:35px 25px;\r\n    }\r\n\r\n    .gpr-modal-code{\r\n        font-size:30px;\r\n    }\r\n\r\n    .gpr-modal .gpr-btn,\r\n    .gpr-cta .gpr-btn{\r\n        width:100%;\r\n    }\r\n\r\n    .grafus-footer-bottom{\r\n        flex-direction:column;\r\n    }\r\n}\r\n<\/style>\r\n\r\n\r\n<div class=\"grafus-products-page\">\r\n\r\n<!-- HERO -->\r\n\r\n<section class=\"gpr-hero\">\r\n\r\n    <div class=\"gpr-container gpr-hero-grid\">\r\n\r\n        <div>\r\n\r\n            <div class=\"gpr-kicker\">\r\n                \u041f\u0440\u043e\u0434\u0443\u043a\u0442\u0438\r\n            <\/div>\r\n\r\n            <h1 class=\"gpr-title\">\r\n                \u041e\u043f\u0430\u043a\u043e\u0432\u043a\u0438 \u0437\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.\r\n            <\/h1>\r\n\r\n            <p class=\"gpr-hero-copy\">\r\n                \u0420\u0430\u0437\u0433\u043b\u0435\u0434\u0430\u0439\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\u043e\u0442\u043e \u043f\u043e\u0440\u0442\u0444\u043e\u043b\u0438\u043e \u043d\u0430 Grafus.\r\n                \u0418\u0437\u0431\u0435\u0440\u0435\u0442\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f \u0438 \u043d\u0430\u0442\u0438\u0441\u043d\u0435\u0442\u0435 \u0432\u044a\u0440\u0445\u0443 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u0435\u043d \u043c\u043e\u0434\u0435\u043b,\r\n                \u0437\u0430 \u0434\u0430 \u0433\u043e \u0440\u0430\u0437\u0433\u043b\u0435\u0434\u0430\u0442\u0435 \u0432 \u043f\u043e-\u0433\u043e\u043b\u044f\u043c \u0440\u0430\u0437\u043c\u0435\u0440.\r\n            <\/p>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"gpr-hero-side\">\r\n\r\n            <span class=\"gpr-total\" id=\"gprTotal\">\r\n                0<span>+<\/span>\r\n            <\/span>\r\n\r\n            <span class=\"gpr-total-label\">\r\n                \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u0432 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430\r\n            <\/span>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- CATEGORY NAV -->\r\n\r\n<nav class=\"gpr-category-nav\">\r\n\r\n    <div class=\"gpr-container\">\r\n\r\n        <div\r\n            class=\"gpr-category-buttons\"\r\n            id=\"gprCategoryButtons\">\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/nav>\r\n\r\n\r\n<!-- PRODUCTS GENERATED WITH JAVASCRIPT -->\r\n\r\n<main class=\"gpr-products-wrapper\">\r\n\r\n    <div\r\n        class=\"gpr-container\"\r\n        id=\"gprProducts\">\r\n    <\/div>\r\n\r\n<\/main>\r\n\r\n\r\n<!-- CTA -->\r\n\r\n<section class=\"gpr-cta\">\r\n\r\n    <div class=\"gpr-container gpr-cta-grid\">\r\n\r\n        <div>\r\n\r\n            <h2>\r\n                \u041d\u0435 \u043e\u0442\u043a\u0440\u0438\u0432\u0430\u0442\u0435 \u0442\u043e\u0447\u043d\u0438\u044f \u043c\u043e\u0434\u0435\u043b?\r\n            <\/h2>\r\n\r\n            <p>\r\n                \u0421\u0432\u044a\u0440\u0436\u0435\u0442\u0435 \u0441\u0435 \u0441 \u0435\u043a\u0438\u043f\u0430 \u043d\u0430 Grafus \u0438 \u043d\u0438 \u0438\u0437\u043f\u0440\u0430\u0442\u0435\u0442\u0435\r\n                \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0437\u0430 \u0442\u0438\u043f\u0430 \u043e\u043f\u0430\u043a\u043e\u0432\u043a\u0430, \u043a\u043e\u044f\u0442\u043e \u0442\u044a\u0440\u0441\u0438\u0442\u0435.\r\n            <\/p>\r\n\r\n        <\/div>\r\n\r\n        <div>\r\n\r\n            <a\r\n                href=\"https:\/\/grafus.bg\/%d0%ba%d0%be%d0%bd%d1%82%d0%b0%d0%ba%d1%82%d0%b8\/\"\r\n                class=\"gpr-btn\">\r\n                \u0418\u0437\u043f\u0440\u0430\u0442\u0438 \u0437\u0430\u043f\u0438\u0442\u0432\u0430\u043d\u0435 \u2192\r\n            <\/a>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/section>\r\n\r\n\r\n<!-- FOOTER -->\r\n\r\n<footer class=\"grafus-footer\">\r\n\r\n    <div class=\"grafus-footer-container\">\r\n\r\n        <div class=\"grafus-footer-grid\">\r\n\r\n            <div>\r\n\r\n                <img decoding=\"async\"\r\n                    class=\"grafus-footer-logo\"\r\n                    src=\"https:\/\/grafus.bg\/wp-content\/uploads\/2026\/09\/grafus.jpg\"\r\n                    alt=\"Grafus\">\r\n\r\n                <p class=\"grafus-footer-text\">\r\n                    \u0411\u044a\u043b\u0433\u0430\u0440\u0441\u043a\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b \u043d\u0430 \u043f\u043b\u0430\u0441\u0442\u043c\u0430\u0441\u043e\u0432\u0438 \u0431\u0443\u0442\u0438\u043b\u043a\u0438,\r\n                    \u0444\u043b\u0430\u043a\u043e\u043d\u0438, \u0431\u0443\u0440\u043a\u0430\u043d\u0438 \u0438 \u043a\u0430\u043f\u0430\u0447\u043a\u0438 \u043e\u0442 1990 \u0433.\r\n                <\/p>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div>\r\n\r\n                <div class=\"grafus-footer-title\">\r\n                    \u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f\r\n                <\/div>\r\n\r\n                <div class=\"grafus-footer-links\">\r\n\r\n                    <a href=\"https:\/\/grafus.bg\/\">\r\n                        \u041d\u0430\u0447\u0430\u043b\u043e\r\n                    <\/a>\r\n\r\n                    <a href=\"https:\/\/grafus.bg\/%d0%bf%d1%80%d0%be%d0%b4%d1%83%d0%ba%d1%82%d0%b8\/\">\r\n                        \u041f\u0440\u043e\u0434\u0443\u043a\u0442\u0438\r\n                    <\/a>\r\n\r\n                    <a href=\"https:\/\/grafus.bg\/%d0%bf%d1%80%d0%be%d0%b8%d0%b7%d0%b2%d0%be%d0%b4%d1%81%d1%82%d0%b2%d0%be\/\">\r\n                        \u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0441\u0442\u0432\u043e\r\n                    <\/a>\r\n\r\n                    <a href=\"https:\/\/grafus.bg\/%d0%b7%d0%b0-%d0%bd%d0%b0%d1%81\/\">\r\n                        \u0417\u0430 \u043d\u0430\u0441\r\n                    <\/a>\r\n\r\n                    <a href=\"https:\/\/grafus.bg\/%d0%ba%d0%be%d0%bd%d1%82%d0%b0%d0%ba%d1%82%d0%b8\/\">\r\n                        \u041a\u043e\u043d\u0442\u0430\u043a\u0442\u0438\r\n                    <\/a>\r\n\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n\r\n            <div>\r\n\r\n                <div class=\"grafus-footer-title\">\r\n                    \u041f\u043e\u0441\u043b\u0435\u0434\u0432\u0430\u0439\u0442\u0435 Grafus\r\n                <\/div>\r\n\r\n                <div class=\"grafus-footer-links\">\r\n\r\n                    <a\r\n                        href=\"https:\/\/www.facebook.com\/grafus.shumen?locale=bg_BG\"\r\n                        target=\"_blank\"\r\n                        rel=\"noopener\">\r\n                        Facebook \u2197\r\n                    <\/a>\r\n\r\n                    <a href=\"mailto:grafus@abv.bg\">\r\n                        grafus@abv.bg\r\n                    <\/a>\r\n\r\n                    <a href=\"tel:+359899118282\">\r\n                        +359 899 118 282\r\n                    <\/a>\r\n\r\n                    <a href=\"tel:+35954800522\">\r\n                        +359 54 800 522\r\n                    <\/a>\r\n\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"grafus-footer-bottom\">\r\n\r\n            <div>\r\n                \u00a9 2026 Grafus OOD. \u0412\u0441\u0438\u0447\u043a\u0438 \u043f\u0440\u0430\u0432\u0430 \u0437\u0430\u043f\u0430\u0437\u0435\u043d\u0438.\r\n            <\/div>\r\n\r\n            <div>\r\n                \u0428\u0443\u043c\u0435\u043d, \u0411\u044a\u043b\u0433\u0430\u0440\u0438\u044f\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/footer>\r\n\r\n\r\n<!-- PRODUCT POPUP -->\r\n\r\n<div\r\n    class=\"gpr-modal\"\r\n    id=\"gprModal\">\r\n\r\n    <div class=\"gpr-modal-box\">\r\n\r\n        <button\r\n            class=\"gpr-modal-close\"\r\n            id=\"gprModalClose\"\r\n            aria-label=\"\u0417\u0430\u0442\u0432\u043e\u0440\u0438\">\r\n            \u00d7\r\n        <\/button>\r\n\r\n\r\n        <div class=\"gpr-modal-image\">\r\n\r\n            <img decoding=\"async\"\r\n                id=\"gprModalImage\"\r\n                src=\"\"\r\n                alt=\"Grafus \u043f\u0440\u043e\u0434\u0443\u043a\u0442\">\r\n\r\n        <\/div>\r\n\r\n\r\n        <div class=\"gpr-modal-content\">\r\n\r\n            <div\r\n                class=\"gpr-modal-category\"\r\n                id=\"gprModalCategory\">\r\n            <\/div>\r\n\r\n            <h2\r\n                class=\"gpr-modal-code\"\r\n                id=\"gprModalCode\">\r\n            <\/h2>\r\n\r\n            <p class=\"gpr-modal-text\">\r\n                \u0417\u0430 \u043f\u043e\u0432\u0435\u0447\u0435 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e\u0442\u043d\u043e\u0441\u043d\u043e \u0442\u043e\u0437\u0438 \u043c\u043e\u0434\u0435\u043b\r\n                \u0438\u0437\u043f\u0440\u0430\u0442\u0435\u0442\u0435 \u0437\u0430\u043f\u0438\u0442\u0432\u0430\u043d\u0435 \u043a\u044a\u043c \u0435\u043a\u0438\u043f\u0430 \u043d\u0430 Grafus\r\n                \u0438 \u043f\u043e\u0441\u043e\u0447\u0435\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\u0438\u044f \u043a\u043e\u0434.\r\n            <\/p>\r\n\r\n            <div class=\"gpr-modal-spacer\"><\/div>\r\n\r\n            <a\r\n                href=\"https:\/\/grafus.bg\/%d0%ba%d0%be%d0%bd%d1%82%d0%b0%d0%ba%d1%82%d0%b8\/\"\r\n                id=\"gprModalContact\"\r\n                class=\"gpr-btn\">\r\n                \u0417\u0430\u043f\u0438\u0442\u0432\u0430\u043d\u0435 \u0437\u0430 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u2192\r\n            <\/a>\r\n\r\n            <div class=\"gpr-modal-note\">\r\n                \u0418\u0437\u043f\u043e\u043b\u0437\u0432\u0430\u0439\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\u0438\u044f \u043a\u043e\u0434 \u043f\u0440\u0438 \u0437\u0430\u043f\u0438\u0442\u0432\u0430\u043d\u0435\u0442\u043e,\r\n                \u0437\u0430 \u0434\u0430 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u0446\u0438\u0440\u0430\u043c\u0435 \u0442\u043e\u0447\u043d\u0438\u044f \u043f\u0440\u043e\u0434\u0443\u043a\u0442.\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<script>\r\n(function(){\r\n\r\nconst BASE = \"https:\/\/grafus.bg\/wp-content\/uploads\/2026\/10\/\";\r\n\r\nconst categories = [\r\n\r\n\/* =========================================================\r\n   \u0411\u0423\u0420\u041a\u0410\u041d\u0418\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"jars\",\r\n    name:\"\u0411\u0443\u0440\u043a\u0430\u043d\u0438\",\r\n    prefix:\"GRA-J\",\r\n    images:[\r\n        \"IMG_0067-scaled.jpg\",\r\n        \"IMG_0071-scaled.jpg\",\r\n        \"IMG_0081-scaled.jpg\",\r\n        \"IMG_0084-scaled.jpg\",\r\n        \"IMG_0090-scaled.jpg\",\r\n        \"IMG_0094.jpg\",\r\n        \"IMG_0098-scaled.jpg\",\r\n        \"IMG_0203-scaled.jpg\",\r\n        \"IMG_0206-scaled.jpg\",\r\n        \"IMG_0350-scaled.jpg\",\r\n        \"IMG_0361-scaled.jpg\",\r\n        \"IMG_0412.jpeg\",\r\n        \"IMG_0414.jpeg\",\r\n        \"IMG_0417.jpeg\",\r\n        \"IMG_0418.jpeg\",\r\n        \"IMG_0422.jpeg\",\r\n        \"IMG_0425.jpeg\",\r\n        \"IMG_0427.jpeg\",\r\n        \"IMG_0428.jpeg\",\r\n        \"IMG_0429.jpeg\",\r\n        \"IMG_0430.jpeg\",\r\n        \"IMG_9956-scaled.jpg\",\r\n        \"IMG_9970-scaled.jpg\",\r\n        \"IMG_9983-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0411\u0423\u0422\u0418\u041b\u041a\u0418 \u0417\u0410 \u0412\u041e\u0414\u0410\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"water\",\r\n    name:\"\u0411\u0443\u0442\u0438\u043b\u043a\u0438 \u0437\u0430 \u0432\u043e\u0434\u0430\",\r\n    prefix:\"GRA-W\",\r\n    images:[\r\n        \"IMG_0268-scaled.jpg\",\r\n        \"IMG_0276-scaled.jpg\",\r\n        \"IMG_0483.jpeg\",\r\n        \"IMG_0484.jpeg\",\r\n        \"IMG_0620.jpeg\",\r\n        \"IMG_0624.jpeg\",\r\n        \"IMG_0626.jpeg\",\r\n        \"IMG_9903-scaled.jpg\",\r\n        \"IMG_9927-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0411\u0415\u0417\u0410\u041b\u041a\u041e\u0425\u041e\u041b\u041d\u0418 \u041d\u0410\u041f\u0418\u0422\u041a\u0418\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"soft-drinks\",\r\n    name:\"\u0411\u0443\u0442\u0438\u043b\u043a\u0438 \u0437\u0430 \u0431\u0435\u0437\u0430\u043b\u043a\u043e\u0445\u043e\u043b\u043d\u0438 \u043d\u0430\u043f\u0438\u0442\u043a\u0438\",\r\n    prefix:\"GRA-SD\",\r\n    images:[\r\n        \"IMG_0305-scaled.jpg\",\r\n        \"IMG_0302-scaled.jpg\",\r\n        \"IMG_0253-scaled.jpg\",\r\n        \"IMG_0245-scaled.jpg\",\r\n        \"IMG_0219-scaled.jpg\",\r\n        \"IMG_0196-scaled.jpg\",\r\n        \"IMG_0194-scaled.jpg\",\r\n        \"IMG_0179-scaled.jpg\",\r\n        \"IMG_0125-scaled.jpg\",\r\n        \"IMG_0088-scaled.jpg\",\r\n        \"IMG_0065-scaled.jpg\",\r\n        \"IMG_0061-scaled.jpg\",\r\n        \"IMG_0040-scaled.jpg\",\r\n        \"IMG_0035-scaled.jpg\",\r\n        \"IMG_0310-scaled.jpg\",\r\n        \"IMG_0313-scaled.jpg\",\r\n        \"IMG_0315-scaled.jpg\",\r\n        \"IMG_0354-scaled.jpg\",\r\n        \"IMG_0355-scaled.jpg\",\r\n        \"IMG_0359-scaled.jpg\",\r\n        \"IMG_0372-scaled.jpg\",\r\n        \"IMG_0374-scaled.jpg\",\r\n        \"IMG_0376-scaled.jpg\",\r\n        \"IMG_0397-scaled.jpg\",\r\n        \"IMG_0400-scaled.jpg\",\r\n        \"IMG_0421-scaled.jpg\",\r\n        \"IMG_0425-scaled.jpg\",\r\n        \"IMG_0427-scaled.jpg\",\r\n        \"IMG_0447-scaled.jpg\",\r\n        \"IMG_0451-scaled.jpg\",\r\n        \"IMG_0460-scaled.jpg\",\r\n        \"IMG_0462-scaled.jpg\",\r\n        \"IMG_0466-scaled.jpg\",\r\n        \"IMG_0468-scaled.jpg\",\r\n        \"IMG_0470-scaled.jpg\",\r\n        \"IMG_0477-scaled.jpg\",\r\n        \"IMG_0481.jpeg\",\r\n        \"IMG_0531-scaled.jpg\",\r\n        \"IMG_0532-scaled.jpg\",\r\n        \"IMG_0766.jpeg\",\r\n        \"IMG_0767.jpeg\",\r\n        \"IMG_9890-scaled.jpg\",\r\n        \"IMG_9896-scaled.jpg\",\r\n        \"IMG_9919-scaled.jpg\",\r\n        \"IMG_9941-scaled.jpg\",\r\n        \"IMG_9943-scaled.jpg\",\r\n        \"IMG_9948-scaled.jpg\",\r\n        \"IMG_9961-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0411\u0418\u0420\u0410 \u0418 \u0412\u0418\u041d\u041e\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"beer-wine\",\r\n    name:\"\u0411\u0443\u0442\u0438\u043b\u043a\u0438 \u0437\u0430 \u0431\u0438\u0440\u0430 \u0438 \u0432\u0438\u043d\u043e\",\r\n    prefix:\"GRA-BW\",\r\n    images:[\r\n        \"IMG_0016-scaled.jpg\",\r\n        \"IMG_0020-scaled.jpg\",\r\n        \"IMG_0030-scaled.jpg\",\r\n        \"IMG_0040-1-scaled.jpg\",\r\n        \"IMG_0044-scaled.jpg\",\r\n        \"IMG_0046-scaled.jpg\",\r\n        \"IMG_0049-scaled.jpg\",\r\n        \"IMG_0059-scaled.jpg\",\r\n        \"IMG_0112-scaled.jpg\",\r\n        \"IMG_0128-scaled.jpg\",\r\n        \"IMG_0255-scaled.jpg\",\r\n        \"IMG_0266-scaled.jpg\",\r\n        \"IMG_0274-scaled.jpg\",\r\n        \"IMG_0371-scaled.jpg\",\r\n        \"IMG_0389-scaled.jpg\",\r\n        \"IMG_0396-scaled.jpg\",\r\n        \"IMG_0453-scaled.jpg\",\r\n        \"IMG_0458-scaled.jpg\",\r\n        \"IMG_0475-scaled.jpg\",\r\n        \"IMG_0481-scaled.jpg\",\r\n        \"IMG_0491-scaled.jpg\",\r\n        \"IMG_0510-scaled.jpg\",\r\n        \"IMG_0522-scaled.jpg\",\r\n        \"IMG_0532-1-scaled.jpg\",\r\n        \"IMG_0627.jpeg\",\r\n        \"IMG_9890-1-scaled.jpg\",\r\n        \"IMG_9914-scaled.jpg\",\r\n        \"IMG_9935-scaled.jpg\",\r\n        \"IMG_9939-scaled.jpg\",\r\n        \"IMG_9998-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0411\u0418\u0422\u041e\u0412\u0410 \u0425\u0418\u041c\u0418\u042f, \u0414\u0415\u0417\u0418\u041d\u0424\u0415\u041a\u0426\u0418\u042f \u0418 \u041a\u041e\u0417\u041c\u0415\u0422\u0418\u041a\u0410\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"chemistry\",\r\n    name:\"\u0411\u0438\u0442\u043e\u0432\u0430 \u0445\u0438\u043c\u0438\u044f, \u0434\u0435\u0437\u0438\u043d\u0444\u0435\u043a\u0446\u0438\u044f \u0438 \u043a\u043e\u0437\u043c\u0435\u0442\u0438\u043a\u0430\",\r\n    prefix:\"GRA-CH\",\r\n    images:[\r\n        \"IMG_0022-scaled.jpg\",\r\n        \"IMG_0052-scaled.jpg\",\r\n        \"IMG_0056-scaled.jpg\",\r\n        \"IMG_0086-scaled.jpg\",\r\n        \"IMG_0176-scaled.jpg\",\r\n        \"IMG_0177-scaled.jpg\",\r\n        \"IMG_0180-scaled.jpg\",\r\n        \"IMG_0181-scaled.jpg\",\r\n        \"IMG_0185-scaled.jpg\",\r\n        \"IMG_0221-scaled.jpg\",\r\n        \"IMG_0222-scaled.jpg\",\r\n        \"IMG_0226-scaled.jpg\",\r\n        \"IMG_0228-scaled.jpg\",\r\n        \"IMG_0230-scaled.jpg\",\r\n        \"IMG_0233-scaled.jpg\",\r\n        \"IMG_0235-scaled.jpg\",\r\n        \"IMG_0237-scaled.jpg\",\r\n        \"IMG_0250-scaled.jpg\",\r\n        \"IMG_0279-scaled.jpg\",\r\n        \"IMG_0286-scaled.jpg\",\r\n        \"IMG_0287-scaled.jpg\",\r\n        \"IMG_0299-scaled.jpg\",\r\n        \"IMG_0308-scaled.jpg\",\r\n        \"IMG_0318-scaled.jpg\",\r\n        \"IMG_0323-scaled.jpg\",\r\n        \"IMG_0327-scaled.jpg\",\r\n        \"IMG_0335-scaled.jpg\",\r\n        \"IMG_0346-scaled.jpg\",\r\n        \"IMG_0366.jpeg\",\r\n        \"IMG_0370.jpeg\",\r\n        \"IMG_0371.jpeg\",\r\n        \"IMG_0372.jpeg\",\r\n        \"IMG_0373.jpeg\",\r\n        \"IMG_0374.jpeg\",\r\n        \"IMG_0375.jpeg\",\r\n        \"IMG_0376.jpeg\",\r\n        \"IMG_0377.jpeg\",\r\n        \"IMG_0378.jpeg\",\r\n        \"IMG_0379.jpeg\",\r\n        \"IMG_0380.jpeg\",\r\n        \"IMG_0381.jpeg\",\r\n        \"IMG_0382.jpeg\",\r\n        \"IMG_0383.jpeg\",\r\n        \"IMG_0384.jpeg\",\r\n        \"IMG_0385.jpeg\",\r\n        \"IMG_0386.jpeg\",\r\n        \"IMG_0387.jpeg\",\r\n        \"IMG_0388.jpeg\",\r\n        \"IMG_0389.jpeg\",\r\n        \"IMG_0390.jpeg\",\r\n        \"IMG_0391.jpeg\",\r\n        \"IMG_0392.jpeg\",\r\n        \"IMG_0393.jpeg\",\r\n        \"IMG_0394.jpeg\",\r\n        \"IMG_0395.jpeg\",\r\n        \"IMG_0396.jpeg\",\r\n        \"IMG_0397.jpeg\",\r\n        \"IMG_0398.jpeg\",\r\n        \"IMG_0400.jpeg\",\r\n        \"IMG_0401.jpeg\",\r\n        \"IMG_0402.jpeg\",\r\n        \"IMG_0403.jpeg\",\r\n        \"IMG_0404.jpeg\",\r\n        \"IMG_0405.jpeg\",\r\n        \"IMG_0406.jpeg\",\r\n        \"IMG_0407.jpeg\",\r\n        \"IMG_0408.jpeg\",\r\n        \"IMG_0409.jpeg\",\r\n        \"IMG_0430-scaled.jpg\",\r\n        \"IMG_0432-scaled.jpg\",\r\n        \"IMG_0478.jpeg\",\r\n        \"IMG_0480.jpeg\",\r\n        \"IMG_0485.jpeg\",\r\n        \"IMG_0489-scaled.jpg\",\r\n        \"IMG_0506-scaled.jpg\",\r\n        \"IMG_0513-scaled.jpg\",\r\n        \"IMG_0613.jpeg\",\r\n        \"IMG_0614.jpeg\",\r\n        \"IMG_0615.jpeg\",\r\n        \"IMG_0690.jpeg\",\r\n        \"IMG_0701.jpeg\",\r\n        \"IMG_0731.jpeg\",\r\n        \"IMG_9883-scaled.jpg\",\r\n        \"IMG_9894-scaled.jpg\",\r\n        \"IMG_9945-scaled.jpg\",\r\n        \"IMG_9958-scaled.jpg\",\r\n        \"IMG_9965-scaled.jpg\",\r\n        \"IMG_9968-scaled.jpg\",\r\n        \"IMG_9974-scaled.jpg\",\r\n        \"IMG_9975-scaled.jpg\",\r\n        \"IMG_9979-scaled.jpg\",\r\n        \"IMG_9982-scaled.jpg\",\r\n        \"IMG_9985-scaled.jpg\",\r\n        \"IMG_9992-scaled.jpg\",\r\n        \"IMG_9995-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u041e\u041b\u0418\u041e, \u041e\u0426\u0415\u0422 \u0418 \u041b\u0418\u041c\u041e\u041d\u041e\u0412 \u0421\u041e\u041a\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"oil-vinegar\",\r\n    name:\"\u0411\u0443\u0442\u0438\u043b\u043a\u0438 \u0437\u0430 \u043e\u043b\u0438\u043e, \u043e\u0446\u0435\u0442 \u0438 \u043b\u0438\u043c\u043e\u043d\u043e\u0432 \u0441\u043e\u043a\",\r\n    prefix:\"GRA-OV\",\r\n    images:[\r\n        \"IMG_0006-scaled.jpg\",\r\n        \"IMG_0010-scaled.jpg\",\r\n        \"IMG_0024-scaled.jpg\",\r\n        \"IMG_0028-scaled.jpg\",\r\n        \"IMG_0191-scaled.jpg\",\r\n        \"IMG_0199-scaled.jpg\",\r\n        \"IMG_0248-scaled.jpg\",\r\n        \"IMG_0256-scaled.jpg\",\r\n        \"IMG_0260-scaled.jpg\",\r\n        \"IMG_0262-scaled.jpg\",\r\n        \"IMG_0271-scaled.jpg\",\r\n        \"IMG_0280-scaled.jpg\",\r\n        \"IMG_0284-scaled.jpg\",\r\n        \"IMG_0292-scaled.jpg\",\r\n        \"IMG_0295-scaled.jpg\",\r\n        \"IMG_0297-scaled.jpg\",\r\n        \"IMG_0321-scaled.jpg\",\r\n        \"IMG_0331-scaled.jpg\",\r\n        \"IMG_0413-scaled.jpg\",\r\n        \"IMG_0438-scaled.jpg\",\r\n        \"IMG_0442-scaled.jpg\",\r\n        \"IMG_0494-scaled.jpg\",\r\n        \"IMG_0504-scaled.jpg\",\r\n        \"IMG_0516-scaled.jpg\",\r\n        \"IMG_0520-scaled.jpg\",\r\n        \"IMG_0524-scaled.jpg\",\r\n        \"IMG_0527-scaled.jpg\",\r\n        \"IMG_0609.jpeg\",\r\n        \"IMG_0610.jpeg\",\r\n        \"IMG_0611.jpeg\",\r\n        \"IMG_0622.jpeg\",\r\n        \"IMG_0623.jpeg\",\r\n        \"IMG_0630.jpeg\",\r\n        \"IMG_0637.jpeg\",\r\n        \"IMG_0638.jpeg\",\r\n        \"IMG_0702.jpeg\",\r\n        \"IMG_0716.jpeg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0421\u041e\u041a\u041e\u0412\u0415, \u0411\u041e\u0417\u0410 \u0418 \u041c\u041b\u0415\u0427\u041d\u0418 \u041d\u0410\u041f\u0418\u0422\u041a\u0418\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"juice-dairy\",\r\n    name:\"\u0421\u043e\u043a\u043e\u0432\u0435, \u0431\u043e\u0437\u0430 \u0438 \u043c\u043b\u0435\u0447\u043d\u0438 \u043d\u0430\u043f\u0438\u0442\u043a\u0438\",\r\n    prefix:\"GRA-JM\",\r\n    images:[\r\n        \"IMG_0025-scaled.jpg\",\r\n        \"IMG_0054-scaled.jpg\",\r\n        \"IMG_0106-scaled.jpg\",\r\n        \"IMG_0110-scaled.jpg\",\r\n        \"IMG_0137-scaled.jpg\",\r\n        \"IMG_0140-scaled.jpg\",\r\n        \"IMG_0151-scaled.jpg\",\r\n        \"IMG_0154-scaled.jpg\",\r\n        \"IMG_0158-scaled.jpg\",\r\n        \"IMG_0164-scaled.jpg\",\r\n        \"IMG_0167-scaled.jpg\",\r\n        \"IMG_0190-scaled.jpg\",\r\n        \"IMG_0214-scaled.jpg\",\r\n        \"IMG_0239-scaled.jpg\",\r\n        \"IMG_0242-scaled.jpg\",\r\n        \"IMG_0243-scaled.jpg\",\r\n        \"IMG_0258-scaled.jpg\",\r\n        \"IMG_0264-scaled.jpg\",\r\n        \"IMG_0290-scaled.jpg\",\r\n        \"IMG_0329-scaled.jpg\",\r\n        \"IMG_0333-scaled.jpg\",\r\n        \"IMG_0338-scaled.jpg\",\r\n        \"IMG_0381-scaled.jpg\",\r\n        \"IMG_0385-scaled.jpg\",\r\n        \"IMG_0387-scaled.jpg\",\r\n        \"IMG_0392-scaled.jpg\",\r\n        \"IMG_0418-scaled.jpg\",\r\n        \"IMG_0434-scaled.jpg\",\r\n        \"IMG_0444-scaled.jpg\",\r\n        \"IMG_0482.jpeg\",\r\n        \"IMG_0502-scaled.jpg\",\r\n        \"IMG_0621.jpeg\",\r\n        \"IMG_0629.jpeg\",\r\n        \"IMG_0631.jpeg\",\r\n        \"IMG_0632.jpeg\",\r\n        \"IMG_0634.jpeg\",\r\n        \"IMG_0635.jpeg\",\r\n        \"IMG_0703.jpeg\",\r\n        \"IMG_0704.jpeg\",\r\n        \"IMG_0707.jpeg\",\r\n        \"IMG_0708.jpeg\",\r\n        \"IMG_0709.jpeg\",\r\n        \"IMG_0710.jpeg\",\r\n        \"IMG_0715.jpeg\",\r\n        \"IMG_0729.jpeg\",\r\n        \"IMG_0730.jpeg\",\r\n        \"IMG_0732.jpeg\",\r\n        \"IMG_0733.jpeg\",\r\n        \"IMG_0734.jpeg\",\r\n        \"IMG_0735.jpeg\",\r\n        \"IMG_0736.jpeg\",\r\n        \"IMG_0737.jpeg\",\r\n        \"IMG_0738.jpeg\",\r\n        \"IMG_0754.jpeg\",\r\n        \"IMG_0755.jpeg\",\r\n        \"IMG_0756.jpeg\",\r\n        \"IMG_0757.jpeg\",\r\n        \"IMG_0758.jpeg\",\r\n        \"IMG_0759.jpeg\",\r\n        \"IMG_0760.jpeg\",\r\n        \"IMG_0762.jpeg\",\r\n        \"IMG_0763.jpeg\",\r\n        \"IMG_0764.jpeg\",\r\n        \"IMG_0768.jpeg\",\r\n        \"IMG_0769.jpeg\",\r\n        \"IMG_0771.jpeg\",\r\n        \"IMG_0772.jpeg\",\r\n        \"IMG_0773.jpeg\",\r\n        \"IMG_0774.jpeg\",\r\n        \"IMG_9886-scaled.jpg\",\r\n        \"IMG_9888-scaled.jpg\",\r\n        \"IMG_9910-scaled.jpg\",\r\n        \"IMG_9932-scaled.jpg\",\r\n        \"IMG_9950-scaled.jpg\",\r\n        \"IMG_9952-scaled.jpg\",\r\n        \"IMG_9954-scaled.jpg\",\r\n        \"IMG_9966-scaled.jpg\"\r\n    ]\r\n},\r\n\r\n\r\n\/* =========================================================\r\n   \u0413\u041e\u041b\u0415\u041c\u0418 \u0420\u0410\u0417\u0424\u0410\u0421\u041e\u0412\u041a\u0418\r\n   IMG_9954 \u0438 IMG_9966 \u043d\u0435 \u0441\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438 \u0442\u0443\u043a.\r\n========================================================= *\/\r\n\r\n{\r\n    id:\"large\",\r\n    name:\"\u0413\u043e\u043b\u0435\u043c\u0438 \u0440\u0430\u0437\u0444\u0430\u0441\u043e\u0432\u043a\u0438\",\r\n    prefix:\"GRA-L\",\r\n    images:[\r\n        \"IMG_0101-scaled.jpg\",\r\n        \"IMG_0118-scaled.jpg\",\r\n        \"IMG_0120-scaled.jpg\",\r\n        \"IMG_0122-scaled.jpg\",\r\n        \"IMG_0200-scaled.jpg\",\r\n        \"IMG_0210-scaled.jpg\",\r\n        \"IMG_0213-scaled.jpg\",\r\n        \"IMG_0362-scaled.jpg\",\r\n        \"IMG_0365-scaled.jpg\",\r\n        \"IMG_0416-scaled.jpg\",\r\n        \"IMG_0419-scaled.jpg\"\r\n    ]\r\n}\r\n\r\n];\r\n\r\n\r\n\/* =========================================================\r\n   GLOBAL DUPLICATE PROTECTION\r\n   \u0410\u043a\u043e \u0435\u0434\u0438\u043d \u0438 \u0441\u044a\u0449 URL \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u043e \u043f\u0440\u0438\u0441\u044a\u0441\u0442\u0432\u0430 \u0434\u0432\u0430 \u043f\u044a\u0442\u0438,\r\n   \u0449\u0435 \u0431\u044a\u0434\u0435 \u043f\u043e\u043a\u0430\u0437\u0430\u043d \u0441\u0430\u043c\u043e \u043f\u0440\u0438 \u043f\u044a\u0440\u0432\u0430\u0442\u0430 \u043c\u0443 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f.\r\n========================================================= *\/\r\n\r\nconst usedImages = new Set();\r\n\r\ncategories.forEach(category => {\r\n\r\n    category.images = category.images.filter(filename => {\r\n\r\n        const full = BASE + filename;\r\n\r\n        if(usedImages.has(full)){\r\n            return false;\r\n        }\r\n\r\n        usedImages.add(full);\r\n        return true;\r\n\r\n    });\r\n\r\n});\r\n\r\n\r\n\/* =========================================================\r\n   ELEMENTS\r\n========================================================= *\/\r\n\r\nconst productsContainer =\r\n    document.getElementById(\"gprProducts\");\r\n\r\nconst categoryButtons =\r\n    document.getElementById(\"gprCategoryButtons\");\r\n\r\nconst totalElement =\r\n    document.getElementById(\"gprTotal\");\r\n\r\nconst modal =\r\n    document.getElementById(\"gprModal\");\r\n\r\nconst modalImage =\r\n    document.getElementById(\"gprModalImage\");\r\n\r\nconst modalCategory =\r\n    document.getElementById(\"gprModalCategory\");\r\n\r\nconst modalCode =\r\n    document.getElementById(\"gprModalCode\");\r\n\r\nconst modalContact =\r\n    document.getElementById(\"gprModalContact\");\r\n\r\nconst modalClose =\r\n    document.getElementById(\"gprModalClose\");\r\n\r\n\r\n\/* =========================================================\r\n   TOTAL COUNT\r\n========================================================= *\/\r\n\r\nconst totalProducts =\r\n    categories.reduce(\r\n        (total, category) => total + category.images.length,\r\n        0\r\n    );\r\n\r\ntotalElement.innerHTML =\r\n    totalProducts + \"<span>+<\/span>\";\r\n\r\n\r\n\/* =========================================================\r\n   CATEGORY BUTTONS\r\n========================================================= *\/\r\n\r\nconst allButton =\r\n    document.createElement(\"button\");\r\n\r\nallButton.type = \"button\";\r\nallButton.className =\r\n    \"gpr-category-button active\";\r\n\r\nallButton.textContent =\r\n    \"\u0412\u0441\u0438\u0447\u043a\u0438\";\r\n\r\nallButton.addEventListener(\"click\", function(){\r\n\r\n    window.scrollTo({\r\n        top:\r\n            document.querySelector(\".gpr-products-wrapper\")\r\n            .getBoundingClientRect().top\r\n            + window.pageYOffset\r\n            - 80,\r\n        behavior:\"smooth\"\r\n    });\r\n\r\n});\r\n\r\ncategoryButtons.appendChild(allButton);\r\n\r\n\r\ncategories.forEach(category => {\r\n\r\n    const button =\r\n        document.createElement(\"button\");\r\n\r\n    button.type = \"button\";\r\n\r\n    button.className =\r\n        \"gpr-category-button\";\r\n\r\n    button.textContent =\r\n        category.name;\r\n\r\n    button.addEventListener(\"click\", function(){\r\n\r\n        const target =\r\n            document.getElementById(\r\n                \"category-\" + category.id\r\n            );\r\n\r\n        if(target){\r\n\r\n            target.scrollIntoView({\r\n                behavior:\"smooth\",\r\n                block:\"start\"\r\n            });\r\n\r\n        }\r\n\r\n    });\r\n\r\n    categoryButtons.appendChild(button);\r\n\r\n});\r\n\r\n\r\n\/* =========================================================\r\n   CREATE PRODUCT SECTIONS\r\n========================================================= *\/\r\n\r\ncategories.forEach(category => {\r\n\r\n    const section =\r\n        document.createElement(\"section\");\r\n\r\n    section.className =\r\n        \"gpr-category-section\";\r\n\r\n    section.id =\r\n        \"category-\" + category.id;\r\n\r\n\r\n    const header =\r\n        document.createElement(\"div\");\r\n\r\n    header.className =\r\n        \"gpr-category-head\";\r\n\r\n    header.innerHTML = `\r\n        <div>\r\n            <div class=\"gpr-category-meta\">\r\n                \u041f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\u0430 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f\r\n            <\/div>\r\n\r\n            <h2 class=\"gpr-section-title\">\r\n                ${category.name}\r\n            <\/h2>\r\n        <\/div>\r\n\r\n        <div class=\"gpr-category-count\">\r\n            ${category.images.length}\r\n            ${category.images.length === 1 ? \"\u043f\u0440\u043e\u0434\u0443\u043a\u0442\" : \"\u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430\"}\r\n        <\/div>\r\n    `;\r\n\r\n\r\n    const grid =\r\n        document.createElement(\"div\");\r\n\r\n    grid.className =\r\n        \"gpr-grid\";\r\n\r\n\r\n    category.images.forEach(\r\n        (filename,index) => {\r\n\r\n        const number =\r\n            String(index + 1).padStart(3,\"0\");\r\n\r\n        const code =\r\n            category.prefix + \"-\" + number;\r\n\r\n        const image =\r\n            BASE + filename;\r\n\r\n\r\n        const product =\r\n            document.createElement(\"article\");\r\n\r\n        product.className =\r\n            \"gpr-product\";\r\n\r\n        product.setAttribute(\r\n            \"data-code\",\r\n            code\r\n        );\r\n\r\n        product.setAttribute(\r\n            \"data-category\",\r\n            category.name\r\n        );\r\n\r\n        product.setAttribute(\r\n            \"data-image\",\r\n            image\r\n        );\r\n\r\n\r\n        product.innerHTML = `\r\n            <div class=\"gpr-product-image\">\r\n\r\n                <img\r\n                    src=\"${image}\"\r\n                    alt=\"${category.name} ${code}\"\r\n                    loading=\"lazy\"\r\n                    decoding=\"async\">\r\n\r\n                <div class=\"gpr-hover\">\r\n                    <span>\r\n                        \u0412\u0438\u0436 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430\r\n                    <\/span>\r\n                <\/div>\r\n\r\n            <\/div>\r\n\r\n            <div class=\"gpr-product-bottom\">\r\n\r\n                <div class=\"gpr-product-code\">\r\n                    ${code}\r\n                <\/div>\r\n\r\n                <div class=\"gpr-product-arrow\">\r\n                    \u2192\r\n                <\/div>\r\n\r\n            <\/div>\r\n        `;\r\n\r\n\r\n        product.addEventListener(\r\n            \"click\",\r\n            openProductModal\r\n        );\r\n\r\n\r\n        grid.appendChild(product);\r\n\r\n    });\r\n\r\n\r\n    section.appendChild(header);\r\n    section.appendChild(grid);\r\n\r\n    productsContainer.appendChild(section);\r\n\r\n});\r\n\r\n\r\n\/* =========================================================\r\n   MODAL\r\n========================================================= *\/\r\n\r\nfunction openProductModal(){\r\n\r\n    const code =\r\n        this.getAttribute(\"data-code\");\r\n\r\n    const category =\r\n        this.getAttribute(\"data-category\");\r\n\r\n    const image =\r\n        this.getAttribute(\"data-image\");\r\n\r\n\r\n    modalImage.src =\r\n        image;\r\n\r\n    modalImage.alt =\r\n        category + \" \" + code;\r\n\r\n    modalCategory.textContent =\r\n        category;\r\n\r\n    modalCode.textContent =\r\n        code;\r\n\r\n\r\n    modal.classList.add(\"open\");\r\n\r\n    document.body.style.overflow =\r\n        \"hidden\";\r\n\r\n}\r\n\r\n\r\nfunction closeProductModal(){\r\n\r\n    modal.classList.remove(\"open\");\r\n\r\n    document.body.style.overflow =\r\n        \"\";\r\n\r\n}\r\n\r\n\r\nmodalClose.addEventListener(\r\n    \"click\",\r\n    closeProductModal\r\n);\r\n\r\n\r\nmodal.addEventListener(\r\n    \"click\",\r\n    function(event){\r\n\r\n        if(event.target === modal){\r\n\r\n            closeProductModal();\r\n\r\n        }\r\n\r\n    }\r\n);\r\n\r\n\r\ndocument.addEventListener(\r\n    \"keydown\",\r\n    function(event){\r\n\r\n        if(event.key === \"Escape\"){\r\n\r\n            closeProductModal();\r\n\r\n        }\r\n\r\n    }\r\n);\r\n\r\n\r\n\/* =========================================================\r\n   ACTIVE CATEGORY WHILE SCROLLING\r\n========================================================= *\/\r\n\r\nconst buttons =\r\n    Array.from(\r\n        document.querySelectorAll(\r\n            \".gpr-category-button\"\r\n        )\r\n    );\r\n\r\nconst sections =\r\n    Array.from(\r\n        document.querySelectorAll(\r\n            \".gpr-category-section\"\r\n        )\r\n    );\r\n\r\n\r\nconst observer =\r\n    new IntersectionObserver(\r\n        entries => {\r\n\r\n            entries.forEach(entry => {\r\n\r\n                if(entry.isIntersecting){\r\n\r\n                    buttons.forEach(button => {\r\n                        button.classList.remove(\"active\");\r\n                    });\r\n\r\n                    const index =\r\n                        sections.indexOf(entry.target);\r\n\r\n                    if(index >= 0){\r\n\r\n                        buttons[index + 1]\r\n                            .classList.add(\"active\");\r\n\r\n                    }\r\n\r\n                }\r\n\r\n            });\r\n\r\n        },\r\n        {\r\n            rootMargin:\r\n                \"-25% 0px -60% 0px\",\r\n            threshold:0\r\n        }\r\n    );\r\n\r\n\r\nsections.forEach(section => {\r\n    observer.observe(section);\r\n});\r\n\r\n})();\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u041f\u0440\u043e\u0434\u0443\u043a\u0442\u0438 \u041e\u043f\u0430\u043a\u043e\u0432\u043a\u0438 \u0437\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0420\u0430\u0437\u0433\u043b\u0435\u0434\u0430\u0439\u0442\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432\u043e\u0442\u043e \u043f\u043e\u0440\u0442\u0444\u043e\u043b\u0438\u043e \u043d\u0430 Grafus. \u0418\u0437\u0431\u0435\u0440\u0435\u0442\u0435 \u043a\u0430\u0442\u0435\u0433\u043e\u0440\u0438\u044f \u0438 \u043d\u0430\u0442\u0438\u0441\u043d\u0435\u0442\u0435 \u0432\u044a\u0440\u0445\u0443 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u0435\u043d \u043c\u043e\u0434\u0435\u043b, \u0437\u0430 \u0434\u0430 \u0433\u043e \u0440\u0430\u0437\u0433\u043b\u0435\u0434\u0430\u0442\u0435 \u0432 \u043f\u043e-\u0433\u043e\u043b\u044f\u043c \u0440\u0430\u0437\u043c\u0435\u0440. 0+ \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u0432 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430 \u041d\u0435 \u043e\u0442\u043a\u0440\u0438\u0432\u0430\u0442\u0435 \u0442\u043e\u0447\u043d\u0438\u044f \u043c\u043e\u0434\u0435\u043b? \u0421\u0432\u044a\u0440\u0436\u0435\u0442\u0435 \u0441\u0435 \u0441 \u0435\u043a\u0438\u043f\u0430 \u043d\u0430 Grafus \u0438 \u043d\u0438 \u0438\u0437\u043f\u0440\u0430\u0442\u0435\u0442\u0435 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0437\u0430 \u0442\u0438\u043f\u0430 \u043e\u043f\u0430\u043a\u043e\u0432\u043a\u0430, \u043a\u043e\u044f\u0442\u043e \u0442\u044a\u0440\u0441\u0438\u0442\u0435. \u0418\u0437\u043f\u0440\u0430\u0442\u0438 \u0437\u0430\u043f\u0438\u0442\u0432\u0430\u043d\u0435 \u2192 \u0411\u044a\u043b\u0433\u0430\u0440\u0441\u043a\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b \u043d\u0430 \u043f\u043b\u0430\u0441\u0442\u043c\u0430\u0441\u043e\u0432\u0438 \u0431\u0443\u0442\u0438\u043b\u043a\u0438, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-21026","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/pages\/21026","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/comments?post=21026"}],"version-history":[{"count":7,"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/pages\/21026\/revisions"}],"predecessor-version":[{"id":21423,"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/pages\/21026\/revisions\/21423"}],"wp:attachment":[{"href":"https:\/\/grafus.bg\/en\/wp-json\/wp\/v2\/media?parent=21026"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}