{"id":74,"date":"2026-08-10T11:49:54","date_gmt":"2026-08-10T11:49:54","guid":{"rendered":"https:\/\/brandwebhub.com\/?page_id=74"},"modified":"2026-08-10T13:15:34","modified_gmt":"2026-08-10T13:15:34","slug":"websites-design-and-development","status":"publish","type":"page","link":"https:\/\/brandwebhub.com\/?page_id=74","title":{"rendered":"Websites Design and Development"},"content":{"rendered":"\n<style data-wp-block-html=\"css\">\n\/* ==========================================================\n   BRAND WEB HUB \u2014 WEBSITE DESIGN & DEVELOPMENT PAGE\n   Fully namespaced to prevent WordPress\/Astra style conflicts\n   ========================================================== *\/\n\n.bwh-web-page {\n  --bwh-red: #ff2437;\n  --bwh-red-dark: #d90d21;\n  --bwh-ink: #09090b;\n  --bwh-charcoal: #121216;\n  --bwh-soft: #f4f4f6;\n  --bwh-line: #dedee3;\n  --bwh-muted: #686873;\n  --bwh-white: #ffffff;\n  position: relative;\n  width: 100vw;\n  max-width: none;\n  margin-left: calc(50% - 50vw);\n  overflow: clip;\n  color: var(--bwh-ink);\n  background: var(--bwh-white);\n  font-family: inherit;\n  line-height: 1.65;\n}\n\n.bwh-web-page *,\n.bwh-web-page *::before,\n.bwh-web-page *::after { box-sizing: border-box; }\n.bwh-web-page a { color: inherit; text-decoration: none; }\n.bwh-web-page h1,\n.bwh-web-page h2,\n.bwh-web-page h3,\n.bwh-web-page p,\n.bwh-web-page ul,\n.bwh-web-page ol,\n.bwh-web-page figure { margin-top: 0; }\n.bwh-web-page h1,\n.bwh-web-page h2,\n.bwh-web-page h3 { color: inherit; font-family: inherit; }\n.bwh-web-page button,\n.bwh-web-page a { -webkit-tap-highlight-color: transparent; }\n.bwh-web-shell { width: min(1240px, calc(100% - 48px)); margin-inline: auto; }\n\n\/* Shared typography *\/\n.bwh-web-eyebrow,\n.bwh-web-kicker {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  margin-bottom: 18px;\n  color: var(--bwh-red);\n  font-size: 12px;\n  font-weight: 800;\n  line-height: 1.2;\n  letter-spacing: .17em;\n  text-transform: uppercase;\n}\n.bwh-web-eyebrow span { display: block; width: 30px; height: 2px; background: currentColor; }\n.bwh-web-section { padding-top: 180px; padding-bottom:112px }\n.bwh-web-section-heading h2,\n.bwh-web-mid-cta h2,\n.bwh-web-final-cta h2 {\n  max-width: 830px;\n  margin-bottom: 0;\n  font-size: clamp(40px, 4.45vw, 68px);\n  font-weight: 800;\n  line-height: 1.02;\n  letter-spacing: -.055em;\n}\n.bwh-web-section-heading h2 em,\n.bwh-web-final-cta h2 em { color: var(--bwh-red); font-style: normal; }\n.bwh-web-heading-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1.65fr) minmax(280px, .65fr);\n  align-items: end;\n  gap: 70px;\n  margin-bottom: 62px;\n}\n.bwh-web-heading-row > p,\n.bwh-web-section-heading > p:not(.bwh-web-kicker) { color: var(--bwh-muted); font-size: 17px; }\n\n\/* Buttons *\/\n.bwh-web-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 28px; margin-top: 34px; }\n.bwh-web-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: 22px;\n  min-height: 58px;\n  padding: 16px 25px;\n  border: 1px solid transparent;\n  border-radius: 4px;\n  font-size: 14px;\n  font-weight: 800;\n  line-height: 1.2;\n  transition: transform .3s ease, background-color .3s ease, color .3s ease, border-color .3s ease;\n}\n.bwh-web-btn span { font-size: 20px; font-weight: 400; transition: transform .3s ease; }\n.bwh-web-btn:hover { transform: translateY(-3px); }\n.bwh-web-btn:hover span { transform: translate(3px, -3px); }\n.bwh-web-btn-primary { color: var(--bwh-white) !important; background: var(--bwh-red); }\n.bwh-web-btn-primary:hover { background: var(--bwh-red-dark); }\n.bwh-web-btn-light { color: var(--bwh-ink) !important; background: var(--bwh-white); }\n.bwh-web-btn-light:hover { color: var(--bwh-white) !important; border-color: var(--bwh-white); background: transparent; }\n.bwh-web-text-link {\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n  color: inherit;\n  font-size: 14px;\n  font-weight: 800;\n  border-bottom: 1px solid currentColor;\n  transition: color .25s ease, gap .25s ease;\n}\n.bwh-web-text-link:hover { gap: 15px; color: var(--bwh-red); }\n\n\/* Hero *\/\n.bwh-web-hero {\n  position: relative;\n  padding: 100px 0 0;\n  color: var(--bwh-white);\n  background:\n    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),\n    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),\n    var(--bwh-ink);\n  background-size: 64px 64px;\n}\n.bwh-web-hero::after {\n  position: absolute;\n  inset: auto 0 0;\n  height: 1px;\n  content: \"\";\n  background: rgba(255,255,255,.12);\n}\n.bwh-web-orb { position: absolute; border-radius: 50%; filter: blur(90px); pointer-events: none; }\n.bwh-web-orb-one { top: 5%; right: 12%; width: 340px; height: 340px; background: rgba(255,36,55,.22); }\n.bwh-web-orb-two { bottom: 0; left: 5%; width: 260px; height: 260px; background: rgba(255,36,55,.08); }\n.bwh-web-hero-grid {\n  position: relative;\n  z-index: 2;\n  display: grid;\n  grid-template-columns: minmax(0, 1.02fr) minmax(410px, .98fr);\n  align-items: center;\n  gap: 76px;\n  min-height: 620px;\n}\n.bwh-web-hero-copy { padding-bottom: 58px; }\n.bwh-web-hero h1 {\n  max-width: 760px;\n  margin-bottom: 26px;\n  color: var(--bwh-white);\n  font-size: clamp(48px, 5.35vw, 82px);\n  font-weight: 850;\n  line-height: .98;\n  letter-spacing: -.06em;\n}\n.bwh-web-hero h1 em { color: var(--bwh-red); font-style: normal; }\n.bwh-web-hero-lead { max-width: 690px; margin-bottom: 0; color: #bdbdc6; font-size: 18px; line-height: 1.8; }\n.bwh-web-trust-list { display: flex; flex-wrap: wrap; gap: 16px 25px; padding: 0; margin: 34px 0 0; list-style: none; }\n.bwh-web-trust-list li { color: #d7d7dd; font-size: 13px; }\n.bwh-web-trust-list span { display: inline-grid; place-items: center; width: 20px; height: 20px; margin-right: 6px; color: var(--bwh-red); border: 1px solid rgba(255,36,55,.55); border-radius: 50%; font-size: 10px; }\n\n\/* Hero browser artwork *\/\n.bwh-web-hero-art { position: relative; min-height: 530px; }\n.bwh-web-code-label { position: absolute; top: 15px; right: 30px; color: rgba(255,255,255,.4); font-size: 10px; font-weight: 800; letter-spacing: .24em; }\n.bwh-web-browser { overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: #17171c; box-shadow: 0 40px 90px rgba(0,0,0,.48); }\n.bwh-web-browser-main { position: absolute; top: 75px; right: 0; width: 94%; transform: rotate(1.7deg); }\n.bwh-web-browser-bar { display: flex; align-items: center; gap: 7px; height: 42px; padding: 0 14px; border-bottom: 1px solid rgba(255,255,255,.1); }\n.bwh-web-browser-bar i { width: 7px; height: 7px; border-radius: 50%; background: #55555d; }\n.bwh-web-browser-bar i:first-child { background: var(--bwh-red); }\n.bwh-web-browser-bar span { margin-left: 8px; color: #777780; font-size: 9px; }\n.bwh-web-browser-body { padding: 20px; }\n.bwh-web-mini-nav { display: flex; align-items: center; justify-content: flex-end; gap: 18px; height: 38px; }\n.bwh-web-mini-nav b { width: 40px; height: 12px; margin-right: auto; background: var(--bwh-white); }\n.bwh-web-mini-nav span { width: 33px; height: 3px; background: #5c5c65; }\n.bwh-web-mini-nav span:last-child { width: 48px; height: 18px; background: var(--bwh-red); }\n.bwh-web-mini-hero { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 20px; min-height: 315px; padding: 28px; background: #0e0e11; }\n.bwh-web-mini-hero div small { display: block; width: 36px; height: 4px; margin-bottom: 14px; background: var(--bwh-red); }\n.bwh-web-mini-hero div strong { display: block; width: 90%; height: 20px; margin: 9px 0; background: #ededf0; }\n.bwh-web-mini-hero div strong:nth-child(3) { width: 68%; }\n.bwh-web-mini-hero div p { width: 80%; height: 30px; margin: 17px 0; background: repeating-linear-gradient(#4b4b53 0 3px, transparent 3px 9px); }\n.bwh-web-mini-hero div button { width: 75px; height: 25px; padding: 0; border: 0; background: var(--bwh-red); }\n.bwh-web-mini-hero figure { position: relative; height: 235px; margin: 0; overflow: hidden; background: linear-gradient(140deg, #292932, #111114); }\n.bwh-web-mini-hero figure::before { position: absolute; inset: 24px; content: \"\"; border: 1px solid rgba(255,255,255,.22); border-radius: 50% 50% 10% 50%; background: radial-gradient(circle at 45% 45%, var(--bwh-red) 0 9%, transparent 10%), linear-gradient(135deg, transparent 46%, rgba(255,36,55,.85) 47% 54%, transparent 55%); }\n.bwh-web-float-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 12px; padding: 15px 17px; border: 1px solid rgba(255,255,255,.14); border-radius: 8px; background: rgba(28,28,33,.88); box-shadow: 0 20px 45px rgba(0,0,0,.38); backdrop-filter: blur(12px); animation: bwhWebFloat 5s ease-in-out infinite; }\n.bwh-web-float-card b, .bwh-web-float-card small { display: block; }\n.bwh-web-float-card b { font-size: 12px; }.bwh-web-float-card small { margin-top: 2px; color: #8e8e98; font-size: 9px; }\n.bwh-web-float-icon { display: grid; place-items: center; width: 32px; height: 32px; color: var(--bwh-white); border-radius: 50%; background: var(--bwh-red); }\n.bwh-web-speed-card { top: 42px; left: -5px; }.bwh-web-mobile-card { right: -18px; bottom: 54px; animation-delay: -2s; }\n.bwh-web-art-word { position: absolute; left: -20px; bottom: 8px; color: transparent; font-size: 116px; font-weight: 900; line-height: 1; letter-spacing: -.09em; -webkit-text-stroke: 1px rgba(255,255,255,.09); }\n@keyframes bwhWebFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }\n.bwh-web-proof-strip { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.12); }\n.bwh-web-proof-strip div { display: flex; align-items: center; gap: 13px; min-height: 104px; padding: 20px 30px; border-right: 1px solid rgba(255,255,255,.12); }\n.bwh-web-proof-strip div:first-child { padding-left: 0; }.bwh-web-proof-strip div:last-child { border: 0; }\n.bwh-web-proof-strip strong { color: var(--bwh-white); font-size: 23px; }.bwh-web-proof-strip span { color: #898993; font-size: 11px; line-height: 1.4; }\n\n\/* Intro *\/\n.bwh-web-intro { background: var(--bwh-white); }\n.bwh-web-intro-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, .75fr); gap: 110px; align-items: start; }\n.bwh-web-rich-copy p { margin-bottom: 21px; color: var(--bwh-muted); font-size: 17px; }\n.bwh-web-rich-copy h2 { margin-bottom: 28px; font-size: clamp(38px, 4vw, 64px); line-height: 1.03; letter-spacing: -.055em; }\n.bwh-web-rich-copy h2 em { color: var(--bwh-red); font-style: normal; }\n\n\/* Industries *\/\n.bwh-web-industries { color: var(--bwh-white); background: var(--bwh-charcoal); }\n.bwh-web-industries .bwh-web-heading-row > p { color: #94949d; }\n.bwh-web-industry-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.14); border-left: 1px solid rgba(255,255,255,.14); }\n.bwh-web-industry-card { position: relative; min-height: 255px; padding: 31px 28px; border-right: 1px solid rgba(255,255,255,.14); border-bottom: 1px solid rgba(255,255,255,.14); transition: background-color .3s ease, transform .3s ease; }\n.bwh-web-industry-card:hover { z-index: 2; background: var(--bwh-red); transform: translateY(-5px); }\n.bwh-web-industry-card > span { color: #74747e; font-size: 10px; font-weight: 800; letter-spacing: .14em; }.bwh-web-industry-card:hover > span { color: rgba(255,255,255,.65); }\n.bwh-web-industry-card > b { display: block; min-height: 55px; margin: 20px 0 13px; color: var(--bwh-red); font-size: 31px; font-weight: 400; }.bwh-web-industry-card:hover > b { color: var(--bwh-white); }\n.bwh-web-industry-card h3 { margin-bottom: 9px; color: var(--bwh-white); font-size: 17px; }\n.bwh-web-industry-card p { margin-bottom: 0; color: #96969f; font-size: 13px; line-height: 1.7; }.bwh-web-industry-card:hover p { color: rgba(255,255,255,.82); }\n\n\/* Static vs Dynamic *\/\n.bwh-web-solutions { background: var(--bwh-soft); }\n.bwh-web-solution-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 24px; }\n.bwh-web-solution-card { position: relative; padding: 48px; border: 1px solid var(--bwh-line); background: var(--bwh-white); transition: transform .3s ease, box-shadow .3s ease; }\n.bwh-web-solution-card:hover { transform: translateY(-6px); box-shadow: 0 28px 65px rgba(16,16,20,.08); }\n.bwh-web-solution-featured { color: var(--bwh-white); border-color: var(--bwh-ink); background: var(--bwh-ink); }\n.bwh-web-solution-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 75px; }\n.bwh-web-solution-top span { color: var(--bwh-red); font-size: 12px; font-weight: 800; }.bwh-web-solution-top small { padding: 7px 11px; color: var(--bwh-muted); border: 1px solid var(--bwh-line); border-radius: 30px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }\n.bwh-web-solution-featured .bwh-web-solution-top small { color: #a3a3ad; border-color: #38383f; }\n.bwh-web-solution-card h3 { margin-bottom: 15px; font-size: 31px; line-height: 1.15; letter-spacing: -.035em; }\n.bwh-web-solution-card > p { min-height: 80px; margin-bottom: 29px; color: var(--bwh-muted); font-size: 15px; }.bwh-web-solution-featured > p { color: #a8a8b1; }\n.bwh-web-solution-card ul { padding: 0; margin: 0 0 35px; list-style: none; border-top: 1px solid var(--bwh-line); }\n.bwh-web-solution-featured ul { border-color: #303036; }\n.bwh-web-solution-card li { position: relative; padding: 13px 5px 13px 27px; border-bottom: 1px solid var(--bwh-line); font-size: 14px; }.bwh-web-solution-featured li { border-color: #303036; }\n.bwh-web-solution-card li::before { position: absolute; left: 4px; color: var(--bwh-red); content: \"\u2713\"; font-weight: 900; }\n.bwh-web-solution-card > a { display: inline-flex; gap: 15px; color: var(--bwh-red); font-size: 13px; font-weight: 800; border-bottom: 1px solid currentColor; }\n\n\/* Included features *\/\n.bwh-web-included .bwh-web-section-heading { margin-bottom: 62px; }\n.bwh-web-feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--bwh-line); border-left: 1px solid var(--bwh-line); }\n.bwh-web-feature { min-height: 260px; padding: 38px 34px; border-right: 1px solid var(--bwh-line); border-bottom: 1px solid var(--bwh-line); transition: background-color .3s ease; }\n.bwh-web-feature:hover { background: var(--bwh-soft); }\n.bwh-web-feature > span { color: var(--bwh-red); font-size: 11px; font-weight: 800; }\n.bwh-web-feature h3 { margin: 57px 0 10px; font-size: 20px; }.bwh-web-feature p { margin: 0; color: var(--bwh-muted); font-size: 14px; }\n\n\/* Work *\/\n.bwh-web-work { background: var(--bwh-soft); }\n.bwh-web-project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 60px 24px; }\n.bwh-web-project-visual { position: relative; display: block; min-height: 390px; padding: 53px 48px; overflow: hidden; background: #111; transition: transform .4s ease; }\n.bwh-web-project-visual::before { position: absolute; inset: 0; content: \"\"; opacity: .8; transition: transform .6s ease; }\n.bwh-web-project:hover .bwh-web-project-visual::before { transform: scale(1.08) rotate(-1deg); }\n.bwh-web-project-sumadai .bwh-web-project-visual::before { background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.2), transparent 30%), linear-gradient(145deg, #135f73, #061d27 70%); }\n.bwh-web-project-nelum .bwh-web-project-visual::before { background: radial-gradient(circle at 75% 25%, rgba(255,212,71,.45), transparent 23%), linear-gradient(145deg, #22736b, #0c312e 70%); }\n.bwh-web-project-education .bwh-web-project-visual::before { background: radial-gradient(circle at 20% 20%, rgba(255,255,255,.33), transparent 27%), linear-gradient(145deg, #f07983, #8f3344 70%); }\n.bwh-web-project-meraki .bwh-web-project-visual::before { background: radial-gradient(circle at 78% 22%, rgba(111,212,255,.42), transparent 27%), linear-gradient(145deg, #17385b, #091928 70%); }\n.bwh-web-project-no { position: absolute; z-index: 2; top: 20px; right: 22px; color: rgba(255,255,255,.65); font-size: 10px; font-weight: 800; }\n.bwh-web-project-browser { position: relative; z-index: 2; width: 90%; min-height: 280px; padding: 64px 32px 28px; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.09); box-shadow: 25px 30px 50px rgba(0,0,0,.25); backdrop-filter: blur(9px); transform: rotate(-2.5deg); transition: transform .5s ease; }\n.bwh-web-project:nth-child(even) .bwh-web-project-browser { margin-left: auto; transform: rotate(2.5deg); }\n.bwh-web-project:hover .bwh-web-project-browser { transform: rotate(0) translateY(-7px); }\n.bwh-web-project-browser::before { position: absolute; inset: 34px 0 auto; height: 1px; content: \"\"; background: rgba(255,255,255,.25); }\n.bwh-web-project-browser i { position: relative; top: -43px; display: inline-block; width: 6px; height: 6px; margin-right: 4px; border-radius: 50%; background: rgba(255,255,255,.42); }\n.bwh-web-project-browser b { display: block; color: var(--bwh-white); font-size: clamp(29px, 3vw, 44px); line-height: .92; letter-spacing: -.04em; }\n.bwh-web-project-browser small { display: block; margin-top: 20px; color: rgba(255,255,255,.67); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }\n.bwh-web-project-copy { padding: 24px 4px 0; }\n.bwh-web-project-copy > p { margin-bottom: 7px; color: var(--bwh-red); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }\n.bwh-web-project-copy h3 { margin-bottom: 10px; font-size: 27px; letter-spacing: -.03em; }\n.bwh-web-project-copy > span { display: block; max-width: 580px; color: var(--bwh-muted); font-size: 14px; }\n.bwh-web-project-copy > a { display: inline-flex; align-items: center; gap: 10px; margin-top: 19px; color: var(--bwh-ink); font-size: 12px; font-weight: 800; border-bottom: 1px solid; }\n.bwh-web-project-copy > a:hover { color: var(--bwh-red); }\n\n\/* Mid CTA *\/\n.bwh-web-mid-cta { padding: 74px 0; color: var(--bwh-white); background: var(--bwh-red); }\n.bwh-web-mid-cta-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 70px; }\n.bwh-web-mid-cta p { margin-bottom: 9px; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }\n.bwh-web-mid-cta h2 { max-width: 850px; color: var(--bwh-white); font-size: clamp(34px, 3.45vw, 53px); }\n\n\/* Process *\/\n.bwh-web-process { color: var(--bwh-white); background: var(--bwh-ink); }\n.bwh-web-process-grid { display: grid; grid-template-columns: minmax(0,.75fr) minmax(500px,1fr); gap: 110px; }\n.bwh-web-process-heading { position: sticky; top: 130px; align-self: start; }\n.bwh-web-process-heading > p:not(.bwh-web-kicker) { max-width: 480px; margin: 28px 0; color: #8f8f99; }\n.bwh-web-process .bwh-web-text-link { color: var(--bwh-white); }\n.bwh-web-process-list { padding: 0; margin: 0; list-style: none; border-top: 1px solid #2a2a30; }\n.bwh-web-process-list li { display: grid; grid-template-columns: 60px 1fr; gap: 18px; padding: 32px 5px; border-bottom: 1px solid #2a2a30; }\n.bwh-web-process-list li > span { padding-top: 4px; color: var(--bwh-red); font-size: 11px; font-weight: 800; }\n.bwh-web-process-list h3 { margin-bottom: 7px; color: var(--bwh-white); font-size: 23px; }.bwh-web-process-list p { margin-bottom: 0; color: #90909a; font-size: 14px; }\n\n\/* SEO *\/\n.bwh-web-seo { background: var(--bwh-white); }\n.bwh-web-seo-grid { display: grid; grid-template-columns: minmax(430px,.9fr) minmax(0,1fr); align-items: center; gap: 105px; }\n.bwh-web-seo-art { position: relative; min-height: 510px; padding: 63px 48px; overflow: hidden; color: var(--bwh-white); background: var(--bwh-charcoal); }\n.bwh-web-seo-art > span { position: absolute; right: -15px; bottom: -25px; color: transparent; font-size: 103px; font-weight: 900; letter-spacing: -.08em; -webkit-text-stroke: 1px rgba(255,255,255,.1); }\n.bwh-web-seo-art > strong { position: absolute; top: 25px; right: 28px; color: #62626b; font-size: 10px; }\n.bwh-web-search-box { display: grid; grid-template-columns: 30px 1fr 25px; align-items: center; min-height: 64px; padding: 0 20px; border: 1px solid #393940; background: #1b1b20; }\n.bwh-web-search-box i { width: 15px; height: 15px; border: 2px solid var(--bwh-red); border-radius: 50%; }.bwh-web-search-box b { color: #d8d8dd; font-size: 12px; }.bwh-web-search-box small { color: var(--bwh-red); font-size: 20px; }\n.bwh-web-search-result { margin-top: 34px; padding: 26px; border-left: 3px solid var(--bwh-red); background: #202026; box-shadow: 0 24px 45px rgba(0,0,0,.28); }\n.bwh-web-search-result small,.bwh-web-search-result b { display: block; }.bwh-web-search-result small { margin-bottom: 11px; color: #6fbc8d; font-size: 9px; }.bwh-web-search-result b { color: var(--bwh-white); font-size: 16px; }\n.bwh-web-search-result i { display: block; width: 90%; height: 3px; margin-top: 16px; background: #55555e; }.bwh-web-search-result i:last-child { width: 68%; margin-top: 8px; }\n.bwh-web-check-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 10px 20px; padding: 0; margin: 27px 0 0; list-style: none; }\n.bwh-web-check-grid li { position: relative; padding-left: 24px; color: var(--bwh-ink); font-size: 13px; font-weight: 700; }.bwh-web-check-grid li::before { position: absolute; left: 0; color: var(--bwh-red); content: \"\u2713\"; }\n\n\/* Why *\/\n.bwh-web-why { background: var(--bwh-soft); }\n.bwh-web-why-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: var(--bwh-line); border: 1px solid var(--bwh-line); }\n.bwh-web-why-grid article { min-height: 260px; padding: 35px 28px; background: var(--bwh-white); }\n.bwh-web-why-grid strong { color: var(--bwh-red); font-size: 11px; }.bwh-web-why-grid h3 { margin: 78px 0 10px; font-size: 18px; }.bwh-web-why-grid p { margin: 0; color: var(--bwh-muted); font-size: 13px; }\n\n\/* FAQ *\/\n.bwh-web-faq { background: var(--bwh-white); }\n.bwh-web-faq-grid { display: grid; grid-template-columns: minmax(0,.7fr) minmax(500px,1fr); gap: 100px; }\n.bwh-web-faq .bwh-web-section-heading > p:not(.bwh-web-kicker) { max-width: 430px; margin-top: 25px; }\n.bwh-web-faq .bwh-web-section-heading > p a { color: var(--bwh-red); font-weight: 800; }\n.bwh-web-accordion { border-top: 1px solid var(--bwh-line); }\n.bwh-web-accordion details { border-bottom: 1px solid var(--bwh-line); }\n.bwh-web-accordion summary { position: relative; padding: 25px 50px 25px 0; cursor: pointer; list-style: none; font-size: 17px; font-weight: 800; line-height: 1.4; }\n.bwh-web-accordion summary::-webkit-details-marker { display: none; }\n.bwh-web-accordion summary span::before,.bwh-web-accordion summary span::after { position: absolute; top: 34px; right: 5px; width: 15px; height: 2px; content: \"\"; background: var(--bwh-red); transition: transform .25s ease; }\n.bwh-web-accordion summary span::after { transform: rotate(90deg); }.bwh-web-accordion details[open] summary span::after { transform: rotate(0); }\n.bwh-web-accordion details p { padding: 0 48px 25px 0; margin: 0; color: var(--bwh-muted); font-size: 14px; }\n\n\/* Final CTA *\/\n.bwh-web-final-cta { position: relative; padding: 100px 0; overflow: hidden; color: var(--bwh-white); background: var(--bwh-ink); }\n.bwh-web-final-cta::before { position: absolute; top: -200px; right: -110px; width: 520px; height: 520px; content: \"\"; border: 100px solid rgba(255,36,55,.11); border-radius: 50%; }\n.bwh-web-final-grid { position: relative; display: grid; grid-template-columns: minmax(0,1.1fr) minmax(360px,.65fr); align-items: end; gap: 90px; }\n.bwh-web-final-side > p { margin-bottom: 28px; color: #9a9aa4; font-size: 15px; }\n.bwh-web-direct-contact { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 25px; }.bwh-web-direct-contact a { color: #bebec5; font-size: 12px; border-bottom: 1px solid #55555e; }\n\n\/* Entrance animation *\/\n.bwh-web-page.bwh-web-js .bwh-web-reveal { opacity: 0; transform: translateY(25px); transition: opacity .7s cubic-bezier(.2,.65,.2,1) var(--bwh-delay,0ms), transform .7s cubic-bezier(.2,.65,.2,1) var(--bwh-delay,0ms); }\n.bwh-web-page.bwh-web-js .bwh-web-reveal.bwh-web-visible { opacity: 1; transform: translateY(0); }\n\n\/* Tablet *\/\n@media (max-width: 1100px) {\n  .bwh-web-hero-grid { grid-template-columns: minmax(0,1fr) minmax(370px,.8fr); gap: 35px; }\n  .bwh-web-hero h1 { font-size: clamp(46px,5.6vw,66px); }\n  .bwh-web-industry-grid { grid-template-columns: repeat(3,1fr); }\n  .bwh-web-feature-grid { grid-template-columns: repeat(2,1fr); }\n  .bwh-web-why-grid { grid-template-columns: repeat(2,1fr); }\n  .bwh-web-process-grid,.bwh-web-faq-grid { gap: 60px; }\n  .bwh-web-seo-grid { gap: 60px; }\n}\n\n@media (max-width: 900px) {\n  .bwh-web-section { padding: 85px 0; }\n  .bwh-web-hero { padding-top: 75px; }\n  .bwh-web-hero-grid { grid-template-columns: 1fr; }\n  .bwh-web-hero-copy { padding-bottom: 0; }\n  .bwh-web-hero-art { min-height: 500px; }\n  .bwh-web-browser-main { width: 90%; right: 5%; }\n  .bwh-web-heading-row,.bwh-web-intro-grid,.bwh-web-seo-grid,.bwh-web-final-grid { grid-template-columns: 1fr; gap: 32px; }\n  .bwh-web-heading-row { align-items: start; margin-bottom: 48px; }\n  .bwh-web-heading-row > p { max-width: 650px; }\n  .bwh-web-intro-grid { gap: 45px; }\n  .bwh-web-industry-grid { grid-template-columns: repeat(2,1fr); }\n  .bwh-web-process-grid,.bwh-web-faq-grid { grid-template-columns: 1fr; gap: 55px; }\n  .bwh-web-process-heading { position: static; }\n  .bwh-web-mid-cta-inner { grid-template-columns: 1fr; gap: 30px; }\n  .bwh-web-seo-art { min-height: 440px; }\n  .bwh-web-final-side { max-width: 620px; }\n}\n\n\/* Mobile *\/\n@media (max-width: 680px) {\n  .bwh-web-page { width: 100vw; margin-left: calc(50% - 50vw); }\n  .bwh-web-shell { width: min(100% - 30px, 1240px); }\n  .bwh-web-section { padding: 70px 0; }\n  .bwh-web-section-heading h2,.bwh-web-final-cta h2 { font-size: clamp(36px,11vw,49px); }\n  .bwh-web-kicker,.bwh-web-eyebrow { font-size: 10px; letter-spacing: .13em; }\n  .bwh-web-hero { padding-top: 66px; background-size: 42px 42px; }\n  .bwh-web-hero h1 { font-size: clamp(43px,12.8vw,60px); }\n  .bwh-web-hero-lead { font-size: 15px; line-height: 1.72; }\n  .bwh-web-actions { align-items: stretch; flex-direction: column; gap: 20px; }\n  .bwh-web-btn { width: 100%; }\n  .bwh-web-text-link { align-self: flex-start; }\n  .bwh-web-trust-list { display: grid; grid-template-columns: 1fr; gap: 9px; }\n  .bwh-web-hero-art { min-height: 340px; margin-top: 5px; }\n  .bwh-web-browser-main { top: 46px; right: 0; width: 100%; }\n  .bwh-web-browser-body { padding: 12px; }\n  .bwh-web-mini-hero { min-height: 215px; padding: 17px; }\n  .bwh-web-mini-hero figure { height: 165px; }\n  .bwh-web-mini-nav span { width: 20px; }.bwh-web-mini-nav span:last-child { width: 35px; }\n  .bwh-web-float-card { padding: 10px 11px; }.bwh-web-float-card b { font-size: 9px; }.bwh-web-mobile-card { right: -4px; bottom: 4px; }.bwh-web-speed-card { top: 15px; left: -2px; }\n  .bwh-web-art-word,.bwh-web-code-label { display: none; }\n  .bwh-web-proof-strip { grid-template-columns: repeat(2,1fr); }\n  .bwh-web-proof-strip div { min-height: 78px; padding: 13px; border-bottom: 1px solid rgba(255,255,255,.12); }\n  .bwh-web-proof-strip div:first-child { padding-left: 13px; }.bwh-web-proof-strip div:nth-child(2) { border-right: 0; }.bwh-web-proof-strip div:nth-child(n+3) { border-bottom: 0; }\n  .bwh-web-proof-strip strong { font-size: 17px; }.bwh-web-proof-strip span { font-size: 9px; }\n  .bwh-web-rich-copy p { font-size: 15px; }\n  .bwh-web-industry-grid,.bwh-web-feature-grid,.bwh-web-solution-grid,.bwh-web-project-grid,.bwh-web-why-grid { grid-template-columns: 1fr; }\n  .bwh-web-industry-card { min-height: 220px; }\n  .bwh-web-solution-card { padding: 32px 24px; }.bwh-web-solution-top { margin-bottom: 48px; }.bwh-web-solution-card > p { min-height: 0; }\n  .bwh-web-project-grid { gap: 48px; }\n  .bwh-web-project-visual { min-height: 285px; padding: 45px 24px 30px; }\n  .bwh-web-project-browser { width: 95%; min-height: 210px; padding: 55px 22px 20px; }\n  .bwh-web-project-browser b { font-size: 31px; }\n  .bwh-web-mid-cta { padding: 58px 0; }.bwh-web-mid-cta h2 { font-size: 34px; }\n  .bwh-web-process-grid { gap: 42px; }.bwh-web-process-list li { grid-template-columns: 42px 1fr; }\n  .bwh-web-seo-art { min-height: 360px; padding: 53px 20px; }.bwh-web-seo-art > span { font-size: 65px; }.bwh-web-search-result { padding: 21px; }\n  .bwh-web-check-grid { grid-template-columns: 1fr; }\n  .bwh-web-why-grid article { min-height: 220px; }.bwh-web-why-grid h3 { margin-top: 50px; }\n  .bwh-web-faq-grid { gap: 38px; }.bwh-web-accordion summary { font-size: 15px; }.bwh-web-accordion details p { padding-right: 5px; }\n  .bwh-web-final-cta { padding: 75px 0; }.bwh-web-final-grid { gap: 38px; }\n  .bwh-web-direct-contact { flex-direction: column; align-items: flex-start; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .bwh-web-page *, .bwh-web-page *::before, .bwh-web-page *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }\n}\n<\/style>\n\n<script data-wp-block-html=\"js\">\n\/* Brand Web Hub \u2014 Website service page interactions *\/\n(function () {\n  'use strict';\n\n  var page = document.querySelector('.bwh-web-page');\n  if (!page) return;\n\n  page.classList.add('bwh-web-js');\n\n  var revealItems = page.querySelectorAll('.bwh-web-reveal');\n  var reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;\n\n  if (reduceMotion || !('IntersectionObserver' in window)) {\n    revealItems.forEach(function (item) {\n      item.classList.add('bwh-web-visible');\n    });\n  } else {\n    var revealObserver = new IntersectionObserver(function (entries, observer) {\n      entries.forEach(function (entry) {\n        if (entry.isIntersecting) {\n          entry.target.classList.add('bwh-web-visible');\n          observer.unobserve(entry.target);\n        }\n      });\n    }, { threshold: 0.12, rootMargin: '0px 0px -35px 0px' });\n\n    revealItems.forEach(function (item) {\n      revealObserver.observe(item);\n    });\n  }\n\n  \/* Keep only one FAQ item open at a time. *\/\n  var faqItems = page.querySelectorAll('.bwh-web-accordion details');\n  faqItems.forEach(function (item) {\n    item.addEventListener('toggle', function () {\n      if (!item.open) return;\n      faqItems.forEach(function (otherItem) {\n        if (otherItem !== item) otherItem.removeAttribute('open');\n      });\n    });\n  });\n\n  \/* Add Service and FAQ structured data without changing visible content. *\/\n  if (!document.getElementById('bwh-web-schema')) {\n    var schema = {\n      '@context': 'https:\/\/schema.org',\n      '@graph': [\n        {\n          '@type': 'Service',\n          'name': 'Website Design and Development',\n          'serviceType': 'Business Website Design and Development',\n          'provider': {\n            '@type': 'Organization',\n            'name': 'Brand Web Hub',\n            'url': 'https:\/\/brandwebhub.com\/'\n          },\n          'areaServed': {\n            '@type': 'Country',\n            'name': 'Sri Lanka'\n          },\n          'description': 'Responsive, SEO-friendly static and dynamic website design and development for Sri Lankan businesses, hotels, travel companies, education providers, audit firms, construction companies and professional services.'\n        },\n        {\n          '@type': 'FAQPage',\n          'mainEntity': [\n            {\n              '@type': 'Question',\n              'name': 'How much does a business website cost?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'The cost depends on the number of pages, design requirements, content, integrations and functionality. Brand Web Hub provides a quotation after confirming the project scope.'\n              }\n            },\n            {\n              '@type': 'Question',\n              'name': 'How long does website design and development take?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'A focused company website may take a few weeks, while a larger dynamic website needs more time for content, features and testing. A practical timeline is confirmed before work begins.'\n              }\n            },\n            {\n              '@type': 'Question',\n              'name': 'Should my company choose a static or dynamic website?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'A static website suits a focused set of pages with infrequent updates. A dynamic website is better when a team needs to publish news, tours, rooms, projects, services or other changing content.'\n              }\n            },\n            {\n              '@type': 'Question',\n              'name': 'Will the website work properly on mobile phones?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'Yes. Brand Web Hub uses a mobile-first responsive approach for phones, tablets, laptops and desktop computers.'\n              }\n            },\n            {\n              '@type': 'Question',\n              'name': 'Do you provide SEO with the website?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'Every build includes an SEO-ready structure and on-page foundations. Ongoing SEO and content services can be added separately.'\n              }\n            },\n            {\n              '@type': 'Question',\n              'name': 'Can you redesign or maintain an existing website?',\n              'acceptedAnswer': {\n                '@type': 'Answer',\n                'text': 'Yes. Brand Web Hub can review and improve existing websites through redesign, performance optimisation, content updates, maintenance and new functionality.'\n              }\n            }\n          ]\n        }\n      ]\n    };\n\n    var schemaScript = document.createElement('script');\n    schemaScript.id = 'bwh-web-schema';\n    schemaScript.type = 'application\/ld+json';\n    schemaScript.textContent = JSON.stringify(schema);\n    document.head.appendChild(schemaScript);\n  }\n}());\n<\/script>\n\n<!-- Brand Web Hub | Website Design & Development Service Page -->\n<main class=\"bwh-web-page\" id=\"bwh-web-main\">\n  <!-- INTRO -->\n  <section class=\"bwh-web-section bwh-web-intro\" aria-labelledby=\"bwh-web-intro-title\">\n    <div class=\"bwh-web-shell bwh-web-intro-grid\">\n      <div class=\"bwh-web-section-heading bwh-web-reveal\">\n        <p class=\"bwh-web-kicker\">More than a good-looking website<\/p>\n        <h2 id=\"bwh-web-intro-title\">Your website should be your <em>best business tool.<\/em><\/h2>\n      <\/div>\n      <div class=\"bwh-web-rich-copy bwh-web-reveal\" style=\"--bwh-delay:100ms\">\n        <p>\n          A professional website should do more than introduce your company. It should build trust,\n          explain your value clearly, appear in relevant Google searches and guide visitors towards\n          calling, messaging, booking or requesting a quotation.\n        <\/p>\n        <p>\n          Our website design and development service combines brand-focused UI\/UX design, reliable\n          development, mobile optimisation, technical SEO and conversion-focused content structure.\n          The result is a website that works smoothly today and can grow with your organisation.\n        <\/p>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- INDUSTRIES -->\n  <section class=\"bwh-web-section bwh-web-industries\" aria-labelledby=\"bwh-web-industries-title\">\n    <div class=\"bwh-web-shell\">\n      <div class=\"bwh-web-section-heading bwh-web-heading-row bwh-web-reveal\">\n        <div>\n          <p class=\"bwh-web-kicker\">Industries we understand<\/p>\n          <h2 id=\"bwh-web-industries-title\">Web solutions shaped around <em>your sector.<\/em><\/h2>\n        <\/div>\n        <p>Different industries need different customer journeys. We plan the right pages, functions and calls to action for each business.<\/p>\n      <\/div>\n\n      <div class=\"bwh-web-industry-grid\">\n        <article class=\"bwh-web-industry-card bwh-web-reveal\"><span>01<\/span><b>\u2708<\/b><h3>Travel &amp; Tourism<\/h3><p>Tour operators, destination specialists, travel agents and transport providers.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:60ms\"><span>02<\/span><b>\u2302<\/b><h3>Hotels &amp; Villas<\/h3><p>Hotels, resorts, guest houses, villas, restaurants and hospitality brands.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:120ms\"><span>03<\/span><b>\u2605<\/b><h3>Education<\/h3><p>Schools, preschools, academies, tutors, institutes and training providers.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:180ms\"><span>04<\/span><b>\u25a6<\/b><h3>Audit &amp; Accounting<\/h3><p>Audit firms, accountants, tax consultants and corporate advisory services.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\"><span>05<\/span><b>\u25b3<\/b><h3>Construction<\/h3><p>Building contractors, architects, engineers and interior design companies.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:60ms\"><span>06<\/span><b>\u25c6<\/b><h3>Real Estate<\/h3><p>Property developers, agents, apartment projects and land sales companies.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:120ms\"><span>07<\/span><b>\u25c9<\/b><h3>Professional Services<\/h3><p>Consultants, legal practices, recruitment firms and business service providers.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:180ms\"><span>08<\/span><b>\u273b<\/b><h3>Food &amp; Export<\/h3><p>Food suppliers, seafood businesses, exporters, importers and manufacturers.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\"><span>09<\/span><b>\u271a<\/b><h3>Healthcare &amp; Wellness<\/h3><p>Clinics, medical centres, wellness brands and appointment-based services.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:60ms\"><span>10<\/span><b>\u25ce<\/b><h3>Nonprofits &amp; Associations<\/h3><p>Professional bodies, charities, clubs and community organisations.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:120ms\"><span>11<\/span><b>\u25a3<\/b><h3>Retail &amp; Services<\/h3><p>Local businesses, service centres, showrooms and growing consumer brands.<\/p><\/article>\n        <article class=\"bwh-web-industry-card bwh-web-reveal\" style=\"--bwh-delay:180ms\"><span>12<\/span><b>\u25c8<\/b><h3>Startups &amp; Technology<\/h3><p>New ventures, SaaS products, digital platforms and technology companies.<\/p><\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- STATIC \/ DYNAMIC -->\n  <section class=\"bwh-web-section bwh-web-solutions\" aria-labelledby=\"bwh-web-solutions-title\">\n    <div class=\"bwh-web-shell\">\n      <div class=\"bwh-web-section-heading bwh-web-heading-row bwh-web-reveal\">\n        <div>\n          <p class=\"bwh-web-kicker\">The right build for your goal<\/p>\n          <h2 id=\"bwh-web-solutions-title\">Static or dynamic? <em>We make it simple.<\/em><\/h2>\n        <\/div>\n        <p>We recommend the most practical solution based on your content, required functions, budget and future plans.<\/p>\n      <\/div>\n\n      <div class=\"bwh-web-solution-grid\">\n        <article class=\"bwh-web-solution-card bwh-web-reveal\">\n          <div class=\"bwh-web-solution-top\"><span>01<\/span><small>Focused &amp; fast<\/small><\/div>\n          <h3>Static Company Websites<\/h3>\n          <p>Ideal for businesses that need a professional online presence with a focused number of pages and content that does not change often.<\/p>\n          <ul>\n            <li>Company profile and service pages<\/li>\n            <li>Fast-loading, responsive layouts<\/li>\n            <li>Contact, call and WhatsApp actions<\/li>\n            <li>Google Maps and social integration<\/li>\n            <li>On-page SEO foundations<\/li>\n          <\/ul>\n          <a href=\"https:\/\/brandwebhub.com\/contact\/\">Discuss a static website <span aria-hidden=\"true\">\u2192<\/span><\/a>\n        <\/article>\n\n        <article class=\"bwh-web-solution-card bwh-web-solution-featured bwh-web-reveal\" style=\"--bwh-delay:100ms\">\n          <div class=\"bwh-web-solution-top\"><span>02<\/span><small>Flexible &amp; scalable<\/small><\/div>\n          <h3>Dynamic Business Websites<\/h3>\n          <p>Best for organisations that regularly publish content, manage listings, accept enquiries or need custom functionality and room to expand.<\/p>\n          <ul>\n            <li>Easy WordPress content management<\/li>\n            <li>News, projects, rooms or tour listings<\/li>\n            <li>Enquiry, booking and quotation forms<\/li>\n            <li>User roles and custom integrations<\/li>\n            <li>Scalable features for future growth<\/li>\n          <\/ul>\n          <a href=\"https:\/\/brandwebhub.com\/contact\/\">Discuss a dynamic website <span aria-hidden=\"true\">\u2192<\/span><\/a>\n        <\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- SERVICES -->\n  <section class=\"bwh-web-section bwh-web-included\" aria-labelledby=\"bwh-web-included-title\">\n    <div class=\"bwh-web-shell\">\n      <div class=\"bwh-web-section-heading bwh-web-reveal\">\n        <p class=\"bwh-web-kicker\">What is included<\/p>\n        <h2 id=\"bwh-web-included-title\">Everything needed to launch with <em>confidence.<\/em><\/h2>\n      <\/div>\n      <div class=\"bwh-web-feature-grid\">\n        <article class=\"bwh-web-feature bwh-web-reveal\"><span>01<\/span><h3>Strategy &amp; Page Planning<\/h3><p>We organise your sitemap, content flow and calls to action around real customer needs.<\/p><\/article>\n        <article class=\"bwh-web-feature bwh-web-reveal\" style=\"--bwh-delay:60ms\"><span>02<\/span><h3>Custom UI\/UX Design<\/h3><p>A distinctive visual direction that fits your identity instead of a generic copied template.<\/p><\/article>\n        <article class=\"bwh-web-feature bwh-web-reveal\" style=\"--bwh-delay:120ms\"><span>03<\/span><h3>Responsive Development<\/h3><p>Clean layouts tested for mobile phones, tablets, laptops and large desktop screens.<\/p><\/article>\n        <article class=\"bwh-web-feature bwh-web-reveal\"><span>04<\/span><h3>SEO-Ready Foundation<\/h3><p>Logical headings, clean URLs, metadata guidance, schema opportunities and crawlable content.<\/p><\/article>\n        <article class=\"bwh-web-feature bwh-web-reveal\" style=\"--bwh-delay:60ms\"><span>05<\/span><h3>Speed &amp; Security<\/h3><p>Optimised assets, reliable configuration and practical protection for a stronger website.<\/p><\/article>\n        <article class=\"bwh-web-feature bwh-web-reveal\" style=\"--bwh-delay:120ms\"><span>06<\/span><h3>Training &amp; Support<\/h3><p>Clear handover guidance plus dependable support when your website needs attention.<\/p><\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- MID CTA -->\n  <section class=\"bwh-web-mid-cta\" aria-label=\"Website project enquiry\">\n    <div class=\"bwh-web-shell bwh-web-mid-cta-inner bwh-web-reveal\">\n      <div><p>Have a website idea?<\/p><h2>Let\u2019s turn it into a digital experience that moves your business forward.<\/h2><\/div>\n      <a class=\"bwh-web-btn bwh-web-btn-light\" href=\"https:\/\/brandwebhub.com\/contact\/\">Tell us about your project <span aria-hidden=\"true\">\u2197<\/span><\/a>\n    <\/div>\n  <\/section>\n\n  <!-- PROCESS -->\n  <section class=\"bwh-web-section bwh-web-process\" aria-labelledby=\"bwh-web-process-title\">\n    <div class=\"bwh-web-shell bwh-web-process-grid\">\n      <div class=\"bwh-web-section-heading bwh-web-process-heading bwh-web-reveal\">\n        <p class=\"bwh-web-kicker\">Our website process<\/p>\n        <h2 id=\"bwh-web-process-title\">Clear steps. <em>No mystery.<\/em><\/h2>\n        <p>From the first discussion to launch day, you always know what we are building and what comes next.<\/p>\n        <a class=\"bwh-web-text-link\" href=\"https:\/\/brandwebhub.com\/contact\/\">Start the conversation <span aria-hidden=\"true\">\u2192<\/span><\/a>\n      <\/div>\n      <ol class=\"bwh-web-process-list\">\n        <li class=\"bwh-web-reveal\"><span>01<\/span><div><h3>Discover<\/h3><p>We learn about your business, audience, competitors, goals and required website functions.<\/p><\/div><\/li>\n        <li class=\"bwh-web-reveal\"><span>02<\/span><div><h3>Plan<\/h3><p>We define the sitemap, content priorities, user journey, technology and project scope.<\/p><\/div><\/li>\n        <li class=\"bwh-web-reveal\"><span>03<\/span><div><h3>Design<\/h3><p>We shape a responsive interface that reflects your brand and makes information easy to find.<\/p><\/div><\/li>\n        <li class=\"bwh-web-reveal\"><span>04<\/span><div><h3>Develop<\/h3><p>We build the approved design, configure features and optimise performance across devices.<\/p><\/div><\/li>\n        <li class=\"bwh-web-reveal\"><span>05<\/span><div><h3>Test &amp; Launch<\/h3><p>We check content, forms, responsiveness and key SEO items before publishing the website.<\/p><\/div><\/li>\n        <li class=\"bwh-web-reveal\"><span>06<\/span><div><h3>Support &amp; Grow<\/h3><p>We provide handover support and can continue with maintenance, SEO and future improvements.<\/p><\/div><\/li>\n      <\/ol>\n    <\/div>\n  <\/section>\n\n  <!-- SEO CONTENT -->\n  <section class=\"bwh-web-section bwh-web-seo\" aria-labelledby=\"bwh-web-seo-title\">\n    <div class=\"bwh-web-shell bwh-web-seo-grid\">\n      <div class=\"bwh-web-seo-art bwh-web-reveal\" aria-hidden=\"true\">\n        <span>SEARCH<\/span><strong>01<\/strong>\n        <div class=\"bwh-web-search-box\"><i><\/i><b>your service in Sri Lanka<\/b><small>\u2192<\/small><\/div>\n        <div class=\"bwh-web-search-result\"><small>YOURBRAND.LK<\/small><b>A clear page title for the right audience<\/b><i><\/i><i><\/i><\/div>\n      <\/div>\n      <div class=\"bwh-web-rich-copy bwh-web-reveal\" style=\"--bwh-delay:100ms\">\n        <p class=\"bwh-web-kicker\">Built to be found<\/p>\n        <h2 id=\"bwh-web-seo-title\">SEO-friendly website development from the <em>first line of code.<\/em><\/h2>\n        <p>\n          Search visibility starts with a strong technical and content foundation. We create logical\n          page structures, helpful headings, readable URLs, internal linking opportunities and mobile-friendly\n          layouts so search engines and customers can understand your website more easily.\n        <\/p>\n        <p>\n          We also plan service and industry pages around genuine search intent. This gives your business a\n          stronger platform for ongoing search engine optimisation, content marketing and local SEO\u2014not a\n          website that needs to be rebuilt before marketing can begin.\n        <\/p>\n        <ul class=\"bwh-web-check-grid\">\n          <li>Semantic page structure<\/li><li>Mobile usability<\/li><li>Speed optimisation<\/li>\n          <li>Metadata guidance<\/li><li>Internal link planning<\/li><li>Schema opportunities<\/li>\n        <\/ul>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- WHY BWH -->\n  <section class=\"bwh-web-section bwh-web-why\" aria-labelledby=\"bwh-web-why-title\">\n    <div class=\"bwh-web-shell\">\n      <div class=\"bwh-web-section-heading bwh-web-heading-row bwh-web-reveal\">\n        <div><p class=\"bwh-web-kicker\">Why Brand Web Hub<\/p><h2 id=\"bwh-web-why-title\">Small enough to care. <em>Experienced enough to deliver.<\/em><\/h2><\/div>\n        <p>We work closely with a focused number of clients, giving each website the attention needed to become a useful long-term asset.<\/p>\n      <\/div>\n      <div class=\"bwh-web-why-grid\">\n        <article class=\"bwh-web-reveal\"><strong>01<\/strong><h3>Business-first thinking<\/h3><p>Design decisions connect back to your audience, service and commercial goal.<\/p><\/article>\n        <article class=\"bwh-web-reveal\" style=\"--bwh-delay:60ms\"><strong>02<\/strong><h3>Direct communication<\/h3><p>Clear, practical guidance without unnecessary technical complications.<\/p><\/article>\n        <article class=\"bwh-web-reveal\" style=\"--bwh-delay:120ms\"><strong>03<\/strong><h3>Designed for Sri Lanka<\/h3><p>Local support with an understanding of Sri Lankan industries and customers.<\/p><\/article>\n        <article class=\"bwh-web-reveal\" style=\"--bwh-delay:180ms\"><strong>04<\/strong><h3>Ready for tomorrow<\/h3><p>A scalable foundation for new pages, features, campaigns and business growth.<\/p><\/article>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- FAQ -->\n  <section class=\"bwh-web-section bwh-web-faq\" aria-labelledby=\"bwh-web-faq-title\">\n    <div class=\"bwh-web-shell bwh-web-faq-grid\">\n      <div class=\"bwh-web-section-heading bwh-web-reveal\">\n        <p class=\"bwh-web-kicker\">Frequently asked questions<\/p>\n        <h2 id=\"bwh-web-faq-title\">Before we build, <em>let\u2019s make things clear.<\/em><\/h2>\n        <p>Need an answer specific to your company? Call us on <a href=\"tel:+94770777272\">+94 77 077 72 72<\/a>.<\/p>\n      <\/div>\n      <div class=\"bwh-web-accordion bwh-web-reveal\" style=\"--bwh-delay:100ms\">\n        <details open=\"\"><summary>How much does a business website cost?<span><\/span><\/summary><p>The cost depends on the number of pages, design requirements, content, integrations and functionality. After a short discussion, we provide a clear quotation based on your actual scope.<\/p><\/details>\n        <details><summary>How long does website design and development take?<span><\/span><\/summary><p>A focused company website may take a few weeks, while a larger dynamic website needs more time for content, features and testing. We confirm a practical timeline before starting.<\/p><\/details>\n        <details><summary>Should my company choose a static or dynamic website?<span><\/span><\/summary><p>A static website suits a smaller set of pages with infrequent updates. A dynamic website is better when your team needs to add news, tours, rooms, projects, services or other changing content.<\/p><\/details>\n        <details><summary>Will the website work properly on mobile phones?<span><\/span><\/summary><p>Yes. We use a mobile-first, responsive approach so the content and main actions remain easy to use across phones, tablets and desktop computers.<\/p><\/details>\n        <details><summary>Do you provide SEO with the website?<span><\/span><\/summary><p>Every build includes an SEO-ready structure and on-page foundations. Ongoing SEO, content creation and growth campaigns can be provided as an additional service.<\/p><\/details>\n        <details><summary>Can you redesign or maintain our existing website?<span><\/span><\/summary><p>Yes. We can review an existing website, recommend improvements and help with redesign, performance, content, maintenance or additional functionality.<\/p><\/details>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- FINAL CTA -->\n  <section class=\"bwh-web-final-cta\" id=\"bwh-web-contact\" aria-labelledby=\"bwh-web-contact-title\">\n    <div class=\"bwh-web-shell bwh-web-final-grid\">\n      <div class=\"bwh-web-reveal\">\n        <p class=\"bwh-web-eyebrow\"><span><\/span> Start a website project<\/p>\n        <h2 id=\"bwh-web-contact-title\">Ready for a website that works as hard as <em>you do?<\/em><\/h2>\n      <\/div>\n      <div class=\"bwh-web-final-side bwh-web-reveal\" style=\"--bwh-delay:100ms\">\n        <p>Tell us about your company, current challenges and the website you want to build. We\u2019ll help you choose the right next step.<\/p>\n        <a class=\"bwh-web-btn bwh-web-btn-primary\" href=\"https:\/\/brandwebhub.com\/contact\/\">Request your free consultation <span aria-hidden=\"true\">\u2197<\/span><\/a>\n        <div class=\"bwh-web-direct-contact\">\n          <a href=\"mailto:info@brandwebhub.com\">info@brandwebhub.com<\/a>\n          <a href=\"tel:+94770777272\">+94 77 077 72 72<\/a>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n<\/main>\n","protected":false},"excerpt":{"rendered":"<p>More than a good-looking website Your website should be your best business tool. A professional website should do more than [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-74","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/pages\/74","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brandwebhub.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=74"}],"version-history":[{"count":5,"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/pages\/74\/revisions"}],"predecessor-version":[{"id":93,"href":"https:\/\/brandwebhub.com\/index.php?rest_route=\/wp\/v2\/pages\/74\/revisions\/93"}],"wp:attachment":[{"href":"https:\/\/brandwebhub.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=74"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}