{"id":875,"date":"2026-08-31T14:47:44","date_gmt":"2026-08-31T14:47:44","guid":{"rendered":"https:\/\/new.be-ant.com\/?page_id=875"},"modified":"2026-08-31T15:03:08","modified_gmt":"2026-08-31T15:03:08","slug":"elementor-page-875","status":"publish","type":"page","link":"https:\/\/new.be-ant.com\/?page_id=875","title":{"rendered":"About1"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"875\" class=\"elementor elementor-875\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f164def e-flex e-con-boxed e-con e-parent\" data-id=\"f164def\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-118a585 elementor-widget elementor-widget-html\" data-id=\"118a585\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!--\n  beAnt \u2014 About page, packaged for a WordPress Custom HTML block.\n  Same conventions as wordpress-home.html: self-contained CSS\/JS, #ba-root\n  \/ .ba-* scoping, full-bleed breakout, no cross-page veil (see that file's\n  header comment for the full reasoning). No entry intro here \u2014 that's\n  homepage-only.\n\n  REPLACE BEFORE GOING LIVE\n  Images:\n    REPLACE_WITH_WP_MEDIA\/logo-teal.png\n    REPLACE_WITH_WP_MEDIA\/logo-teal-white.png\n    REPLACE_WITH_WP_MEDIA\/about-hero-teal.webp\n  Links: every href=\"#REPLACE_WITH_..._URL\" below.\n-->\n\n<style>\n  @import url('https:\/\/fonts.googleapis.com\/css2?family=DM+Sans:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');\n\n  #ba-root{\n    --ba-ink:#101111; --ba-paper:#f3f2ed; --ba-white:#fff; --ba-teal:#21c9b4;\n    --ba-muted:#aaa9a4; --ba-line:#d8d7d1; --ba-nav-gutter:4.4vw;\n  }\n  #ba-root, #ba-root *, #ba-root *:before, #ba-root *:after{ box-sizing:border-box; }\n  #ba-root{\n    width:100vw; max-width:100vw; position:relative; left:50%; right:50%;\n    margin-left:-50vw; margin-right:-50vw; overflow-x:hidden;\n    background:var(--ba-white); color:var(--ba-ink);\n    font-family:\"DM Sans\",-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif;\n    font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;\n  }\n  #ba-root a{ color:inherit; text-decoration:none; background:none; }\n  #ba-root h1, #ba-root h2, #ba-root h3, #ba-root h4, #ba-root h5, #ba-root h6, #ba-root p{\n    margin:0; padding:0; color:inherit; font-family:inherit; font-size:inherit;\n    font-weight:inherit; font-style:inherit; line-height:inherit; letter-spacing:inherit;\n    text-align:inherit; text-transform:inherit;\n  }\n  #ba-root ul, #ba-root ol{ margin:0; padding:0; list-style:none; color:inherit; }\n  #ba-root li{ color:inherit; }\n  #ba-root button{\n    font:inherit; color:inherit; background:none; border:0; padding:0; margin:0;\n    -webkit-appearance:none; appearance:none; cursor:pointer; text-align:inherit;\n  }\n  #ba-root img{ max-width:100%; display:block; border:0; }\n  #ba-root input, #ba-root textarea, #ba-root select{ font-family:inherit; color:inherit; }\n\n  \/* ---- header \/ nav (identical across every page) ---- *\/\n  #ba-root .ba-site-header{\n    height:86px; padding:0 var(--ba-nav-gutter); display:flex; align-items:center; gap:48px;\n    background:rgba(243,242,237,.97); backdrop-filter:blur(14px);\n    position:fixed; z-index:20; top:0; left:0; right:0; border-bottom:1px solid rgba(0,0,0,.08);\n  }\n  #ba-root .ba-logo{ font-family:Manrope,sans-serif; display:flex; align-items:center; line-height:1; }\n  #ba-root .ba-logo-image{ display:block; width:97px; height:auto; object-fit:contain; }\n  #ba-root .ba-site-header nav{ display:flex; gap:35px; margin-left:auto; font-size:14px; position:relative; }\n  #ba-root .ba-site-header nav a{ transition:color .2s; }\n  #ba-root .ba-nav-contact-mobile{ display:none; }\n  #ba-root .ba-site-header nav a:hover{ color:var(--ba-teal); }\n  #ba-root .ba-site-header nav a.ba-active{ color:var(--ba-teal); }\n  #ba-root .ba-nav-indicator{\n    position:absolute; left:0; bottom:-8px; height:1.5px; background:var(--ba-teal); opacity:0;\n    transition:transform .35s cubic-bezier(.22,.61,.36,1), width .35s cubic-bezier(.22,.61,.36,1), opacity .2s ease;\n    pointer-events:none;\n  }\n  #ba-root .ba-header-cta{\n    background:var(--ba-ink); color:#fff; padding:14px 20px; font-size:13px;\n    border:1px solid var(--ba-ink); transition:.25s; display:inline-block;\n  }\n  #ba-root .ba-header-cta:hover{ background:var(--ba-teal); color:var(--ba-ink); border-color:var(--ba-teal); }\n  #ba-root .ba-header-cta span{ margin-left:18px; display:inline-block; transition:transform .3s cubic-bezier(.22,.61,.36,1); }\n  #ba-root .ba-header-cta:hover span{ transform:translate(3px,-3px); }\n  #ba-root .ba-menu-toggle{ display:none; }\n\n  #ba-root .ba-kicker{\n    display:inline-flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:.16em;\n    font-size:11px; font-weight:600; margin-bottom:28px; color:#666;\n  }\n  #ba-root .ba-section{ padding:125px 8.5vw; }\n  #ba-root .ba-section-head{ display:grid; grid-template-columns:1.3fr .7fr; gap:50px; align-items:end; margin-bottom:80px; }\n  #ba-root .ba-section-head > p{ font-size:17px; line-height:1.65; color:var(--ba-muted); max-width:460px; margin-bottom:5px; }\n  #ba-root .ba-under-link{ display:inline-flex; gap:45px; border-bottom:1px solid; padding-bottom:9px; margin-top:25px; font-size:14px; }\n  #ba-root .ba-under-link span{ display:inline-block; transition:transform .3s cubic-bezier(.22,.61,.36,1); }\n  #ba-root .ba-under-link:hover span{ transform:translate(3px,-3px); }\n  #ba-root .ba-reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }\n  #ba-root .ba-reveal.ba-visible{ opacity:1; transform:none; }\n  @media (prefers-reduced-motion:reduce){ #ba-root .ba-reveal{ opacity:1; transform:none; transition:none; } }\n\n  \/* ---- about hero banner (photo) ---- *\/\n  #ba-root .ba-about-hero-banner{ height:min(860px,100vh); min-height:680px; position:relative; overflow:hidden; background:#c9c2b6; }\n  #ba-root .ba-about-hero-banner img{ position:absolute; inset:86px 0 0; width:100%; height:calc(100% - 86px); object-fit:cover; }\n  @media (max-width:1024px){\n    #ba-root .ba-about-hero-banner{ height:auto; min-height:0; padding-top:70px; }\n    #ba-root .ba-about-hero-banner img{ position:static; width:100%; height:auto; display:block; inset:auto; }\n  }\n\n  \/* ---- about hero copy ---- *\/\n  #ba-root .ba-about-hero h1{\n    font:500 clamp(57px,6.2vw,102px)\/.95 Manrope,sans-serif; letter-spacing:-.065em;\n  }\n  #ba-root .ba-about-hero h1 em{ font-weight:400; color:var(--ba-teal); font-style:normal; }\n\n  \/* ---- 15+ \/ experience statement ---- *\/\n  #ba-root .ba-approach-stat{ border-top:1px solid var(--ba-line); }\n  #ba-root .ba-about{ display:grid; grid-template-columns:1fr 1fr; gap:10vw; align-items:center; }\n  #ba-root .ba-about-mark{\n    aspect-ratio:1; background:var(--ba-teal); border-radius:50%; display:flex; flex-direction:column;\n    justify-content:center; align-items:center; position:relative;\n  }\n  #ba-root .ba-about-mark b{ font:500 clamp(95px,12vw,175px)\/.8 Manrope,sans-serif; letter-spacing:-.08em; }\n  #ba-root .ba-about-mark small{ text-transform:uppercase; font-size:12px; line-height:1.5; letter-spacing:.15em; margin-top:25px; }\n  #ba-root .ba-approach-stat-copy h2{ font:500 clamp(32px,3.6vw,52px)\/1.15 Manrope,sans-serif; letter-spacing:-.03em; }\n  #ba-root .ba-approach-stat-copy h2 em{ font-weight:400; color:var(--ba-teal); font-style:normal; }\n  #ba-root .ba-approach-stat-copy p{ margin-top:22px; max-width:460px; font-size:15px; line-height:1.65; color:#5d5d59; }\n  #ba-root .ba-approach-stat-copy p + p{ margin-top:16px; }\n\n  @media (max-width:1024px){\n    #ba-root .ba-about{ grid-template-columns:1fr; }\n    #ba-root .ba-about-mark{ max-width:500px; }\n    #ba-root .ba-about-hero h1{ font-size:clamp(50px,13vw,72px); }\n    #ba-root .ba-section{ padding:90px 7vw; }\n    #ba-root .ba-section-head{ grid-template-columns:1fr; margin-bottom:55px; }\n  }\n  @media (max-width:480px){ #ba-root .ba-section{ padding:75px 6vw; } }\n\n  \/* ---- philosophy ---- *\/\n  #ba-root .ba-philosophy{ border-top:1px solid var(--ba-line); }\n  #ba-root .ba-philosophy-lede{ color:var(--ba-ink); font-size:17px; line-height:1.65; max-width:460px; }\n\n  \/* ---- footer ---- *\/\n  #ba-root .ba-footer{ background:#0e1010; color:#fff; padding:75px var(--ba-nav-gutter) 35px; }\n  #ba-root .ba-footer-top{ display:flex; justify-content:space-between; align-items:flex-start; padding-bottom:75px; border-bottom:1px solid #353737; }\n  #ba-root .ba-footer-top p{ color:#969996; max-width:600px; text-align:right; line-height:1.8; font-size:13px; }\n  #ba-root .ba-footer-bottom{ padding-top:28px; display:grid; grid-template-columns:1fr auto 1fr; gap:40px; font-size:11px; color:#858985; }\n  #ba-root .ba-footer-bottom div{ display:flex; gap:25px; color:#ddd; }\n  #ba-root .ba-footer-bottom div a{ transition:color .2s; }\n  #ba-root .ba-footer-bottom div a:hover{ color:var(--ba-teal); }\n  #ba-root .ba-footer-bottom span{ text-align:right; }\n  #ba-root .ba-footer-mark{ display:inline-flex; align-items:center; justify-content:flex-end; gap:8px; }\n  #ba-root .ba-motif{ display:inline-block; flex:none; border-left:1.4px solid currentColor; border-top:1.4px solid currentColor; transform:rotate(45deg); }\n  #ba-root .ba-footer-mark .ba-motif{ width:8px; height:8px; color:#6c706e; }\n\n  @media (max-width:1024px){\n    #ba-root .ba-footer-top, #ba-root .ba-footer-bottom{ display:flex; flex-direction:column; }\n    #ba-root .ba-footer-top p{ text-align:left; }\n    #ba-root .ba-footer-bottom span, #ba-root .ba-footer-mark{ text-align:left; justify-content:flex-start; }\n  }\n\n  \/* ---- mobile nav ---- *\/\n  @media (max-width:1024px){\n    #ba-root .ba-site-header{ height:70px; }\n    #ba-root .ba-site-header nav{\n      position:fixed; inset:70px 0 auto; background:var(--ba-paper); padding:40px 7vw; display:none;\n      flex-direction:column; font-size:21px; z-index:19;\n    }\n    #ba-root .ba-nav-contact-mobile{ display:block; }\n    #ba-root .ba-site-header nav.ba-open{ display:flex; }\n    #ba-root .ba-nav-indicator{ display:none; }\n    #ba-root .ba-header-cta{ display:none; }\n    #ba-root .ba-menu-toggle{ display:block; margin-left:auto; width:35px; height:30px; }\n    #ba-root .ba-menu-toggle span{ display:block; height:1px; background:#111; margin:8px 0; }\n  }\n  @media (max-width:480px){ #ba-root .ba-logo-image{ width:80px; } }\n<\/style>\n\n<div id=\"ba-root\">\n\n  <header class=\"ba-site-header\">\n    <a class=\"ba-logo\" href=\"#REPLACE_WITH_HOME_PAGE_URL\" aria-label=\"beAnt home\">\n      <img decoding=\"async\" class=\"ba-logo-image\" src=\"REPLACE_WITH_WP_MEDIA\/logo-teal.png\" alt=\"beAnt\">\n    <\/a>\n    <button class=\"ba-menu-toggle\" type=\"button\" aria-expanded=\"false\" aria-controls=\"ba-nav\"><span><\/span><span><\/span><\/button>\n    <nav id=\"ba-nav\" aria-label=\"Main navigation\">\n      <a href=\"#REPLACE_WITH_HOME_PAGE_URL\">Home<\/a>\n      <a href=\"#REPLACE_WITH_WORK_PAGE_URL\">Work<\/a>\n      <a href=\"#REPLACE_WITH_SERVICES_URL\">Services<\/a>\n      <a href=\"#\" class=\"ba-active\" aria-current=\"page\">About<\/a>\n      <a href=\"#REPLACE_WITH_BLOG_PAGE_URL\">Blog<\/a>\n      <a href=\"#REPLACE_WITH_CONTACT_PAGE_URL\" class=\"ba-nav-contact-mobile\">Contact<\/a>\n    <\/nav>\n    <a class=\"ba-header-cta\" href=\"#REPLACE_WITH_CONTACT_PAGE_URL\">Start a project <span>&#8599;<\/span><\/a>\n  <\/header>\n\n  <main>\n    <section class=\"ba-about-hero-banner\">\n      <img decoding=\"async\" src=\"REPLACE_WITH_WP_MEDIA\/about-hero-teal.webp\" alt=\"The beAnt logo sign mounted on a stone wall\" fetchpriority=\"high\">\n    <\/section>\n\n    <section class=\"ba-about-hero ba-section\">\n      <p class=\"ba-kicker ba-reveal\">Who we are<\/p>\n      <h1 class=\"ba-reveal\">Built over time.<br><em>Still moving forward.<\/em><\/h1>\n    <\/section>\n\n    <section class=\"ba-approach-stat ba-section\">\n      <div class=\"ba-about ba-reveal\">\n        <div class=\"ba-about-mark\"><b>15+<\/b><small>Years of ideas<br>and innovation<\/small><\/div>\n        <div class=\"ba-approach-stat-copy\">\n          <h2>Experience behind.<br><em>Ideas ahead.<\/em><\/h2>\n          <p>beAnt is a UK-founded digital and creative studio with experience spanning design, technology and digital products.<\/p>\n          <p>We combine creative thinking with practical technology to build work that is useful, considered and made to move businesses forward.<\/p>\n          <p>beAnt (formerly iBusiness Designs) started in 2006 as a small design studio, building brands, identities and printed work for businesses that wanted to be taken seriously.<\/p>\n          <p>As the tools available to designers changed, so did the work. Print gave way to screens, and screens gave way to products: websites, applications and, more recently, intelligent automation.<\/p>\n          <p>What hasn&rsquo;t changed is the approach: understand the business first, then build something considered around it.<\/p>\n        <\/div>\n      <\/div>\n    <\/section>\n\n    <section class=\"ba-philosophy ba-section\">\n      <div class=\"ba-section-head ba-reveal\">\n        <div><p class=\"ba-kicker\">Our philosophy<\/p><h2 style=\"font:500 clamp(57px,6.2vw,102px)\/.95 Manrope,sans-serif;letter-spacing:-.065em\">Design as a vehicle<br><em style=\"font-weight:400;color:var(--ba-teal);font-style:normal\">for change.<\/em><\/h2><\/div>\n        <p class=\"ba-philosophy-lede\">Design isn&rsquo;t decoration. It&rsquo;s a creative endeavour that, done with craft and skill, changes how people see and experience a business. We aim for work that communicates clearly, represents our clients well, and is made without compromise.<\/p>\n      <\/div>\n    <\/section>\n  <\/main>\n\n  <footer class=\"ba-footer\">\n    <div class=\"ba-footer-top\">\n      <a class=\"ba-logo\" href=\"#REPLACE_WITH_HOME_PAGE_URL\">\n        <img decoding=\"async\" class=\"ba-logo-image\" src=\"REPLACE_WITH_WP_MEDIA\/logo-teal-white.png\" alt=\"beAnt\">\n      <\/a>\n      <p>Websites &middot; Web Applications &middot; Mobile Apps &middot; AI &amp; Automation &middot; Branding &amp; Design &middot; Digital Support<\/p>\n    <\/div>\n    <div class=\"ba-footer-bottom\">\n      <p>UK-founded. Working with businesses in the UK and beyond.<\/p>\n      <div>\n        <a href=\"#REPLACE_WITH_HOME_PAGE_URL\">Home<\/a>\n        <a href=\"#REPLACE_WITH_WORK_PAGE_URL\">Work<\/a>\n        <a href=\"#REPLACE_WITH_SERVICES_URL\">Services<\/a>\n        <a href=\"#\">About<\/a>\n        <a href=\"#REPLACE_WITH_BLOG_PAGE_URL\">Blog<\/a>\n      <\/div>\n      <span class=\"ba-footer-mark\"><span class=\"ba-motif\" aria-hidden=\"true\"><\/span>&copy; beAnt. All rights reserved.<\/span>\n    <\/div>\n  <\/footer>\n\n<\/div>\n\n<script>\n(function () {\n  'use strict';\n  var root = document.getElementById('ba-root');\n  if (!root) return;\n  var q = function (sel, ctx) { return (ctx || root).querySelector(sel); };\n  var qa = function (sel, ctx) { return Array.prototype.slice.call((ctx || root).querySelectorAll(sel)); };\n\n  var toggle = q('.ba-menu-toggle');\n  var nav = q('#ba-nav');\n  if (toggle && nav) {\n    toggle.addEventListener('click', function () {\n      var open = toggle.getAttribute('aria-expanded') === 'true';\n      toggle.setAttribute('aria-expanded', String(!open));\n      nav.classList.toggle('ba-open');\n    });\n    qa('a', nav).forEach(function (link) {\n      link.addEventListener('click', function () {\n        nav.classList.remove('ba-open');\n        toggle.setAttribute('aria-expanded', 'false');\n      });\n    });\n  }\n\n  var revealObserver = new IntersectionObserver(function (entries) {\n    entries.forEach(function (entry) {\n      if (entry.isIntersecting) {\n        entry.target.classList.add('ba-visible');\n        revealObserver.unobserve(entry.target);\n      }\n    });\n  }, { threshold: .12 });\n  qa('.ba-reveal').forEach(function (el) { revealObserver.observe(el); });\n\n  (function () {\n    var navEl = q('.ba-site-header nav');\n    if (!navEl) return;\n    var indicator = document.createElement('span');\n    indicator.className = 'ba-nav-indicator';\n    indicator.setAttribute('aria-hidden', 'true');\n    navEl.appendChild(indicator);\n\n    function moveIndicatorTo(link, instant) {\n      if (!link) { indicator.style.opacity = '0'; return; }\n      if (instant) indicator.style.transition = 'none';\n      var navRect = navEl.getBoundingClientRect();\n      var linkRect = link.getBoundingClientRect();\n      indicator.style.opacity = '1';\n      indicator.style.width = linkRect.width + 'px';\n      indicator.style.transform = 'translateX(' + (linkRect.left - navRect.left) + 'px)';\n      if (instant) { void indicator.offsetWidth; indicator.style.transition = ''; }\n    }\n    var pinnedLink = null;\n    function activeLink() { return pinnedLink || q('a.ba-active', navEl) || null; }\n    function syncToActive(instant) { moveIndicatorTo(activeLink(), instant); }\n    qa('a', navEl).forEach(function (link) {\n      link.addEventListener('mouseenter', function () { moveIndicatorTo(link); });\n      link.addEventListener('focus', function () { moveIndicatorTo(link); });\n      link.addEventListener('click', function () { pinnedLink = link; moveIndicatorTo(link); });\n    });\n    navEl.addEventListener('mouseleave', function () { syncToActive(); });\n    syncToActive(true);\n    if (document.fonts && document.fonts.ready) { document.fonts.ready.then(function () { syncToActive(true); }); }\n    window.addEventListener('resize', function () { syncToActive(true); });\n  })();\n})();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Home Work Services About Blog Contact Start a project &#8599; Who we are Built over time.Still moving forward. 15+Years of ideasand innovation Experience behind.Ideas ahead. beAnt is a UK-founded digital and creative studio with experience spanning design, technology and digital products. We combine creative thinking with practical technology to build work that is useful, considered [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-875","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/pages\/875","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/new.be-ant.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=875"}],"version-history":[{"count":8,"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/pages\/875\/revisions"}],"predecessor-version":[{"id":908,"href":"https:\/\/new.be-ant.com\/index.php?rest_route=\/wp\/v2\/pages\/875\/revisions\/908"}],"wp:attachment":[{"href":"https:\/\/new.be-ant.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=875"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}