Layout Comparison — Single Catalogue Per Brand<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&display=swap\" rel=\"stylesheet\">\n<style>\n :root{\n --bg:#ffffff;\n --bg-soft:#f5f6f7;\n --card-border:rgba(0,0,0,0.10);\n --blue:#00427d;\n --blue-light:#1c6bb0;\n --red:rgba(237,29,36,0.9);\n --red-solid:#ed1d24;\n --grey:#777777;\n --text:#171717;\n }\n\n *{ box-sizing:border-box; margin:0; padding:0; }\n\n body{\n background:var(--bg);\n color:var(--text);\n font-family:'Roboto', Arial, sans-serif;\n -webkit-font-smoothing:antialiased;\n }\n\n \/* ---- mini header (context only, not part of the comparison) ---- *\/\n\n header.mini-header{\n background:var(--bg-soft);\n padding:36px 24px;\n text-align:center;\n border-bottom:1px solid var(--card-border);\n }\n\n header.mini-header h1{\n font-size:1.4rem;\n font-weight:700;\n }\n\n header.mini-header p{\n color:var(--grey);\n font-size:0.9rem;\n margin-top:8px;\n }\n\n \/* ---- comparison scaffolding ---- *\/\n\n main{\n max-width:1200px;\n margin:0 auto;\n padding:48px 24px 40px;\n }\n\n .option-block{ margin-bottom:64px; }\n\n .option-label{\n display:inline-block;\n background:var(--red-solid);\n color:#fff;\n font-size:0.68rem;\n font-weight:700;\n letter-spacing:1.5px;\n text-transform:uppercase;\n padding:5px 13px;\n border-radius:999px;\n margin-bottom:16px;\n }\n\n .option-title{\n font-size:1.4rem;\n font-weight:700;\n margin-bottom:6px;\n }\n\n .option-desc{\n color:var(--grey);\n font-size:0.92rem;\n line-height:1.55;\n max-width:640px;\n margin-bottom:32px;\n }\n\n .option-divider{\n height:1px;\n background:var(--card-border);\n margin:0 0 64px;\n }\n\n \/* ---- shared: logo chip ---- *\/\n\n .logo-chip{\n display:flex;\n align-items:center;\n justify-content:center;\n }\n\n .logo-chip img{\n max-width:100%;\n max-height:100%;\n object-fit:contain;\n }\n\n \/* ---- shared: cover thumb + pdf tag ---- *\/\n\n .cover-thumb{\n position:relative;\n width:100%;\n aspect-ratio:210\/297;\n border-radius:10px;\n background:#eee;\n border:1px solid var(--card-border);\n box-shadow:0 8px 18px rgba(0,0,0,0.12);\n overflow:hidden;\n transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;\n }\n\n .cover-thumb img{\n width:100%;\n height:100%;\n object-fit:cover;\n display:block;\n }\n\n .cover-thumb::before{\n content:\"\";\n position:absolute;\n top:0; left:0; right:0;\n height:5px;\n background:var(--red-solid);\n z-index:1;\n }\n\n .cover-thumb .pdf-tag{\n position:absolute;\n top:13px; right:10px;\n font-size:0.6rem;\n font-weight:700;\n letter-spacing:1px;\n color:#fff;\n background:rgba(237,29,36,0.92);\n padding:3px 7px;\n border-radius:4px;\n z-index:1;\n }\n\n \/* ---- shared: download button ---- *\/\n\n .dl-btn{\n display:inline-flex;\n align-items:center;\n gap:7px;\n background:var(--blue);\n border:1px solid var(--blue-light);\n color:#f2f2f2;\n border-radius:999px;\n padding:8px 20px;\n font-size:0.78rem;\n font-weight:700;\n letter-spacing:0.5px;\n font-family:inherit;\n cursor:pointer;\n transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;\n }\n\n .dl-btn .dl-icon{ font-size:0.85rem; line-height:1; }\n\n .dl-btn:hover,\n .dl-btn:focus-visible{\n background:var(--red-solid);\n border-color:var(--red-solid);\n color:#fff;\n transform:translateY(-2px);\n box-shadow:0 8px 16px rgba(237,29,36,0.3);\n }\n\n \/* =======================================================\n OPTION A \u2014 Compact Grid (current)\n ======================================================= *\/\n\n .opt-a-grid{\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));\n gap:24px;\n }\n\n .opt-a-card{\n position:relative;\n display:flex;\n flex-direction:column;\n align-items:center;\n text-align:center;\n gap:12px;\n background:var(--bg-soft);\n border-radius:14px;\n padding:32px 22px 26px;\n overflow:hidden;\n transition:transform .25s ease, box-shadow .25s ease;\n }\n\n .opt-a-card::before{\n content:\"\";\n position:absolute;\n top:0; left:0; right:0;\n height:4px;\n background:linear-gradient(90deg, var(--blue-light), var(--red-solid));\n }\n\n .opt-a-card:hover{ transform:translateY(-4px); box-shadow:0 16px 30px rgba(0,0,0,0.12); }\n\n .opt-a-card .logo-chip{ height:64px; width:130px; }\n .opt-a-card .cover-thumb-wrap{ width:100%; max-width:150px; }\n\n .opt-a-name{ font-size:1rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-a-rule{ width:40px; height:2px; background:var(--red-solid); }\n .opt-a-tagline{ color:var(--grey); font-size:0.82rem; font-weight:300; line-height:1.5; }\n\n \/* =======================================================\n OPTION B \u2014 One Row Per Brand\n ======================================================= *\/\n\n .opt-b-list{ display:flex; flex-direction:column; gap:20px; }\n\n .opt-b-row{\n position:relative;\n display:flex;\n align-items:center;\n gap:32px;\n background:var(--bg-soft);\n border-radius:14px;\n padding:28px 32px 28px 38px;\n overflow:hidden;\n }\n\n .opt-b-row::before{\n content:\"\";\n position:absolute;\n left:0; top:0; bottom:0;\n width:6px;\n background:var(--red-solid);\n }\n\n .opt-b-info{\n flex:1;\n min-width:0;\n display:flex;\n flex-direction:column;\n align-items:flex-start;\n text-align:left;\n gap:8px;\n }\n\n .opt-b-row .logo-chip{ height:56px; width:130px; justify-content:flex-start; }\n\n .opt-b-name{ font-size:1.2rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-b-rule{ width:50px; height:2px; background:var(--red-solid); }\n .opt-b-tagline{ color:var(--grey); font-size:0.88rem; font-weight:300; line-height:1.55; max-width:460px; }\n\n .opt-b-cover{\n flex:0 0 auto;\n width:130px;\n display:flex;\n flex-direction:column;\n align-items:center;\n gap:12px;\n }\n\n .opt-b-cover .dl-btn{ width:100%; justify-content:center; }\n\n @media (max-width:700px){\n .opt-b-row{ flex-direction:column; text-align:center; padding:26px 24px; }\n .opt-b-info{ align-items:center; text-align:center; }\n .opt-b-row .logo-chip{ justify-content:center; }\n .opt-b-tagline{ max-width:none; }\n }\n\n \/* =======================================================\n OPTION C \u2014 Larger Cover Images\n ======================================================= *\/\n\n .opt-c-grid{\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));\n gap:32px;\n }\n\n .opt-c-card{\n display:flex;\n flex-direction:column;\n align-items:center;\n text-align:center;\n gap:12px;\n }\n\n .opt-c-cover-wrap{ width:100%; max-width:230px; }\n\n .opt-c-card .logo-chip{ height:38px; width:100px; margin-top:6px; opacity:0.85; }\n\n .opt-c-name{ font-size:1.05rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-c-tagline{ color:var(--grey); font-size:0.83rem; font-weight:300; line-height:1.5; max-width:230px; }\n\n \/* ---- shared modal ---- *\/\n\n .dl-modal-overlay{\n display:none;\n position:fixed;\n inset:0;\n background:rgba(0,0,0,0.55);\n align-items:center;\n justify-content:center;\n padding:20px;\n z-index:1000;\n }\n\n .dl-modal-overlay.open{ display:flex; }\n\n .dl-modal{\n position:relative;\n background:#ffffff;\n border-radius:14px;\n width:100%;\n max-width:340px;\n padding:28px 26px 24px;\n box-shadow:0 24px 48px rgba(0,0,0,0.35);\n }\n\n .dl-modal-close{\n position:absolute;\n top:14px; right:14px;\n width:30px; height:30px;\n border-radius:50%;\n border:none;\n background:var(--bg-soft);\n color:var(--grey);\n font-size:1.2rem;\n line-height:1;\n cursor:pointer;\n transition:background .2s ease, color .2s ease;\n }\n\n .dl-modal-close:hover{ background:var(--red-solid); color:#fff; }\n\n .dl-modal-title{\n font-size:1.05rem;\n font-weight:700;\n color:var(--text);\n padding-right:24px;\n margin-bottom:4px;\n }\n\n .dl-modal-subtitle{\n color:var(--grey);\n font-size:0.82rem;\n margin-bottom:18px;\n }\n\n .dl-modal-list{\n display:flex;\n flex-direction:column;\n gap:8px;\n }\n\n .dl-modal-row{\n display:flex;\n align-items:center;\n justify-content:space-between;\n text-decoration:none;\n padding:11px 14px;\n border-radius:10px;\n border:1px solid var(--card-border);\n color:var(--text);\n transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;\n }\n\n .dl-modal-row:hover{\n background:var(--red-solid);\n border-color:var(--red-solid);\n color:#fff;\n transform:translateX(2px);\n }\n\n .dl-modal-row .lang-name{ font-weight:500; font-size:0.9rem; }\n\n .dl-modal-row .lang-code{\n font-size:0.7rem;\n font-weight:700;\n letter-spacing:0.5px;\n color:var(--grey);\n background:var(--bg-soft);\n padding:3px 8px;\n border-radius:6px;\n }\n\n .dl-modal-row:hover .lang-code{ background:rgba(255,255,255,0.25); color:#fff; }\n<\/style>\n<\/head>\n<body>\n\n <header class=\"mini-header\">\n <h1>Catalogue Section — Layout Comparison<\/h1>\n <p>Three options for the “one catalogue per brand” case, stacked for side-by-side review. Hero, tagline banner, EcoMotion and company sections are unchanged in all three and omitted here for focus.<\/p>\n <\/header>\n\n <main>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option A<\/span>\n <h2 class=\"option-title\">Compact Grid (current)<\/h2>\n <p class=\"option-desc\">All four brands visible at once in a 4-up grid. Best for scanning quickly, but the cover image is small and secondary to the text.<\/p>\n\n <div class=\"opt-a-grid\">\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-a-name\">TAB<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Premium European starter batteries delivering reliable starting power and proven quality.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-a-name\">Vesna<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Reliable starter batteries offering dependable performance for everyday driving.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-a-name\">Volthor<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Reliable starter batteries providing solid performance and excellent value.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-a-name\">Topla<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">High-quality European starter batteries with long service life and consistent performance.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"option-divider\"><\/div>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option B<\/span>\n <h2 class=\"option-title\">One Row Per Brand<\/h2>\n <p class=\"option-desc\">Each brand gets a full-width row — logo, name and tagline on the left, cover and download button on the right. More breathing room per brand, reads like a list rather than a grid.<\/p>\n\n <div class=\"opt-b-list\">\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-b-name\">TAB<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Premium European starter batteries delivering reliable starting power, long-lasting performance and proven quality for modern vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-b-name\">Vesna<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Reliable starter batteries offering dependable starting power, durable performance and proven quality for everyday driving.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-b-name\">Volthor<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Reliable starter batteries providing dependable starting power, solid performance and excellent value for a wide range of vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-b-name\">Topla<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">High-quality European starter batteries combining reliable starting power, long service life and consistent performance for modern vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"option-divider\"><\/div>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option C<\/span>\n <h2 class=\"option-title\">Larger Cover Images<\/h2>\n <p class=\"option-desc\">The catalogue cover becomes the star — logo shrinks to a small mark below it. Feels more like a “download the brochure” bookshelf than a brand directory.<\/p>\n\n <div class=\"opt-c-grid\">\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-c-name\">TAB<\/h3>\n <p class=\"opt-c-tagline\">Premium European starter batteries for modern vehicles.<\/p>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-c-name\">Vesna<\/h3>\n <p class=\"opt-c-tagline\">Dependable batteries for everyday driving.<\/p>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-c-name\">Volthor<\/h3>\n <p class=\"opt-c-tagline\">Solid performance and excellent value.<\/p>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-c-name\">Topla<\/h3>\n <p class=\"opt-c-tagline\">Long service life, consistent performance.<\/p>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <\/main>\n\n <div class=\"dl-modal-overlay\" id=\"dlOverlay\">\n <div class=\"dl-modal\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"dlModalTitle\">\n <button class=\"dl-modal-close\" id=\"dlModalClose\" aria-label=\"Close\">×<\/button>\n <h3 class=\"dl-modal-title\" id=\"dlModalTitle\">Catalogue<\/h3>\n <p class=\"dl-modal-subtitle\">Choose a language<\/p>\n <div class=\"dl-modal-list\" id=\"dlModalList\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n var LANGS = [\n {code:'en', label:'English'},\n {code:'de', label:'Deutsch'},\n {code:'si', label:'Sloven\u0161\u010dina'},\n {code:'ru', label:'\u0420\u0443\u0441\u0441\u043a\u0438\u0439'},\n {code:'el', label:'\u0395\u03bb\u03bb\u03b7\u03bd\u03b9\u03ba\u03ac'}\n ];\n\n var dlOverlay = document.getElementById('dlOverlay');\n var dlModalTitle = document.getElementById('dlModalTitle');\n var dlModalList = document.getElementById('dlModalList');\n\n function openDlModal(title, prefix){\n dlModalTitle.textContent = title;\n dlModalList.innerHTML = LANGS.map(function(l){\n return '<a class=\"dl-modal-row\" href=\"' + prefix + '_' + l.code + '.pdf\">' +\n '<span class=\"lang-name\">' + l.label + '<\/span>' +\n '<span class=\"lang-code\">' + l.code.toUpperCase() + '<\/span><\/a>';\n }).join('');\n dlOverlay.classList.add('open');\n document.body.style.overflow = 'hidden';\n }\n\n function closeDlModal(){\n dlOverlay.classList.remove('open');\n document.body.style.overflow = '';\n }\n\n document.querySelectorAll('.dl-btn').forEach(function(btn){\n btn.addEventListener('click', function(){\n openDlModal(btn.dataset.title, btn.dataset.prefix);\n });\n });\n\n document.getElementById('dlModalClose').addEventListener('click', closeDlModal);\n dlOverlay.addEventListener('click', function(e){ if (e.target === dlOverlay) closeDlModal(); });\n document.addEventListener('keydown', function(e){ if (e.key === 'Escape') closeDlModal(); });\n <\/script>\n\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Layout Comparison — Single Catalogue Per Brand Catalogue Section — Layout Comparison Three options for the “one catalogue per brand” case, stacked for side-by-side review. Hero, tagline banner, EcoMotion and company sections are unchanged in all three and omitted here for focus. Option A Compact Grid (current) All four brands visible at once in a […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459"}],"collection":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/comments?post=18459"}],"version-history":[{"count":4,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459\/revisions"}],"predecessor-version":[{"id":18463,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459\/revisions\/18463"}],"wp:attachment":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/media?parent=18459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":18459,"date":"2026-08-10T17:52:30","date_gmt":"2026-08-10T17:52:30","guid":{"rendered":"https:\/\/www.tab.si\/?page_id=18459"},"modified":"2026-08-10T18:42:39","modified_gmt":"2026-08-10T18:42:39","slug":"starter-test","status":"publish","type":"page","link":"https:\/\/www.tab.si\/sl\/starter-test\/","title":{"rendered":"Starter test"},"content":{"rendered":"\n\n\n\n\n\nLayout Comparison — Single Catalogue Per Brand<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&display=swap\" rel=\"stylesheet\">\n<style>\n :root{\n --bg:#ffffff;\n --bg-soft:#f5f6f7;\n --card-border:rgba(0,0,0,0.10);\n --blue:#00427d;\n --blue-light:#1c6bb0;\n --red:rgba(237,29,36,0.9);\n --red-solid:#ed1d24;\n --grey:#777777;\n --text:#171717;\n }\n\n *{ box-sizing:border-box; margin:0; padding:0; }\n\n body{\n background:var(--bg);\n color:var(--text);\n font-family:'Roboto', Arial, sans-serif;\n -webkit-font-smoothing:antialiased;\n }\n\n \/* ---- mini header (context only, not part of the comparison) ---- *\/\n\n header.mini-header{\n background:var(--bg-soft);\n padding:36px 24px;\n text-align:center;\n border-bottom:1px solid var(--card-border);\n }\n\n header.mini-header h1{\n font-size:1.4rem;\n font-weight:700;\n }\n\n header.mini-header p{\n color:var(--grey);\n font-size:0.9rem;\n margin-top:8px;\n }\n\n \/* ---- comparison scaffolding ---- *\/\n\n main{\n max-width:1200px;\n margin:0 auto;\n padding:48px 24px 40px;\n }\n\n .option-block{ margin-bottom:64px; }\n\n .option-label{\n display:inline-block;\n background:var(--red-solid);\n color:#fff;\n font-size:0.68rem;\n font-weight:700;\n letter-spacing:1.5px;\n text-transform:uppercase;\n padding:5px 13px;\n border-radius:999px;\n margin-bottom:16px;\n }\n\n .option-title{\n font-size:1.4rem;\n font-weight:700;\n margin-bottom:6px;\n }\n\n .option-desc{\n color:var(--grey);\n font-size:0.92rem;\n line-height:1.55;\n max-width:640px;\n margin-bottom:32px;\n }\n\n .option-divider{\n height:1px;\n background:var(--card-border);\n margin:0 0 64px;\n }\n\n \/* ---- shared: logo chip ---- *\/\n\n .logo-chip{\n display:flex;\n align-items:center;\n justify-content:center;\n }\n\n .logo-chip img{\n max-width:100%;\n max-height:100%;\n object-fit:contain;\n }\n\n \/* ---- shared: cover thumb + pdf tag ---- *\/\n\n .cover-thumb{\n position:relative;\n width:100%;\n aspect-ratio:210\/297;\n border-radius:10px;\n background:#eee;\n border:1px solid var(--card-border);\n box-shadow:0 8px 18px rgba(0,0,0,0.12);\n overflow:hidden;\n transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;\n }\n\n .cover-thumb img{\n width:100%;\n height:100%;\n object-fit:cover;\n display:block;\n }\n\n .cover-thumb::before{\n content:\"\";\n position:absolute;\n top:0; left:0; right:0;\n height:5px;\n background:var(--red-solid);\n z-index:1;\n }\n\n .cover-thumb .pdf-tag{\n position:absolute;\n top:13px; right:10px;\n font-size:0.6rem;\n font-weight:700;\n letter-spacing:1px;\n color:#fff;\n background:rgba(237,29,36,0.92);\n padding:3px 7px;\n border-radius:4px;\n z-index:1;\n }\n\n \/* ---- shared: download button ---- *\/\n\n .dl-btn{\n display:inline-flex;\n align-items:center;\n gap:7px;\n background:var(--blue);\n border:1px solid var(--blue-light);\n color:#f2f2f2;\n border-radius:999px;\n padding:8px 20px;\n font-size:0.78rem;\n font-weight:700;\n letter-spacing:0.5px;\n font-family:inherit;\n cursor:pointer;\n transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease, box-shadow .2s ease;\n }\n\n .dl-btn .dl-icon{ font-size:0.85rem; line-height:1; }\n\n .dl-btn:hover,\n .dl-btn:focus-visible{\n background:var(--red-solid);\n border-color:var(--red-solid);\n color:#fff;\n transform:translateY(-2px);\n box-shadow:0 8px 16px rgba(237,29,36,0.3);\n }\n\n \/* =======================================================\n OPTION A \u2014 Compact Grid (current)\n ======================================================= *\/\n\n .opt-a-grid{\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));\n gap:24px;\n }\n\n .opt-a-card{\n position:relative;\n display:flex;\n flex-direction:column;\n align-items:center;\n text-align:center;\n gap:12px;\n background:var(--bg-soft);\n border-radius:14px;\n padding:32px 22px 26px;\n overflow:hidden;\n transition:transform .25s ease, box-shadow .25s ease;\n }\n\n .opt-a-card::before{\n content:\"\";\n position:absolute;\n top:0; left:0; right:0;\n height:4px;\n background:linear-gradient(90deg, var(--blue-light), var(--red-solid));\n }\n\n .opt-a-card:hover{ transform:translateY(-4px); box-shadow:0 16px 30px rgba(0,0,0,0.12); }\n\n .opt-a-card .logo-chip{ height:64px; width:130px; }\n .opt-a-card .cover-thumb-wrap{ width:100%; max-width:150px; }\n\n .opt-a-name{ font-size:1rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-a-rule{ width:40px; height:2px; background:var(--red-solid); }\n .opt-a-tagline{ color:var(--grey); font-size:0.82rem; font-weight:300; line-height:1.5; }\n\n \/* =======================================================\n OPTION B \u2014 One Row Per Brand\n ======================================================= *\/\n\n .opt-b-list{ display:flex; flex-direction:column; gap:20px; }\n\n .opt-b-row{\n position:relative;\n display:flex;\n align-items:center;\n gap:32px;\n background:var(--bg-soft);\n border-radius:14px;\n padding:28px 32px 28px 38px;\n overflow:hidden;\n }\n\n .opt-b-row::before{\n content:\"\";\n position:absolute;\n left:0; top:0; bottom:0;\n width:6px;\n background:var(--red-solid);\n }\n\n .opt-b-info{\n flex:1;\n min-width:0;\n display:flex;\n flex-direction:column;\n align-items:flex-start;\n text-align:left;\n gap:8px;\n }\n\n .opt-b-row .logo-chip{ height:56px; width:130px; justify-content:flex-start; }\n\n .opt-b-name{ font-size:1.2rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-b-rule{ width:50px; height:2px; background:var(--red-solid); }\n .opt-b-tagline{ color:var(--grey); font-size:0.88rem; font-weight:300; line-height:1.55; max-width:460px; }\n\n .opt-b-cover{\n flex:0 0 auto;\n width:130px;\n display:flex;\n flex-direction:column;\n align-items:center;\n gap:12px;\n }\n\n .opt-b-cover .dl-btn{ width:100%; justify-content:center; }\n\n @media (max-width:700px){\n .opt-b-row{ flex-direction:column; text-align:center; padding:26px 24px; }\n .opt-b-info{ align-items:center; text-align:center; }\n .opt-b-row .logo-chip{ justify-content:center; }\n .opt-b-tagline{ max-width:none; }\n }\n\n \/* =======================================================\n OPTION C \u2014 Larger Cover Images\n ======================================================= *\/\n\n .opt-c-grid{\n display:grid;\n grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));\n gap:32px;\n }\n\n .opt-c-card{\n display:flex;\n flex-direction:column;\n align-items:center;\n text-align:center;\n gap:12px;\n }\n\n .opt-c-cover-wrap{ width:100%; max-width:230px; }\n\n .opt-c-card .logo-chip{ height:38px; width:100px; margin-top:6px; opacity:0.85; }\n\n .opt-c-name{ font-size:1.05rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; }\n .opt-c-tagline{ color:var(--grey); font-size:0.83rem; font-weight:300; line-height:1.5; max-width:230px; }\n\n \/* ---- shared modal ---- *\/\n\n .dl-modal-overlay{\n display:none;\n position:fixed;\n inset:0;\n background:rgba(0,0,0,0.55);\n align-items:center;\n justify-content:center;\n padding:20px;\n z-index:1000;\n }\n\n .dl-modal-overlay.open{ display:flex; }\n\n .dl-modal{\n position:relative;\n background:#ffffff;\n border-radius:14px;\n width:100%;\n max-width:340px;\n padding:28px 26px 24px;\n box-shadow:0 24px 48px rgba(0,0,0,0.35);\n }\n\n .dl-modal-close{\n position:absolute;\n top:14px; right:14px;\n width:30px; height:30px;\n border-radius:50%;\n border:none;\n background:var(--bg-soft);\n color:var(--grey);\n font-size:1.2rem;\n line-height:1;\n cursor:pointer;\n transition:background .2s ease, color .2s ease;\n }\n\n .dl-modal-close:hover{ background:var(--red-solid); color:#fff; }\n\n .dl-modal-title{\n font-size:1.05rem;\n font-weight:700;\n color:var(--text);\n padding-right:24px;\n margin-bottom:4px;\n }\n\n .dl-modal-subtitle{\n color:var(--grey);\n font-size:0.82rem;\n margin-bottom:18px;\n }\n\n .dl-modal-list{\n display:flex;\n flex-direction:column;\n gap:8px;\n }\n\n .dl-modal-row{\n display:flex;\n align-items:center;\n justify-content:space-between;\n text-decoration:none;\n padding:11px 14px;\n border-radius:10px;\n border:1px solid var(--card-border);\n color:var(--text);\n transition:background .2s ease, border-color .2s ease, color .2s ease, transform .2s ease;\n }\n\n .dl-modal-row:hover{\n background:var(--red-solid);\n border-color:var(--red-solid);\n color:#fff;\n transform:translateX(2px);\n }\n\n .dl-modal-row .lang-name{ font-weight:500; font-size:0.9rem; }\n\n .dl-modal-row .lang-code{\n font-size:0.7rem;\n font-weight:700;\n letter-spacing:0.5px;\n color:var(--grey);\n background:var(--bg-soft);\n padding:3px 8px;\n border-radius:6px;\n }\n\n .dl-modal-row:hover .lang-code{ background:rgba(255,255,255,0.25); color:#fff; }\n<\/style>\n<\/head>\n<body>\n\n <header class=\"mini-header\">\n <h1>Catalogue Section — Layout Comparison<\/h1>\n <p>Three options for the “one catalogue per brand” case, stacked for side-by-side review. Hero, tagline banner, EcoMotion and company sections are unchanged in all three and omitted here for focus.<\/p>\n <\/header>\n\n <main>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option A<\/span>\n <h2 class=\"option-title\">Compact Grid (current)<\/h2>\n <p class=\"option-desc\">All four brands visible at once in a 4-up grid. Best for scanning quickly, but the cover image is small and secondary to the text.<\/p>\n\n <div class=\"opt-a-grid\">\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-a-name\">TAB<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Premium European starter batteries delivering reliable starting power and proven quality.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-a-name\">Vesna<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Reliable starter batteries offering dependable performance for everyday driving.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-a-name\">Volthor<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">Reliable starter batteries providing solid performance and excellent value.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-a-card\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-a-name\">Topla<\/h3>\n <span class=\"opt-a-rule\"><\/span>\n <p class=\"opt-a-tagline\">High-quality European starter batteries with long service life and consistent performance.<\/p>\n <div class=\"cover-thumb-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"option-divider\"><\/div>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option B<\/span>\n <h2 class=\"option-title\">One Row Per Brand<\/h2>\n <p class=\"option-desc\">Each brand gets a full-width row — logo, name and tagline on the left, cover and download button on the right. More breathing room per brand, reads like a list rather than a grid.<\/p>\n\n <div class=\"opt-b-list\">\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-b-name\">TAB<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Premium European starter batteries delivering reliable starting power, long-lasting performance and proven quality for modern vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-b-name\">Vesna<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Reliable starter batteries offering dependable starting power, durable performance and proven quality for everyday driving.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-b-name\">Volthor<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">Reliable starter batteries providing dependable starting power, solid performance and excellent value for a wide range of vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n\n <div class=\"opt-b-row\">\n <div class=\"opt-b-info\">\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-b-name\">Topla<\/h3>\n <span class=\"opt-b-rule\"><\/span>\n <p class=\"opt-b-tagline\">High-quality European starter batteries combining reliable starting power, long service life and consistent performance for modern vehicles.<\/p>\n <\/div>\n <div class=\"opt-b-cover\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"option-divider\"><\/div>\n\n <div class=\"option-block\">\n <span class=\"option-label\">Option C<\/span>\n <h2 class=\"option-title\">Larger Cover Images<\/h2>\n <p class=\"option-desc\">The catalogue cover becomes the star — logo shrinks to a small mark below it. Feels more like a “download the brochure” bookshelf than a brand directory.<\/p>\n\n <div class=\"opt-c-grid\">\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"TAB Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/tab.png\" alt=\"TAB logo\"><\/div>\n <h3 class=\"opt-c-name\">TAB<\/h3>\n <p class=\"opt-c-tagline\">Premium European starter batteries for modern vehicles.<\/p>\n <button class=\"dl-btn\" data-title=\"TAB — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/tab_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Vesna Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/vesna.png\" alt=\"VESNA logo\"><\/div>\n <h3 class=\"opt-c-name\">Vesna<\/h3>\n <p class=\"opt-c-tagline\">Dependable batteries for everyday driving.<\/p>\n <button class=\"dl-btn\" data-title=\"Vesna — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/vesna_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Volthor Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/volthor.png\" alt=\"VOLTHOR logo\"><\/div>\n <h3 class=\"opt-c-name\">Volthor<\/h3>\n <p class=\"opt-c-tagline\">Solid performance and excellent value.<\/p>\n <button class=\"dl-btn\" data-title=\"Volthor — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/volthor_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n\n <div class=\"opt-c-card\">\n <div class=\"opt-c-cover-wrap\">\n <div class=\"cover-thumb\">\n <span class=\"pdf-tag\">PDF<\/span>\n <img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/03\/TAB_Starter_batteries-1_page-0001.jpg\" alt=\"Topla Starter Batteries Catalogue cover\">\n <\/div>\n <\/div>\n <div class=\"logo-chip\"><img decoding=\"async\" src=\"https:\/\/www.tab.si\/wp-content\/uploads\/2026\/08\/topla.png\" alt=\"TOPLA logo\"><\/div>\n <h3 class=\"opt-c-name\">Topla<\/h3>\n <p class=\"opt-c-tagline\">Long service life, consistent performance.<\/p>\n <button class=\"dl-btn\" data-title=\"Topla — Starter Batteries Catalogue\" data-prefix=\"catalogs_assets\/pdfs\/topla_catalogue\">Download <span class=\"dl-icon\">↓<\/span><\/button>\n <\/div>\n <\/div>\n <\/div>\n\n <\/main>\n\n <div class=\"dl-modal-overlay\" id=\"dlOverlay\">\n <div class=\"dl-modal\" role=\"dialog\" aria-modal=\"true\" aria-labelledby=\"dlModalTitle\">\n <button class=\"dl-modal-close\" id=\"dlModalClose\" aria-label=\"Close\">×<\/button>\n <h3 class=\"dl-modal-title\" id=\"dlModalTitle\">Catalogue<\/h3>\n <p class=\"dl-modal-subtitle\">Choose a language<\/p>\n <div class=\"dl-modal-list\" id=\"dlModalList\"><\/div>\n <\/div>\n <\/div>\n\n <script>\n var LANGS = [\n {code:'en', label:'English'},\n {code:'de', label:'Deutsch'},\n {code:'si', label:'Sloven\u0161\u010dina'},\n {code:'ru', label:'\u0420\u0443\u0441\u0441\u043a\u0438\u0439'},\n {code:'el', label:'\u0395\u03bb\u03bb\u03b7\u03bd\u03b9\u03ba\u03ac'}\n ];\n\n var dlOverlay = document.getElementById('dlOverlay');\n var dlModalTitle = document.getElementById('dlModalTitle');\n var dlModalList = document.getElementById('dlModalList');\n\n function openDlModal(title, prefix){\n dlModalTitle.textContent = title;\n dlModalList.innerHTML = LANGS.map(function(l){\n return '<a class=\"dl-modal-row\" href=\"' + prefix + '_' + l.code + '.pdf\">' +\n '<span class=\"lang-name\">' + l.label + '<\/span>' +\n '<span class=\"lang-code\">' + l.code.toUpperCase() + '<\/span><\/a>';\n }).join('');\n dlOverlay.classList.add('open');\n document.body.style.overflow = 'hidden';\n }\n\n function closeDlModal(){\n dlOverlay.classList.remove('open');\n document.body.style.overflow = '';\n }\n\n document.querySelectorAll('.dl-btn').forEach(function(btn){\n btn.addEventListener('click', function(){\n openDlModal(btn.dataset.title, btn.dataset.prefix);\n });\n });\n\n document.getElementById('dlModalClose').addEventListener('click', closeDlModal);\n dlOverlay.addEventListener('click', function(e){ if (e.target === dlOverlay) closeDlModal(); });\n document.addEventListener('keydown', function(e){ if (e.key === 'Escape') closeDlModal(); });\n <\/script>\n\n<\/body>\n<\/html>\n\n","protected":false},"excerpt":{"rendered":"<p>Layout Comparison — Single Catalogue Per Brand Catalogue Section — Layout Comparison Three options for the “one catalogue per brand” case, stacked for side-by-side review. Hero, tagline banner, EcoMotion and company sections are unchanged in all three and omitted here for focus. Option A Compact Grid (current) All four brands visible at once in a […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459"}],"collection":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/comments?post=18459"}],"version-history":[{"count":4,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459\/revisions"}],"predecessor-version":[{"id":18463,"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/pages\/18459\/revisions\/18463"}],"wp:attachment":[{"href":"https:\/\/www.tab.si\/sl\/wp-json\/wp\/v2\/media?parent=18459"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}