{"id":4331,"date":"2026-08-26T06:11:03","date_gmt":"2026-08-26T05:11:03","guid":{"rendered":"https:\/\/cozmotec.ie\/staging\/7865\/?page_id=4331"},"modified":"2026-10-04T22:35:41","modified_gmt":"2026-10-04T21:35:41","slug":"business-intelligence","status":"publish","type":"page","link":"https:\/\/cozmotec.ie\/staging\/7865\/business-intelligence\/","title":{"rendered":"Business Intelligence"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"4331\" class=\"elementor elementor-4331\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-0b503c2 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"0b503c2\" 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-702ba23\" data-id=\"702ba23\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\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<section class=\"elementor-section elementor-top-section elementor-element elementor-element-d420dd9 elementor-section-full_width elementor-section-height-default elementor-section-height-default\" data-id=\"d420dd9\" 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-d09adfe\" data-id=\"d09adfe\" 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-eeafa20 elementor-widget elementor-widget-html\" data-id=\"eeafa20\" 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<!-- ==========================================================================\r\n     PRIMARY SEO METADATA & STRUCTURED DATA (100% SEARCH ENGINE COMPLIANT)\r\n     ========================================================================== -->\r\n<title>Business Intelligence | Cozmotec<\/title>\r\n<meta name=\"description\" content=\"Transform raw business data into actionable executive insights with real-time analytics dashboards.\" \/>\r\n<link rel=\"canonical\" href=\"https:\/\/cozmotec.ie\/services\/business-intelligence\/\" \/>\r\n\r\n<!-- Open Graph \/ Facebook \/ LinkedIn -->\r\n<meta property=\"og:type\" content=\"website\" \/>\r\n<meta property=\"og:url\" content=\"https:\/\/cozmotec.ie\/services\/business-intelligence\/\" \/>\r\n<meta property=\"og:title\" content=\"Business Intelligence | Cozmotec\" \/>\r\n<meta property=\"og:description\" content=\"Transform raw business data into actionable executive insights with real-time analytics dashboards.\" \/>\r\n<meta property=\"og:image\" content=\"https:\/\/framerusercontent.com\/images\/cwim7i7ZTZMxFkOzIfZtv4bA.png\" \/>\r\n<meta property=\"og:site_name\" content=\"Cozmotec\" \/>\r\n\r\n<!-- Twitter Card Meta Tags -->\r\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\r\n<meta name=\"twitter:url\" content=\"https:\/\/cozmotec.ie\/services\/business-intelligence\/\" \/>\r\n<meta name=\"twitter:title\" content=\"Business Intelligence | Cozmotec\" \/>\r\n<meta name=\"twitter:description\" content=\"Transform raw business data into actionable executive insights with real-time analytics dashboards.\" \/>\r\n<meta name=\"twitter:image\" content=\"https:\/\/framerusercontent.com\/images\/cwim7i7ZTZMxFkOzIfZtv4bA.png\" \/>\r\n\r\n<!-- Schema.org JSON-LD Structured Data -->\r\n<script type=\"application\/ld+json\">\r\n{\r\n  \"@context\": \"https:\/\/schema.org\",\r\n  \"@type\": \"Service\",\r\n  \"name\": \"Business Intelligence\",\r\n  \"provider\": {\r\n    \"@type\": \"Organization\",\r\n    \"name\": \"Cozmotec\",\r\n    \"url\": \"https:\/\/cozmotec.ie\",\r\n    \"logo\": \"https:\/\/framerusercontent.com\/images\/cwim7i7ZTZMxFkOzIfZtv4bA.png\"\r\n  },\r\n  \"description\": \"Transform raw business data into actionable executive insights with real-time analytics dashboards.\",\r\n  \"url\": \"https:\/\/cozmotec.ie\/services\/business-intelligence\/\"\r\n}\r\n<\/script>\r\n\r\n<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n  <meta charset=\"UTF-8\" \/>\r\n  <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes\" \/>\r\n  <!-- Universal High-Performance Typography (Non-Blocking Preconnects) -->\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@500;700&family=Outfit:wght@300;400;500;600;700&family=Schibsted+Grotesk:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Geist+Mono:wght@400;600;700&display=swap\" rel=\"stylesheet\">\r\n<link href=\"https:\/\/api.fontshare.com\/v2\/css?f[]=general-sans@400,500,600,700&f[]=urbanist@400,500,600&display=swap\" rel=\"stylesheet\">\r\n\r\n  <style>\r\nhtml, body {\r\n  background-color: #000000 !important;\r\n  background: #000000 !important;\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n}\r\n.cz-site-wrapper {\r\n  opacity: 1 !important;\r\n}\r\n\/* ========================================================================\r\n     1. GLOBAL BASE & RESET\r\n     ======================================================================== *\/\r\n  *, *::before, *::after {\r\n    box-sizing: border-box !important;\r\n    margin: 0;\r\n    padding: 0;\r\n  }\r\n\r\n  html, body {\r\n    background: #000000 !important;\r\n    background-color: #000000 !important;\r\n    color: #ffffff !important;\r\n    font-family: \"Schibsted Grotesk\", sans-serif !important;\r\n    font-size: 16px;\r\n    line-height: 1.6;\r\n    overflow-x: hidden !important;\r\n    width: 100%;\r\n    -webkit-font-smoothing: antialiased;\r\n    -moz-osx-font-smoothing: grayscale;\r\n  }\r\n\r\n  .czm-page-wrapper {\r\n    background: #000000 !important;\r\n    min-height: 100vh;\r\n    display: flex;\r\n    flex-direction: column;\r\n    position: relative;\r\n    z-index: 1;\r\n  }\r\n\r\n  .czm-container {\r\n    width: 100% !important;\r\n    max-width: 1240px !important;\r\n    margin: 0 auto !important;\r\n    padding: 0 24px !important;\r\n    position: relative;\r\n    z-index: 2;\r\n  }\r\n\r\n  .czm-highlight-pink {\r\n    color: #e02f7a !important;\r\n  }\r\n\r\n  \/* Pill Buttons - Hero and CTA Action Buttons *\/\r\n  .czm-btn-pill-pink {\r\n    height: 48px !important;\r\n    padding: 0 42px !important;\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: 15px !important;\r\n    font-weight: 500 !important;\r\n    background-color: #b8346c !important;\r\n    color: #ffffff !important;\r\n    border-radius: 9999px !important;\r\n    border: none !important;\r\n    cursor: pointer !important;\r\n    display: inline-flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    text-decoration: none !important;\r\n    box-shadow: 0 6px 22px rgba(184, 52, 108, 0.4) !important;\r\n    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;\r\n  }\r\n\r\n  .czm-btn-pill-pink:hover {\r\n    background-color: #c9266b !important;\r\n    box-shadow: 0 8px 28px rgba(201, 38, 107, 0.6) !important;\r\n    transform: translateY(-2px) scale(1.02) !important;\r\n  }\r\n\r\n  \/* ========================================================================\r\n     2. HERO SECTION (SCREENSHOT 1)\r\n     ======================================================================== *\/\r\n  .czm-subservice-hero-section {\r\n    padding: 120px 0 100px !important;\r\n    text-align: center !important;\r\n    position: relative !important;\r\n    background: #000000 !important;\r\n  }\r\n\r\n  .czm-subservice-hero-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: clamp(38px, 5.2vw, 68px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.12em !important;\r\n    letter-spacing: -1.8px !important;\r\n    color: #ffffff !important;\r\n    max-width: 960px !important;\r\n    margin: 0 auto 36px !important;\r\n  }\r\n\r\n  .czm-subservice-hero-btn-wrap {\r\n    display: flex !important;\r\n    justify-content: center !important;\r\n  }\r\n\r\n  \/* ========================================================================\r\n     3. SOLUTIONS OVERVIEW & 4-CARD BENTO GRID (SCREENSHOT 2)\r\n     ======================================================================== *\/\r\n  .czm-solutions-section {\r\n    padding: 80px 0 110px !important;\r\n    background: #000000 !important;\r\n    position: relative !important;\r\n  }\r\n\r\n  .czm-solutions-header {\r\n    text-align: center !important;\r\n    max-width: 900px !important;\r\n    margin: 0 auto 70px !important;\r\n  }\r\n\r\n  .czm-solutions-main-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: clamp(32px, 4vw, 50px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.15em !important;\r\n    letter-spacing: -1.2px !important;\r\n    color: #ffffff !important;\r\n    margin: 0 0 24px !important;\r\n  }\r\n\r\n  .czm-solutions-main-desc {\r\n    font-size: clamp(15.5px, 1.4vw, 17px) !important;\r\n    line-height: 1.7em !important;\r\n    color: rgba(255, 255, 255, 0.75) !important;\r\n    margin: 0 !important;\r\n  }\r\n\r\n  .czm-solutions-focus-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: clamp(28px, 3.4vw, 44px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.2em !important;\r\n    letter-spacing: -1px !important;\r\n    color: #ffffff !important;\r\n    text-align: center !important;\r\n    margin: 0 0 44px !important;\r\n  }\r\n\r\n  .czm-bento-cards-grid {\r\n    display: grid !important;\r\n    grid-template-columns: repeat(4, 1fr) !important;\r\n    gap: 22px !important;\r\n    width: 100% !important;\r\n  }\r\n\r\n  .czm-bento-card {\r\n    background: #11050a !important;\r\n    border: 1px solid rgba(201, 38, 107, 0.28) !important;\r\n    border-radius: 22px !important;\r\n    padding: 34px 28px !important;\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    justify-content: flex-start !important;\r\n    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;\r\n    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.6) !important;\r\n  }\r\n\r\n  .czm-bento-card:hover {\r\n    border-color: rgba(201, 38, 107, 0.7) !important;\r\n    transform: translateY(-4px) !important;\r\n    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.85), 0 0 24px rgba(201, 38, 107, 0.25) !important;\r\n  }\r\n\r\n  .czm-bento-card-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: 20px !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.3em !important;\r\n    color: #ffffff !important;\r\n    margin: 0 0 16px !important;\r\n  }\r\n\r\n  .czm-bento-card-desc {\r\n    font-size: 15px !important;\r\n    line-height: 1.6em !important;\r\n    color: rgba(255, 255, 255, 0.68) !important;\r\n    margin: 0 !important;\r\n  }\r\n\r\n      \/* ========================================================================\r\n     WHY CHOOSE US FOR SUCCESS (EXPANDING FEATURE CARDS WITH STARRY SPACE BG & FRONT UI MOCKUP)\r\n     ======================================================================== *\/\r\n  .czm-why-choose-section {\r\n    padding: 80px 0 120px !important;\r\n    background: #000000 !important;\r\n    position: relative !important;\r\n  }\r\n\r\n  .czm-why-choose-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: clamp(34px, 4.2vw, 52px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.15em !important;\r\n    letter-spacing: -1.2px !important;\r\n    color: #ffffff !important;\r\n    text-align: center !important;\r\n    margin: 0 auto 50px !important;\r\n  }\r\n\r\n  .exc-wrap {\r\n    width: 100% !important;\r\n    box-sizing: border-box !important;\r\n    padding: 0 !important;\r\n    background: transparent !important;\r\n  }\r\n\r\n  .exc-cards {\r\n    display: flex !important;\r\n    gap: 18px !important;\r\n    width: 100% !important;\r\n    max-width: 1200px !important;\r\n    margin: 0 auto !important;\r\n    height: 480px !important;\r\n    min-height: 480px !important;\r\n  }\r\n\r\n  .exc-card {\r\n    position: relative !important;\r\n    flex: 1 !important;\r\n    min-width: 0 !important;\r\n    background-color: #0b080c !important;\r\n    background-image: url('https:\/\/cozmotec.ie\/staging\/7865\/wp-content\/uploads\/2026\/08\/image.png') !important;\r\n    background-size: cover !important;\r\n    background-position: center !important;\r\n    background-repeat: no-repeat !important;\r\n    border: 1px solid rgba(255, 255, 255, 0.1) !important;\r\n    border-radius: 24px !important;\r\n    overflow: hidden !important;\r\n    cursor: pointer !important;\r\n    transition: flex 0.5s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.4s ease, border-color 0.35s ease, box-shadow 0.35s ease !important;\r\n    outline: none !important;\r\n    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.5) !important;\r\n  }\r\n\r\n  .exc-card::before {\r\n    content: \"\" !important;\r\n    position: absolute !important;\r\n    inset: 0 !important;\r\n    background: linear-gradient(180deg, rgba(8, 6, 10, 0.35) 0%, rgba(8, 6, 10, 0.55) 100%) !important;\r\n    z-index: 1 !important;\r\n    pointer-events: none !important;\r\n    transition: background 0.4s ease !important;\r\n  }\r\n\r\n  .exc-card:hover,\r\n  .exc-card.is-active {\r\n    border-color: #c9266b !important;\r\n    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.85), 0 0 26px rgba(201, 38, 107, 0.35) !important;\r\n  }\r\n\r\n  .exc-card.is-active {\r\n    flex: 3.2 !important;\r\n  }\r\n\r\n  .exc-card.is-active::before {\r\n    background: linear-gradient(180deg, rgba(8, 6, 10, 0.2) 0%, rgba(8, 6, 10, 0.4) 100%) !important;\r\n  }\r\n\r\n  .exc-inner {\r\n    position: absolute !important;\r\n    inset: 0 !important;\r\n    padding: 34px 30px !important;\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    justify-content: flex-start !important;\r\n    z-index: 2 !important;\r\n    overflow: hidden !important;\r\n    box-sizing: border-box !important;\r\n  }\r\n\r\n  .exc-title {\r\n    margin: 0 0 14px 0 !important;\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: 23px !important;\r\n    font-weight: 600 !important;\r\n    color: #ffffff !important;\r\n    opacity: 0.85 !important;\r\n    white-space: normal !important;\r\n    transition: opacity 0.35s ease, color 0.35s ease !important;\r\n    position: relative !important;\r\n    z-index: 3 !important;\r\n  }\r\n\r\n  .exc-card.is-active .exc-title,\r\n  .exc-card:hover .exc-title {\r\n    opacity: 1 !important;\r\n    color: #ffffff !important;\r\n  }\r\n\r\n  .exc-desc {\r\n    margin: 0 !important;\r\n    font-family: \"Schibsted Grotesk\", sans-serif !important;\r\n    font-size: 15.5px !important;\r\n    line-height: 1.6 !important;\r\n    font-weight: 400 !important;\r\n    color: rgba(255, 255, 255, 0.75) !important;\r\n    opacity: 0.8 !important;\r\n    transition: opacity 0.35s ease, color 0.35s ease !important;\r\n    max-width: 520px !important;\r\n    position: relative !important;\r\n    z-index: 3 !important;\r\n  }\r\n\r\n  .exc-card.is-active .exc-desc {\r\n    color: rgba(255, 255, 255, 0.95) !important;\r\n    opacity: 1 !important;\r\n  }\r\n\r\n  \/* Dedicated In-Front Replaceable Image Option *\/\r\n  .exc-front-img-wrap {\r\n    margin-top: auto !important;\r\n    padding-top: 18px !important;\r\n    width: 100% !important;\r\n    max-width: 580px !important;\r\n    display: flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    opacity: 0 !important;\r\n    transform: translateY(16px) scale(0.98) !important;\r\n    transition: opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1), transform 0.45s cubic-bezier(0.16, 1, 0.3, 1) !important;\r\n    pointer-events: none !important;\r\n    position: relative !important;\r\n    z-index: 3 !important;\r\n  }\r\n\r\n  .exc-card.is-active .exc-front-img-wrap {\r\n    opacity: 1 !important;\r\n    transform: translateY(0) scale(1) !important;\r\n    pointer-events: auto !important;\r\n  }\r\n\r\n  .exc-front-img {\r\n    width: 100% !important;\r\n    height: auto !important;\r\n    max-height: 270px !important;\r\n    object-fit: contain !important;\r\n    object-position: center bottom !important;\r\n    display: block !important;\r\n    border-radius: 14px !important;\r\n    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.65) !important;\r\n    border: 1px solid rgba(255, 255, 255, 0.08) !important;\r\n  }\r\n\r\n\/* ========================================================================\r\n     5. FULL-WIDTH BOTTOM CTA BANNER (Cream \/ Clay Background - Match About Page)\r\n     ======================================================================== *\/\r\n  section.czm-fullwidth-cta-section,\r\n  .czm-fullwidth-cta-section {\r\n    position: relative !important;\r\n    padding: 130px 0 !important;\r\n    overflow: visible !important;\r\n    background-color: #e7dcd5 !important;\r\n    background: #e7dcd5 !important;\r\n    color: #160b0b !important;\r\n    text-align: center !important;\r\n    width: 100vw !important;\r\n    max-width: 100vw !important;\r\n    left: 50% !important;\r\n    right: 50% !important;\r\n    margin-left: -50vw !important;\r\n    margin-right: -50vw !important;\r\n    box-shadow: 0 0 0 100vmax #e7dcd5 !important;\r\n    clip-path: inset(0 -100vmax) !important;\r\n    box-sizing: border-box !important;\r\n    border-top: 1px solid #d3c4bc !important;\r\n    border-bottom: 1px solid #d3c4bc !important;\r\n  }\r\n\r\n  section.czm-fullwidth-cta-section::before,\r\n  .czm-fullwidth-cta-section::before {\r\n    content: \"\" !important;\r\n    position: absolute !important;\r\n    top: 0 !important;\r\n    bottom: 0 !important;\r\n    left: 50% !important;\r\n    right: 50% !important;\r\n    width: 100vw !important;\r\n    margin-left: -50vw !important;\r\n    margin-right: -50vw !important;\r\n    background-color: #e7dcd5 !important;\r\n    background: #e7dcd5 !important;\r\n    z-index: 0 !important;\r\n    pointer-events: none !important;\r\n  }\r\n\r\n  #gradient-motion-bg-cta,\r\n  .czm-fullwidth-cta-section .czm-gradient-motion-bg {\r\n    display: none !important;\r\n    visibility: hidden !important;\r\n    opacity: 0 !important;\r\n    pointer-events: none !important;\r\n  }\r\n\r\n  .czm-fullwidth-cta-container {\r\n    position: relative !important;\r\n    z-index: 2 !important;\r\n    max-width: 800px !important;\r\n    margin: 0 auto !important;\r\n    padding: 0 24px !important;\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    align-items: center !important;\r\n  }\r\n\r\n  .czm-cta-banner-title {\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Segoe UI\",\r\n      Roboto,\r\n      sans-serif !important;\r\n    font-size: clamp(38px, 4.5vw, 60px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.12em !important;\r\n    letter-spacing: -1.8px !important;\r\n    color: #160b0b !important;\r\n    margin: 0 0 20px !important;\r\n  }\r\n\r\n  .czm-cta-banner-subtitle {\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Segoe UI\",\r\n      Roboto,\r\n      sans-serif !important;\r\n    font-size: 18px !important;\r\n    font-weight: 400 !important;\r\n    line-height: 1.55em !important;\r\n    color: #6b5d58 !important;\r\n    margin: 0 0 36px !important;\r\n  }\r\n\r\n  .czm-btn-cta-pink {\r\n    display: inline-flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    height: 48px !important;\r\n    padding: 0 42px !important;\r\n    font-size: 15px !important;\r\n    font-weight: 600 !important;\r\n    background-color: #c9266b !important;\r\n    color: #ffffff !important;\r\n    border-radius: 9999px !important;\r\n    text-decoration: none !important;\r\n    box-shadow: 0 4px 18px rgba(201, 38, 107, 0.28) !important;\r\n    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;\r\n  }\r\n\r\n  .czm-btn-cta-pink:hover {\r\n    background-color: #b01f5c !important;\r\n    color: #ffffff !important;\r\n    transform: translateY(-2px) !important;\r\n    box-shadow: 0 8px 25px rgba(201, 38, 107, 0.45) !important;\r\n  }\r\n\r\n  \/* ========================================================================\r\n     6. CONTACT DETAILS & DIRECT QUERY FORM (EXACT BUTTON-ONLY HOVER EFFECT)\r\n     ======================================================================== *\/\r\n  .czm-about-query-section {\r\n    padding: 100px 0 120px !important;\r\n    position: relative !important;\r\n    background: #000000 !important;\r\n    overflow: hidden !important;\r\n  }\r\n\r\n  .czm-about-query-ambient-glow {\r\n    position: absolute !important;\r\n    bottom: 0 !important;\r\n    right: 15% !important;\r\n    width: 600px !important;\r\n    height: 400px !important;\r\n    background: radial-gradient(\r\n      ellipse at center,\r\n      rgba(201, 38, 107, 0.15) 0%,\r\n      transparent 70%\r\n    ) !important;\r\n    filter: blur(90px) !important;\r\n    pointer-events: none !important;\r\n    z-index: 1 !important;\r\n  }\r\n\r\n  .czm-about-query-layout {\r\n    display: grid !important;\r\n    grid-template-columns: 1fr 1.1fr !important;\r\n    gap: 60px !important;\r\n    align-items: center !important;\r\n    max-width: 1100px !important;\r\n    margin: 0 auto !important;\r\n    position: relative !important;\r\n    z-index: 2 !important;\r\n  }\r\n\r\n  .czm-query-sec-title {\r\n    font-family: \"Outfit\", sans-serif !important;\r\n    font-size: clamp(34px, 4vw, 48px) !important;\r\n    font-weight: 600 !important;\r\n    line-height: 1.15em !important;\r\n    letter-spacing: -1.5px !important;\r\n    color: #ffffff !important;\r\n    margin: 0 0 16px !important;\r\n  }\r\n\r\n  .czm-query-sec-subtitle {\r\n    font-size: 16.5px !important;\r\n    line-height: 1.55em !important;\r\n    color: rgba(255, 255, 255, 0.65) !important;\r\n    margin: 0 0 36px !important;\r\n    max-width: 440px !important;\r\n  }\r\n\r\n  .czm-about-contact-items {\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    gap: 16px !important;\r\n  }\r\n\r\n  .czm-about-contact-row {\r\n    display: inline-flex !important;\r\n    align-items: center !important;\r\n    gap: 14px !important;\r\n    color: rgba(255, 255, 255, 0.8) !important;\r\n    text-decoration: none !important;\r\n    font-size: 16px !important;\r\n    font-weight: 500 !important;\r\n    transition: color 0.25s ease !important;\r\n  }\r\n\r\n  .czm-about-contact-row:hover {\r\n    color: #c9266b !important;\r\n  }\r\n\r\n  .czm-about-contact-icon {\r\n    width: 38px !important;\r\n    height: 38px !important;\r\n    border-radius: 50% !important;\r\n    background: rgba(255, 255, 255, 0.05) !important;\r\n    border: 1px solid rgba(255, 255, 255, 0.1) !important;\r\n    display: flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    color: #c9266b !important;\r\n    flex-shrink: 0 !important;\r\n    transition: all 0.25s ease !important;\r\n  }\r\n\r\n  .czm-about-contact-row:hover .czm-about-contact-icon {\r\n    background: #c9266b !important;\r\n    color: #ffffff !important;\r\n    box-shadow: 0 0 14px rgba(201, 38, 107, 0.5) !important;\r\n  }\r\n\r\n    .czm-about-query-card {\r\n    padding: 38px 36px !important;\r\n    background-color: #f1e8e2 !important;\r\n    background: #f1e8e2 !important;\r\n    border: 1px solid rgba(201, 38, 107, 0.28) !important;\r\n    border-radius: 26px !important;\r\n    box-shadow:\r\n      0 16px 40px rgba(0, 0, 0, 0.35),\r\n      0 0 24px rgba(201, 38, 107, 0.08) !important;\r\n  }\r\n\r\n  .czm-about-form {\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    gap: 18px !important;\r\n  }\r\n\r\n  .czm-aform-field {\r\n    display: flex !important;\r\n    flex-direction: column !important;\r\n    gap: 8px !important;\r\n  }\r\n\r\n  .czm-aform-label {\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Helvetica Neue\",\r\n      Helvetica,\r\n      Arial,\r\n      sans-serif !important;\r\n    font-size: 13.5px !important;\r\n    font-weight: 500 !important;\r\n    color: #374151 !important;\r\n    text-transform: none !important;\r\n  }\r\n\r\n  .czm-aform-input,\r\n  .czm-aform-textarea {\r\n    width: 100% !important;\r\n    background-color: #ffffff !important;\r\n    border: 1px solid rgba(201, 38, 107, 0.2) !important;\r\n    border-radius: 12px !important;\r\n    padding: 14px 18px !important;\r\n    font-size: 14.5px !important;\r\n    color: #111111 !important;\r\n    outline: none !important;\r\n    margin: 0 !important;\r\n    box-sizing: border-box !important;\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Helvetica Neue\",\r\n      Helvetica,\r\n      Arial,\r\n      sans-serif !important;\r\n    transition:\r\n      background-color 0.2s ease,\r\n      border-color 0.2s ease,\r\n      box-shadow 0.2s ease !important;\r\n  }\r\n\r\n  .czm-aform-input::placeholder,\r\n  .czm-aform-textarea::placeholder {\r\n    color: #9ca3af !important;\r\n    opacity: 1 !important;\r\n  }\r\n\r\n  .czm-aform-input:focus,\r\n  .czm-aform-textarea:focus {\r\n    border-color: #c9266b !important;\r\n    background-color: #ffffff !important;\r\n    box-shadow: 0 0 0 3px rgba(201, 38, 107, 0.15) !important;\r\n  }\r\n\r\n  \/* Submit button matching About page form *\/\r\n  .czm-about-form button.czm-query-submit-btn,\r\n  .czm-about-form button.czm-btn-submit,\r\n  .czm-about-form button[type=\"submit\"],\r\n  button.czm-query-submit-btn,\r\n  button.czm-btn-submit {\r\n    display: flex !important;\r\n    align-items: center !important;\r\n    justify-content: center !important;\r\n    width: 100% !important;\r\n    height: 48px !important;\r\n    background-color: #b1386a !important;\r\n    background: #b1386a !important;\r\n    color: #ffffff !important;\r\n    border: none !important;\r\n    border-radius: 10px !important;\r\n    padding: 13px 24px !important;\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Helvetica Neue\",\r\n      Helvetica,\r\n      Arial,\r\n      sans-serif !important;\r\n    font-size: 15px !important;\r\n    font-weight: 600 !important;\r\n    cursor: pointer !important;\r\n    margin-top: 10px !important;\r\n    box-shadow: 0 4px 14px rgba(177, 56, 106, 0.25) !important;\r\n    opacity: 1 !important;\r\n    visibility: visible !important;\r\n    transition:\r\n      background-color 0.2s ease,\r\n      transform 0.2s ease,\r\n      box-shadow 0.2s ease !important;\r\n  }\r\n\r\n  .czm-about-form button.czm-query-submit-btn span,\r\n  .czm-about-form button.czm-btn-submit span,\r\n  .czm-about-form button[type=\"submit\"] span,\r\n  button.czm-query-submit-btn span,\r\n  button.czm-btn-submit span {\r\n    color: #ffffff !important;\r\n    font-family:\r\n      \"Schibsted Grotesk\",\r\n      -apple-system,\r\n      BlinkMacSystemFont,\r\n      \"Helvetica Neue\",\r\n      Helvetica,\r\n      Arial,\r\n      sans-serif !important;\r\n    font-size: 15px !important;\r\n    font-weight: 600 !important;\r\n    display: inline-block !important;\r\n    opacity: 1 !important;\r\n    visibility: visible !important;\r\n  }\r\n\r\n  .czm-about-form button.czm-query-submit-btn:hover,\r\n  .czm-about-form button.czm-btn-submit:hover,\r\n  .czm-about-form button[type=\"submit\"]:hover,\r\n  button.czm-query-submit-btn:hover,\r\n  button.czm-btn-submit:hover {\r\n    background-color: #9b2859 !important;\r\n    background: #9b2859 !important;\r\n    transform: translateY(-1px) !important;\r\n    box-shadow: 0 6px 18px rgba(177, 56, 106, 0.35) !important;\r\n    color: #ffffff !important;\r\n  }\r\n\r\n  \/* ========================================================================\r\n     7. RESPONSIVE BREAKPOINTS\r\n     ======================================================================== *\/\r\n  @media (max-width: 1024px) {\r\n    .czm-bento-cards-grid {\r\n      grid-template-columns: repeat(2, 1fr) !important;\r\n    }\r\n    .exc-cards { height: auto !important; min-height: auto !important; flex-wrap: wrap !important; }\r\n    .exc-card {\r\n      flex: 1 1 calc(50% - 8px) !important;\r\n      height: 280px !important;\r\n    }\r\n    .exc-card.is-active {\r\n      flex: 1 1 calc(50% - 8px) !important;\r\n    }\r\n    .czm-about-query-layout {\r\n      grid-template-columns: 1fr !important;\r\n      gap: 48px !important;\r\n    }\r\n  }\r\n\r\n  @media (max-width: 768px) {\r\n    .czm-subservice-hero-section {\r\n      padding: 100px 0 60px !important;\r\n    }\r\n    .czm-bento-cards-grid {\r\n      grid-template-columns: 1fr !important;\r\n    }\r\n    .exc-wrap {\r\n      padding: 0 !important;\r\n    }\r\n    .exc-cards {\r\n      flex-direction: column !important;\r\n      height: auto !important;\r\n      gap: 12px !important;\r\n    }\r\n    .exc-card {\r\n      flex: none !important;\r\n      width: 100% !important;\r\n      height: 72px !important;\r\n      transition: height 0.4s ease, background 0.4s ease !important;\r\n    }\r\n    .exc-card.is-active {\r\n      height: 200px !important;\r\n    }\r\n    .exc-title {\r\n      font-size: 19px !important;\r\n      white-space: normal !important;\r\n    }\r\n    .czm-about-query-card {\r\n      padding: 30px 24px !important;\r\n    }\r\n  }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n  <div class=\"cz-site-wrapper\" style=\"opacity: 0; transition: opacity 0.15s ease-in;\">\r\n<div class=\"czm-page-wrapper\">\r\n    <!-- 1. SECTION 1: HERO (SCREENSHOT 1) -->\r\n    <section class=\"czm-subservice-hero-section\">\r\n      <div class=\"czm-container\">\r\n        <h1 class=\"czm-subservice-hero-title\">Actionable Intelligence In Real Time<\/h1>\r\n        <div class=\"czm-subservice-hero-btn-wrap\">\r\n          <a href=\"https:\/\/cozmotec.ie\/staging\/7865\/contact-us\/\" class=\"czm-btn-pill-pink\">\r\n            <span>Book a call<\/span>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 2. SECTION 2: SOLUTIONS OVERVIEW & 4-CARD BENTO GRID (SCREENSHOT 2) -->\r\n    <section class=\"czm-solutions-section\">\r\n      <div class=\"czm-container\">\r\n        <div class=\"czm-solutions-header\">\r\n          <h2 class=\"czm-solutions-main-title\">Our Business Intelligence Solutions<\/h2>\r\n          <p class=\"czm-solutions-main-desc\">Unlock the true value of your business data. Cozmotec designs automated data warehouses, pipeline aggregators, and executive-level visualization dashboards that present real-time key performance indicators, operational throughput, and revenue forecasts in one crystal-clear screen.<\/p>\r\n        <\/div>\r\n\r\n        <h3 class=\"czm-solutions-focus-title\">Analytics & Business Intelligence<\/h3>\r\n\r\n        <div class=\"czm-bento-cards-grid\">\r\n        <div class=\"czm-bento-card czm-glass-card\">\r\n          <h3 class=\"czm-bento-card-title\">Executive KPI Dashboards<\/h3>\r\n          <p class=\"czm-bento-card-desc\">Real-time interactive command centers that display operational metrics, revenue, and SLA performance.<\/p>\r\n        <\/div>\r\n        <div class=\"czm-bento-card czm-glass-card\">\r\n          <h3 class=\"czm-bento-card-title\">Automated Data Pipelines<\/h3>\r\n          <p class=\"czm-bento-card-desc\">Continuous ETL extraction and warehousing that combines disparate data sources into a single source of truth.<\/p>\r\n        <\/div>\r\n        <div class=\"czm-bento-card czm-glass-card\">\r\n          <h3 class=\"czm-bento-card-title\">Custom Reporting Engines<\/h3>\r\n          <p class=\"czm-bento-card-desc\">Automated weekly and monthly reports delivered directly to stakeholder email and Slack channels.<\/p>\r\n        <\/div>\r\n        <div class=\"czm-bento-card czm-glass-card\">\r\n          <h3 class=\"czm-bento-card-title\">Predictive Trend Analysis<\/h3>\r\n          <p class=\"czm-bento-card-desc\">Machine learning analytics that spot seasonal anomalies, customer churn risks, and capacity bottlenecks early.<\/p>\r\n        <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 3. SECTION 3: WHY CHOOSE US EXPANDING CARDS ACCORDION (SCREENSHOT 3 + USER CODE) -->\r\n            <section class=\"czm-why-choose-section\" id=\"why-choose-us\">\r\n      <div class=\"czm-container\">\r\n        <h2 class=\"czm-why-choose-title\">Why Choose Us for <span class=\"czm-highlight-pink\">Success<\/span>?<\/h2>\r\n\r\n        <div class=\"exc-wrap\">\r\n          <div class=\"exc-cards\" id=\"excCards\">\r\n            <!-- Card 1: Custom Solutions -->\r\n            <div class=\"exc-card is-active\" tabindex=\"0\">\r\n              <div class=\"exc-inner\">\r\n                <h3 class=\"exc-title\">Custom Solutions<\/h3>\r\n                <p class=\"exc-desc\">Tailored technology built around your unique business goals and requirements.<\/p>\r\n                <div class=\"exc-front-img-wrap\">\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/cozmotec.ie\/staging\/7865\/wp-content\/uploads\/2026\/08\/Frame-152.png\"\r\n                    alt=\"Custom Solutions Preview\"\r\n                    class=\"exc-front-img\"\r\n                    loading=\"lazy\"\r\n                  \/>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <!-- Card 2: Seamless Experiences -->\r\n            <div class=\"exc-card\" tabindex=\"0\">\r\n              <div class=\"exc-inner\">\r\n                <h3 class=\"exc-title\">Seamless Experiences<\/h3>\r\n                <p class=\"exc-desc\">Responsive solutions that work smoothly across devices, platforms, and environments.<\/p>\r\n                <div class=\"exc-front-img-wrap\">\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/cozmotec.ie\/staging\/7865\/wp-content\/uploads\/2026\/08\/Frame-153.png\"\r\n                    alt=\"Seamless Experiences Preview\"\r\n                    class=\"exc-front-img\"\r\n                    loading=\"lazy\"\r\n                  \/>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <!-- Card 3: Conversion Driven -->\r\n            <div class=\"exc-card\" tabindex=\"0\">\r\n              <div class=\"exc-inner\">\r\n                <h3 class=\"exc-title\">Conversion Driven<\/h3>\r\n                <p class=\"exc-desc\">Digital experiences designed to engage audiences and turn visits into opportunities.<\/p>\r\n                <div class=\"exc-front-img-wrap\">\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/cozmotec.ie\/staging\/7865\/wp-content\/uploads\/2026\/08\/Frame-154.png\"\r\n                    alt=\"Conversion Driven Preview\"\r\n                    class=\"exc-front-img\"\r\n                    loading=\"lazy\"\r\n                  \/>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n\r\n            <!-- Card 4: Expert Team -->\r\n            <div class=\"exc-card\" tabindex=\"0\">\r\n              <div class=\"exc-inner\">\r\n                <h3 class=\"exc-title\">Expert Team<\/h3>\r\n                <p class=\"exc-desc\">Experienced designers and developers delivering quality, functionality, and technical expertise.<\/p>\r\n                <div class=\"exc-front-img-wrap\">\r\n                  <img decoding=\"async\"\r\n                    src=\"https:\/\/cozmotec.ie\/staging\/7865\/wp-content\/uploads\/2026\/08\/Frame-155.png\"\r\n                    alt=\"Expert Team Preview\"\r\n                    class=\"exc-front-img\"\r\n                    loading=\"lazy\"\r\n                  \/>\r\n                <\/div>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- 4. SECTION 4: FULL-WIDTH BOTTOM CTA BANNER (Cream \/ Clay Background - Match About Page) -->\r\n    <section class=\"czm-full-bleed czm-fullwidth-cta-section\" id=\"cta\">\r\n      <div class=\"czm-container czm-fullwidth-cta-container\">\r\n        <h2 class=\"czm-cta-banner-title\">\r\n          Let\u2019s talk about<br \/>your next big move\r\n        <\/h2>\r\n\r\n        <p class=\"czm-cta-banner-subtitle\">\r\n          Hop on a call with us to see how our<br \/>services can accelerate your\r\n          growth.\r\n        <\/p>\r\n\r\n        <div class=\"czm-cta-banner-btn-wrap\">\r\n          <a\r\n            href=\"https:\/\/cozmotec.ie\/staging\/7865\/contact-us\/\"\r\n            class=\"czm-btn-pill-pink czm-btn-cta-pink\"\r\n          >\r\n            <span>Book a call<\/span>\r\n          <\/a>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <!-- Active Elementor Full-Bleed Ancestor Unclip Guard -->\r\n      <script>\r\n        (function initCtaFullBleed() {\r\n          function unclipCta() {\r\n            var cta = document.getElementById(\"cta\");\r\n            if (!cta) return;\r\n            var el = cta.parentElement;\r\n            while (el && el !== document.documentElement) {\r\n              var s = window.getComputedStyle(el);\r\n              if (s.overflow === \"hidden\" || s.overflowX === \"hidden\") {\r\n                el.style.setProperty(\"overflow\", \"visible\", \"important\");\r\n                el.style.setProperty(\"overflow-x\", \"visible\", \"important\");\r\n              }\r\n              if (\r\n                el.classList.contains(\"elementor-container\") ||\r\n                el.classList.contains(\"e-con-inner\") ||\r\n                el.classList.contains(\"e-con\") ||\r\n                el.classList.contains(\"elementor-widget-container\") ||\r\n                el.classList.contains(\"elementor-widget-wrap\")\r\n              ) {\r\n                el.style.setProperty(\"padding-left\", \"0px\", \"important\");\r\n                el.style.setProperty(\"padding-right\", \"0px\", \"important\");\r\n                el.style.setProperty(\"max-width\", \"100%\", \"important\");\r\n              }\r\n              el = el.parentElement;\r\n            }\r\n          }\r\n          if (document.readyState === \"loading\") {\r\n            document.addEventListener(\"DOMContentLoaded\", unclipCta);\r\n          } else {\r\n            unclipCta();\r\n          }\r\n          window.addEventListener(\"resize\", unclipCta);\r\n          setTimeout(unclipCta, 50);\r\n          setTimeout(unclipCta, 250);\r\n        })();\r\n      <\/script>\r\n    <\/section>\r\n\r\n    <!-- 5. SECTION 5: CONTACT DETAILS & DIRECT QUERY FORM (EXACT MATCH ABOUT\/CASE STUDIES) -->\r\n    <section class=\"czm-section czm-about-query-section\" id=\"contact-queries\">\r\n      <div class=\"czm-about-query-ambient-glow\" aria-hidden=\"true\"><\/div>\r\n\r\n      <div class=\"czm-container\">\r\n        <div class=\"czm-about-query-layout\">\r\n          <!-- Left Side: Heading & Contact Info -->\r\n          <div class=\"czm-about-query-left\">\r\n            <h2 class=\"czm-query-sec-title\">\r\n              Ask whatever you<br \/>have in your mind\r\n            <\/h2>\r\n            <p class=\"czm-query-sec-subtitle\">\r\n              Whether you have questions or are ready to discuss your business,\r\n              we\u2019re here to help. Reach out today.\r\n            <\/p>\r\n\r\n            <div class=\"czm-about-contact-items\">\r\n              <a href=\"mailto:info@cozmotec.ie\" class=\"czm-about-contact-row\">\r\n                <div class=\"czm-about-contact-icon\">\r\n                  <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                    <path d=\"M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z\"><\/path>\r\n                    <polyline points=\"22,6 12,13 2,6\"><\/polyline>\r\n                  <\/svg>\r\n                <\/div>\r\n                <span class=\"czm-about-contact-val\">info@cozmotec.ie<\/span>\r\n              <\/a>\r\n\r\n              <a href=\"https:\/\/cozmotec.ie\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"czm-about-contact-row\">\r\n                <div class=\"czm-about-contact-icon\">\r\n                  <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                    <circle cx=\"12\" cy=\"12\" r=\"10\"><\/circle>\r\n                    <line x1=\"2\" y1=\"12\" x2=\"22\" y2=\"12\"><\/line>\r\n                    <path d=\"M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z\"><\/path>\r\n                  <\/svg>\r\n                <\/div>\r\n                <span class=\"czm-about-contact-val\">cozmotec.ie<\/span>\r\n              <\/a>\r\n\r\n              <div class=\"czm-about-contact-row\">\r\n                <div class=\"czm-about-contact-icon\">\r\n                  <svg viewBox=\"0 0 24 24\" width=\"18\" height=\"18\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n                    <path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"><\/path>\r\n                    <circle cx=\"12\" cy=\"10\" r=\"3\"><\/circle>\r\n                  <\/svg>\r\n                <\/div>\r\n                <span class=\"czm-about-contact-val\">Dublin, Ireland<\/span>\r\n              <\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Right Side: Contact Query Form -->\r\n          <div class=\"czm-about-query-right\">\r\n            <div class=\"czm-about-query-card\" style=\"background-color: #f1e8e2 !important; background: #f1e8e2 !important; border: 1px solid rgba(201, 38, 107, 0.28) !important;\">\r\n              <form class=\"czm-about-form\" id=\"czm-about-query-form\" method=\"POST\" onsubmit=\"handleCozmotecFormSubmit(event)\">\r\n                <input type=\"hidden\" name=\"service\" value=\"Actionable Intelligence In Real Time\" \/>\r\n\r\n                <div class=\"czm-aform-field\">\r\n                  <label class=\"czm-aform-label\" for=\"czm-ab-name\">Name<\/label>\r\n                  <input type=\"text\" id=\"czm-ab-name\" name=\"name\" class=\"czm-aform-input\" placeholder=\"Jane Smith\" required \/>\r\n                <\/div>\r\n\r\n                <div class=\"czm-aform-field\">\r\n                  <label class=\"czm-aform-label\" for=\"czm-ab-email\">Email<\/label>\r\n                  <input type=\"email\" id=\"czm-ab-email\" name=\"email\" class=\"czm-aform-input\" placeholder=\"jane@framer.com\" required \/>\r\n                <\/div>\r\n\r\n                <div class=\"czm-aform-field\">\r\n                  <label class=\"czm-aform-label\" for=\"czm-ab-msg\">Message<\/label>\r\n                  <textarea id=\"czm-ab-msg\" name=\"message\" class=\"czm-aform-textarea\" rows=\"4\" placeholder=\"Hi, I am reaching out for...\" required><\/textarea>\r\n                <\/div>\r\n\r\n                <button\r\n                  type=\"submit\"\r\n                  class=\"czm-query-submit-btn czm-btn-full\"\r\n                  style=\"\r\n                    display: flex !important;\r\n                    align-items: center !important;\r\n                    justify-content: center !important;\r\n                    width: 100% !important;\r\n                    height: 48px !important;\r\n                    background-color: #b1386a !important;\r\n                    background: #b1386a !important;\r\n                    color: #ffffff !important;\r\n                    border: none !important;\r\n                    border-radius: 10px !important;\r\n                    padding: 13px 24px !important;\r\n                    font-family:\r\n                      &quot;Schibsted Grotesk&quot;,\r\n                      -apple-system,\r\n                      BlinkMacSystemFont,\r\n                      &quot;Helvetica Neue&quot;,\r\n                      Helvetica,\r\n                      Arial,\r\n                      sans-serif !important;\r\n                    font-size: 15px !important;\r\n                    font-weight: 600 !important;\r\n                    cursor: pointer !important;\r\n                    margin-top: 10px !important;\r\n                    box-shadow: 0 4px 14px rgba(177, 56, 106, 0.25) !important;\r\n                    opacity: 1 !important;\r\n                    visibility: visible !important;\r\n                  \"\r\n                >\r\n                  <span style=\"color: #ffffff !important; font-weight: 600 !important; opacity: 1 !important; visibility: visible !important;\">Submit<\/span>\r\n                <\/button>\r\n              <\/form>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n  <\/div>\r\n\r\n  <!-- Interactive Scripts -->\r\n  <script>\r\n  \/\/ 1. Expanding Feature Cards Animation Engine\r\n  (function(){\r\n    var cards = document.querySelectorAll('#excCards .exc-card');\r\n    if (!cards.length) return;\r\n\r\n    function activate(card){\r\n      cards.forEach(function(c){ c.classList.remove('is-active'); });\r\n      card.classList.add('is-active');\r\n    }\r\n\r\n    cards.forEach(function(card){\r\n      card.addEventListener('mouseenter', function(){ activate(card); });\r\n      card.addEventListener('click', function(){ activate(card); });\r\n      card.addEventListener('focus', function(){ activate(card); });\r\n      card.addEventListener('keydown', function(e){\r\n        if(e.key === 'Enter' || e.key === ' '){\r\n          e.preventDefault();\r\n          activate(card);\r\n        }\r\n      });\r\n    });\r\n  })();\r\n  <\/script>\r\n\r\n  <!-- ========================================================================\r\n       SHADER GRADIENT \u2014 VANILLA ESM \/ WORDPRESS GPU SHADER INTEGRATION\r\n       ======================================================================== -->\r\n  <!--\r\n  SHADER GRADIENT \u2014 vanilla ESM \/ WordPress version\r\n  ==============================================================\r\n-->\r\n<script type=\"importmap\">\r\n  {\r\n    \"imports\": {\r\n      \"react\": \"https:\/\/esm.sh\/react@18.3.1\",\r\n      \"react-dom\/client\": \"https:\/\/esm.sh\/react-dom@18.3.1\/client\",\r\n      \"three\": \"https:\/\/esm.sh\/three@0.160.0\",\r\n      \"three-stdlib\": \"https:\/\/esm.sh\/three-stdlib@2.29.6?deps=three@0.160.0\",\r\n      \"camera-controls\": \"https:\/\/esm.sh\/camera-controls@2.9.0?deps=three@0.160.0\",\r\n      \"@react-three\/fiber\": \"https:\/\/esm.sh\/@react-three\/fiber@8?deps=react@18.3.1,three@0.160.0\",\r\n      \"@shadergradient\/react\": \"https:\/\/esm.sh\/@shadergradient\/react@2?deps=react@18.3.1,three@0.160.0,@react-three\/fiber@8,three-stdlib@2.29.6,camera-controls@2.9.0\"\r\n    }\r\n  }\r\n<\/script>\r\n\r\n<script type=\"module\">\r\n  import React from \"react\";\r\n  import { createRoot } from \"react-dom\/client\";\r\n  import { ShaderGradientCanvas, ShaderGradient } from \"@shadergradient\/react\";\r\n\r\n  \/\/ ============================================================\r\n  \/\/ CONFIG \u2014 this is your pasted JSX, translated to plain values.\r\n  \/\/ Edit these instead of editing JSX props.\r\n  \/\/ ============================================================\r\n\r\n  \/\/ Props that control the <ShaderGradientCanvas> wrapper (the\r\n  \/\/ original Framer component also exposed these separately).\r\n  var CANVAS_CONFIG = {\r\n    pointerEvents: \"none\",\r\n    lazyLoad: false,\r\n    threshold: 0.1,\r\n    pixelDensity: 1,\r\n  };\r\n\r\n  \/\/ Props for the gradient itself \u2014 exactly what you provided.\r\n  var GRADIENT_CONFIG = {\r\n    animate: \"on\",\r\n    axesHelper: \"off\", \/\/ \"Axis: -\" in your panel = off\r\n    bgColor1: \"#000000\",\r\n    bgColor2: \"#000000\",\r\n    brightness: 0.3,\r\n    cAzimuthAngle: 210,\r\n    cDistance: 1.6,\r\n    cPolarAngle: 100,\r\n    cameraZoom: 1.4,\r\n    color1: \"#B01F5C\",\r\n    color2: \"#C9266B\",\r\n    color3: \"#000000\",\r\n    destination: \"onCanvas\",\r\n    embedMode: \"off\",\r\n    envPreset: \"city\",\r\n    format: \"gif\",\r\n    fov: 40,\r\n    frameRate: 10,\r\n    gizmoHelper: \"hide\",\r\n    grain: \"off\",\r\n    lightType: \"3d\",\r\n    pixelDensity: 1,\r\n    positionX: 1.3,\r\n    positionY: 2.1,\r\n    positionZ: 0.7,\r\n    range: \"disabled\",\r\n    rangeEnd: 40,\r\n    rangeStart: 0,\r\n    reflection: 0.1,\r\n    rotationX: -155,\r\n    rotationY: 340,\r\n    rotationZ: 220,\r\n    shader: \"defaults\",\r\n    type: \"waterPlane\",\r\n    uAmplitude: 0,\r\n    uDensity: 3.4,\r\n    uFrequency: 1.2,\r\n    uSpeed: 0.1,\r\n    uStrength: 2.4,\r\n    uTime: 0.2,\r\n    wireframe: false,\r\n  };\r\n\r\n  function init() {\r\n    var mounts = document.querySelectorAll(\r\n      \"#shader-gradient-root, #gradient-motion-bg, #gradient-motion-bg-cta, .czm-gradient-motion-bg\"\r\n    );\r\n    if (!mounts.length) return;\r\n\r\n    mounts.forEach(function (mount) {\r\n      if (mount.dataset.shaderInitialized) return;\r\n      mount.dataset.shaderInitialized = \"true\";\r\n      mount.innerHTML = \"\";\r\n      try {\r\n        var root = createRoot(mount);\r\n        root.render(\r\n          React.createElement(\r\n            ShaderGradientCanvas,\r\n            CANVAS_CONFIG,\r\n            React.createElement(ShaderGradient, GRADIENT_CONFIG)\r\n          )\r\n        );\r\n      } catch (err) {\r\n        console.warn(\"ShaderGradient initialization warning:\", err);\r\n      }\r\n    });\r\n  }\r\n\r\n  if (document.readyState === \"loading\") {\r\n    document.addEventListener(\"DOMContentLoaded\", init);\r\n  } else {\r\n    init();\r\n  }\r\n<\/script>\r\n\r\n  <!-- ========================================================================\r\n       ASYNCHRONOUS AJAX FORM SUBMIT HANDLER & REST API INTEGRATION\r\n       ======================================================================== -->\r\n  <script>\r\n    function handleCozmotecFormSubmit(event) {\r\n      event.preventDefault();\r\n      const form = event.target;\r\n      const submitBtn = form.querySelector('button[type=\"submit\"]');\r\n      const submitBtnSpan = submitBtn ? submitBtn.querySelector(\"span\") : null;\r\n      const originalBtnText = submitBtnSpan\r\n        ? submitBtnSpan.textContent\r\n        : submitBtn\r\n          ? submitBtn.textContent\r\n          : \"Submit\";\r\n\r\n      const existingError = form.querySelector(\".czm-form-error-msg\");\r\n      if (existingError) {\r\n        existingError.remove();\r\n      }\r\n\r\n      const formData = new FormData(form);\r\n      const data = {\r\n        name: (formData.get(\"name\") || \"\").trim(),\r\n        email: (formData.get(\"email\") || \"\").trim(),\r\n        service: (formData.get(\"service\") || \"\").trim() || \"Actionable Intelligence In Real Time\",\r\n        message: (formData.get(\"message\") || \"\").trim(),\r\n      };\r\n\r\n      if (submitBtn) {\r\n        submitBtn.disabled = true;\r\n        if (submitBtnSpan) {\r\n          submitBtnSpan.textContent = \"Sending...\";\r\n        } else {\r\n          submitBtn.textContent = \"Sending...\";\r\n        }\r\n      }\r\n\r\n      const endpoint = `${window.location.origin}${window.location.pathname.startsWith(\"\/staging\/7865\") ? \"\/staging\/7865\" : \"\"}\/wp-json\/cozmotec\/v1\/contact`;\r\n\r\n      fetch(endpoint, {\r\n        method: \"POST\",\r\n        headers: {\r\n          \"Content-Type\": \"application\/json\",\r\n          Accept: \"application\/json\",\r\n        },\r\n        body: JSON.stringify(data),\r\n      })\r\n        .then(function (response) {\r\n          if (response.ok) {\r\n            return response.json().catch(function () {\r\n              return { success: true };\r\n            });\r\n          } else {\r\n            throw new Error(\"Form submission failed\");\r\n          }\r\n        })\r\n        .then(function (result) {\r\n          form.innerHTML = `\r\n        <div class=\"czm-form-success-box\" style=\"padding: 32px 24px; text-align: center; background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.3); border-radius: 16px; margin: 16px 0;\">\r\n          <div style=\"width: 48px; height: 48px; margin: 0 auto 16px; border-radius: 50%; background: rgba(34, 197, 94, 0.2); display: flex; align-items: center; justify-content: center;\">\r\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#22c55e\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\r\n              <polyline points=\"20 6 9 17 4 12\"><\/polyline>\r\n            <\/svg>\r\n          <\/div>\r\n          <h4 style=\"font-family: 'Outfit', sans-serif; font-size: 20px; font-weight: 600; color: #22c55e; margin: 0 0 8px;\">Message Sent<\/h4>\r\n          <p style=\"font-family: 'Schibsted Grotesk', sans-serif; font-size: 15px; color: #ffffff; margin: 0; line-height: 1.5;\">\r\n            Thank you! Your message has been sent successfully.\r\n          <\/p>\r\n        <\/div>\r\n      `;\r\n        })\r\n        .catch(function (error) {\r\n          if (submitBtn) {\r\n            submitBtn.disabled = false;\r\n            if (submitBtnSpan) {\r\n              submitBtnSpan.textContent = originalBtnText;\r\n            } else {\r\n              submitBtn.textContent = originalBtnText;\r\n            }\r\n          }\r\n\r\n          const errorDiv = document.createElement(\"div\");\r\n          errorDiv.className = \"czm-form-error-msg\";\r\n          errorDiv.style.cssText =\r\n            'font-family: \"Schibsted Grotesk\", sans-serif; font-size: 14px; color: #ef4444; background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.3); border-radius: 8px; padding: 10px 14px; margin-top: 12px; text-align: center;';\r\n          errorDiv.textContent =\r\n            \"Something went wrong. Please try again or email us directly at info@cozmotec.ie.\";\r\n          form.appendChild(errorDiv);\r\n        });\r\n    }\r\n\r\n    document.addEventListener(\"DOMContentLoaded\", function () {\r\n      document\r\n        .querySelectorAll(\"form.czm-about-form\")\r\n        .forEach(function (f) {\r\n          f.addEventListener(\"submit\", handleCozmotecFormSubmit);\r\n        });\r\n    });\r\n  <\/script>\r\n  <\/div>\r\n<\/body>\r\n<\/html>\r\n\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>Business Intelligence | Cozmotec Actionable Intelligence In Real Time Book a call Our Business Intelligence Solutions Unlock the true value of your business data. Cozmotec designs automated data warehouses, pipeline aggregators, and executive-level visualization dashboards that present real-time key performance indicators, operational throughput, and revenue forecasts in one crystal-clear screen. Analytics &#038; Business Intelligence Executive [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"nf_dc_page":"","footnotes":""},"class_list":["post-4331","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/pages\/4331","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/comments?post=4331"}],"version-history":[{"count":25,"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/pages\/4331\/revisions"}],"predecessor-version":[{"id":5260,"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/pages\/4331\/revisions\/5260"}],"wp:attachment":[{"href":"https:\/\/cozmotec.ie\/staging\/7865\/wp-json\/wp\/v2\/media?parent=4331"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}