<div class="absolute top-0 w-full h-[50px] z-30 flex-shrink-0 flex-grow-0 hidden lg:block overflow-hidden js-top-nav [&[data-nav-theme='contrast']]:bg-white" data-nav-theme="">
<div class="container relative flex justify-between">
<div class="flex relative after:bg-bravo after:absolute after:right-0 after:translate-x-full after:w-[300vw] after:h-full before:bg-bravo before:absolute before:left-0 before:-translate-x-full before:w-[300vw] before:h-full before:z-50 ">
<a href="./index.html" class="bg-bravo text-white py-3 px-7 relative z-10 rounded-br-2xl">
Home
</a>
<a href="./business.html" class="bg-bravo text-white py-3 px-7 relative z-10 rounded-bl-2xl">
Business
</a>
</div>
<ul class="flex justify-end space-x-10 py-3 border border-bravo">
<li class="relative">
<a class="text-white text-1xl lg:text-base flex items-center font-bold lg:font-extrabold hover:underline" href="./login.html">
<div class="w-5 h-5 mr-1.5">
<svg class="w-full h-full fill-current text-white" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-user"></use>
</svg>
</div>
Login
</a>
</li>
<li class="relative">
<a class="text-white text-1xl lg:text-base flex items-center font-bold lg:font-extrabold hover:underline" href="./contact-us.html">
Contact us
</a>
</li>
</ul>
</div>
</div>
<header data-nav-theme="" class="absolute top-0 lg:top-[50px] lg:[[data-is-sticky]]:top-0 w-full z-20 transition-transform ease-in-out duration-500 flex-shrink-0 flex-grow-0 will-change-transform" data-vanilla-module="StickyHeader">
<div class="bg-nav-bg py-7 relative lg:[[data-is-sticky]_&]:shadow-nav">
<div class="container">
<div class="flex flex-row justify-between items-stretch">
<a href="./index.html" class="flex items-center justify-center w-36 lg:w-44 xl:w-48 2xl:w-auto invert brightness-0 [[data-nav-theme='contrast']_&]:invert-0 [[data-nav-theme='contrast']_&]:brightness-100">
<img src="/front-end/images/logo.svg" class="" alt="Gigaclear" width="250" height="47" />
</a>
<div class="flex items-center lg:items-stretch lg:justify-end lg:flex-1 lg:pl-4">
<button aria-controls="menu" aria-expanded="false" data-vanilla-module="MobileMenuToggle" class="w-8 h-6 block relative transform lg:hidden text-nav-fg group" data-state="off">
<span aria-hidden="true" class="block rounded-md absolute h-1 w-8 bg-current transform transition duration-500 ease-in-out group-data-[state=off]:-translate-y-2 group-data-[state=on]:rotate-45"></span>
<span aria-hidden="true" class="block rounded-md absolute h-1 w-8 bg-current transform transition duration-500 ease-in-out group-data-[state=on]:opacity-0"></span>
<span aria-hidden="true" class="block rounded-md absolute h-1 w-8 bg-current transform transition duration-500 ease-in-out group-data-[state=off]:translate-y-2 group-data-[state=on]:-rotate-45"></span>
<span class="sr-only">Toggle Menu</span>
</button>
<nav id="menu" data-vanilla-module="Menu" class="bg-nav-bg items-center h-[calc(100dvh-var(--mobile-header-height))] hidden absolute overflow-hidden lg:overflow-visible z-50 top-full left-0 w-full lg:h-auto lg:flex lg:bg-transparent lg:static lg:p-0 lg:left-auto lg:w-auto">
<div class="overflow-y-auto lg:overflow-visible h-full js-menu-overlay flex">
<div class="max-lg:container">
<ul class="overflow-y-auto lg:bg-transparent lg:h-full lg:flex lg:items-center lg:overflow-visible">
<li class="js-menu-item lg:pr-[clamp(1.25rem,2vw,2.25rem)] lg:last:pr-0 lg:border-b-0 flex justify-between lg:h-full lg:items-center ">
<button class="js-mobile-second-level-trigger-forward font-bold text-nav-fg h-full relative py-3 flex flex-1 items-center text-3xl transition duration-150 lg:p-0 lg:text-[clamp(0.9rem,0.9vw+0.25rem,1.125rem)] hover:bg-alpha-dark lg:hover:bg-transparent lg:after:transition-opacity lg:after:duration-300 lg:after:ease-in-out lg:after:w-full lg:after:absolute lg:after:h-1 lg:after:-bottom-2 lg:after:bg-nav-fg lg:before:transition-opacity lg:before:duration-300 lg:before:ease-in-out lg:before:w-full lg:before:absolute lg:before:h-1 lg:before:-bottom-2 lg:before:bg-transparent lg:hover:before:bg-nav-fg lg:after:opacity-0" aria-expanded="false" aria-controls="second-level-menu-packages" aria-haspopup="true">
Packages
<div class="w-3 h-3 ml-2 mt-0.5 hidden lg:block transition-transform duration-200 [[aria-expanded='true']_&]:rotate-180">
<svg class="w-full h-full fill-current text-current text-nav-arrow" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-chevron"></use>
</svg>
</div>
<div class="h-10 w-10 pl-3 border-l border-l-nav-fg ml-auto lg:hidden">
<svg class="w-full h-full fill-current transform text-nav-arrow" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-arrow"></use>
</svg>
</div>
</button>
<div id="second-level-menu-packages" class="js-second-level-panel invisible lg:invisible z-50 transition-transform duration-300 bg-white absolute translate-x-full w-full h-full top-0 lg:top-full left-0 lg:pt-7 lg:overflow-y-visible lg:bg-transparent lg:h-auto lg:-translate-y-7 lg:opacity-0 lg:translate-x-0 lg:transition-none lg:z-40 lg:data-[open]:visible lg:data-[open]:opacity-100">
<div class="overflow-y-auto lg:overflow-visible h-full lg:[[data-nav-theme='contrast']_&]:border-t lg:[[data-nav-theme='contrast']_&]:border-t-grey-200">
<div class="max-lg:container">
<div class="h-full lg:h-auto z-20 lg:relative lg:bg-white">
<div class="h-full lg:h-auto lg:container lg:py-12">
<button class="js-mobile-second-level-trigger-back w-full lg:hidden bg-white py-4 flex items-center text-nav-fg" aria-controls="second-level-menu-packages" aria-expanded="false">
<div class="w-5 h-5 mr-3">
<svg class="w-full h-full fill-current text-nav-arrow transform rotate-90" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-chevron"></use>
</svg>
</div>
<div class="font-semibold text-3xl bg-white text-nav-fg lg:hidden hover:underline">
Packages
</div>
</button>
<div class="pt-6 lg:pt-0 space-y-4 lg:space-y-0 lg:grid lg:grid-cols-12 lg:gap-12 border-t border-t-grey-200 lg:border-0">
<div class="lg:col-span-3">
<ul>
<li>
<h2 class="flex font-heading font-extrabold leading-tight text-nav-fg lg:block lg:text-bravo lg:mb-2 lg:pb-2">
<span class="flex-1 py-2 lg:p-0 text-3xl lg:text-2xl lg:block">Our Products</span>
</h2>
<div class="overflow-y-auto lg:overflow-visible h-full w-full">
<div class="lg:flex lg:space-x-8">
<ul class="lg:flex-1">
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Product 1</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Product 2</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Product 3</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Product 4</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Product 5</a>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
<div class="lg:col-span-6">
<ul>
<li>
<h2 class="flex font-heading font-extrabold leading-tight text-nav-fg lg:block lg:text-bravo lg:mb-2 lg:pb-2">
<span class="flex-1 py-2 lg:p-0 text-3xl lg:text-2xl lg:block">Services</span>
</h2>
<div class="overflow-y-auto lg:overflow-visible h-full w-full">
<div class="lg:flex lg:space-x-8">
<ul class="lg:flex-1">
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 1</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 2</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 3</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 4</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 5</a>
</li>
</ul>
<ul class="lg:flex-1">
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 6</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 7</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 8</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 9</a>
</li>
<li class="lg:mb-2">
<a class="text-nav-fg lg:text-bravo font-bold text-2xl hover:bg-white block lg:inline-block py-2 lg:p-0 lg:text-base xl:text-lg lg:hover:bg-transparent transition-colors ease-in-out duration-200 lg:hover:text-alpha lg:hover:underline" href="./index.html">Service 10</a>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
<div class="flex-grow-0 py-4 max-w-md lg:max-w-none lg:p-0 lg:col-span-3">
<h2 class="font-heading font-extrabold leading-tight text-2xl text-bravo mb-2 lg:pb-2">
Featured
</h2>
<a class="bg-grey-50 px-4 py-4 xl:px-6 xl:py-7 shadow-card block rounded-lg border border-grey-200 hover:cta-gradient-border relative overflow-hidden group" href="./index.html">
<div class="bg-brand-gradient-2 absolute top-0 left-0 w-full h-26 angled-mask-mega-card z-0"></div>
<div class="mb-4 xl:mb-7 relative z-10 rounded-md overflow-hidden">
<picture class="block overflow-hidden transition ease-in-out duration-300 group-hover:scale-110 w-full">
<img class="lazyload w-full" alt="" width="1200" height="675" data-sizes="auto" data-srcset="/front-end/images/test-imagery/example1@16-9@1200w.jpg 1200w" data-src="/front-end/images/test-imagery/example1@16-9@1200w.jpg">
</picture>
</div>
<div>
<h2 class="text-bravo font-extrabold mb-3 text-xl xl:text-xl">Our main service</h2>
<p class="text-grey-600 leading-snug text-base xl:text-lg"> Lorem ipsum dolor sit amet consectetur adipisicing elit sed do eiusmod tempor </p>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<li class="js-menu-item lg:pr-[clamp(1.25rem,2vw,2.25rem)] lg:last:pr-0 lg:border-b-0 flex justify-between lg:h-full lg:items-center ">
<a class="font-bold h-full relative py-3 px-4 flex flex-1 items-center text-3xl lg:hover:underline transition duration-150 text-nav-fg lg:p-0 lg:text-[clamp(0.9rem,0.9vw+0.25rem,1.125rem)] hover:bg-alpha-dark lg:hover:bg-transparent lg:after:transition-opacity lg:after:duration-300 lg:after:ease-in-out lg:after:w-full lg:after:absolute lg:after:h-1 lg:after:-bottom-2 lg:after:bg-nav-fg lg:before:transition-opacity lg:before:duration-300 lg:before:ease-in-out lg:before:w-full lg:before:absolute lg:before:h-1 lg:before:-bottom-2 lg:before:bg-transparent lg:hover:before:bg-nav-fg lg:after:opacity-0" href="./article-list.html">
News & insights
</a>
</li>
<li class="js-menu-item lg:pr-[clamp(1.25rem,2vw,2.25rem)] lg:last:pr-0 lg:border-b-0 flex justify-between lg:h-full lg:items-center ">
<a class="font-bold h-full relative py-3 px-4 flex flex-1 items-center text-3xl lg:hover:underline transition duration-150 text-nav-fg lg:p-0 lg:text-[clamp(0.9rem,0.9vw+0.25rem,1.125rem)] hover:bg-alpha-dark lg:hover:bg-transparent lg:after:transition-opacity lg:after:duration-300 lg:after:ease-in-out lg:after:w-full lg:after:absolute lg:after:h-1 lg:after:-bottom-2 lg:after:bg-nav-fg lg:before:transition-opacity lg:before:duration-300 lg:before:ease-in-out lg:before:w-full lg:before:absolute lg:before:h-1 lg:before:-bottom-2 lg:before:bg-transparent lg:hover:before:bg-nav-fg lg:after:opacity-0" href="./event-list.html">
Help & Support
</a>
</li>
<li class="js-menu-item lg:pr-[clamp(1.25rem,2vw,2.25rem)] lg:last:pr-0 lg:border-b-0 flex justify-between lg:h-full lg:items-center ">
<a class="font-bold h-full relative py-3 px-4 flex flex-1 items-center text-3xl lg:hover:underline transition duration-150 text-nav-fg lg:p-0 lg:text-[clamp(0.9rem,0.9vw+0.25rem,1.125rem)] hover:bg-alpha-dark lg:hover:bg-transparent lg:after:transition-opacity lg:after:duration-300 lg:after:ease-in-out lg:after:w-full lg:after:absolute lg:after:h-1 lg:after:-bottom-2 lg:after:bg-nav-fg lg:before:transition-opacity lg:before:duration-300 lg:before:ease-in-out lg:before:w-full lg:before:absolute lg:before:h-1 lg:before:-bottom-2 lg:before:bg-transparent lg:hover:before:bg-nav-fg lg:after:opacity-0" href="./event-list.html">
Our mission
</a>
</li>
</ul>
<ul class="flex mt-10 lg:hidden">
<li class="relative">
<a class="text-bravo-800 text-1xl lg:text-base flex items-center font-bold lg:font-extrabold hover:underline" href="./login.html">
<div class="w-5 h-5 mr-1.5">
<svg class="w-full h-full fill-current text-bravo-800" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-user"></use>
</svg>
</div>
Login
</a>
</li>
<li class="relative">
<a class="text-bravo-800 text-1xl lg:text-base flex items-center font-bold lg:font-extrabold hover:underline" href="./contact-us.html">
Contact us
</a>
</li>
</ul>
<div class="mt-10 lg:hidden pt-6 border-t border-t-grey-200">
<a href="./business.html" class="text-bravo-800 text-1xl lg:text-base font-bold lg:font-extrabold">
</a>
</div>
</div>
</div>
</nav>
</div>
</div>
</div>
</div>
</header>
<div class="fixed bg-black/70 z-50 -inset-0 hidden overflow-auto" id="search-modal" aria-hidden="true" data-vanilla-module="Modal">
<div tabindex="-1" class="w-full h-full flex px-4 py-12 lg:px-8" data-micromodal-close>
<div class="js-model-content w-full md:max-w-screen-md m-auto" role="dialog" aria-modal="true">
<div class="flex justify-end pb-4">
<button class="w-10 h-10 border-white group transition ease-in-out duration-300 hover:bg-white border rounded-full z-20 flex items-center justify-center" aria-label="Close modal" data-micromodal-close>
<svg class="fill-current w-5 h-5 text-white group-hover:text-bravo pointer-events-none">
<use href="/front-end/sprite.svg?v=1.2#icon-close"></use>
</svg>
<span class="sr-only">Close Search Modal</span>
</button>
</div>
<div class="js-model-content flex flex-col items-center justify-center z-10 relative bg-white p-8 shadow-xl w-full rounded-md" role="dialog" aria-modal="true">
<main class="w-full">
<form action="./search-results.html" class="pb-2">
<label class="block text-center text-4xl mb-2 text-bravo" for="modalSearchTerm">Search</label>
<div class="flex justify-center w-full items-stretch">
<div class="flex-1 mr-4">
<input class="w-full p-4 focus:ring-0 border-0 transition-colors focus:border-0 ease-in-out duration-300 focus:outline-none bg-grey-100" id="modalSearchTerm" name="searchTerm" placeholder="Search term" type="text" value="">
</div>
<button>
<span class="sr-only">Search site</span>
<div class="w-6 h-6">
<svg class="fill-current w-full h-full text-bravo transition-colors ease-in-out duration-300 hover:text-alpha">
<use href="/front-end/sprite.svg?v=1.2#icon-search"></use>
</svg>
</div>
</button>
</div>
</form>
</main>
</div>
</div>
</div>
</div>
{% set activeSectionClass = "bg-transparent [[data-nav-theme='contrast']_&]:bg-white text-white [[data-nav-theme='contrast']_&]:text-bravo-800 py-3 px-7 relative" %}
{% set inactiveSectionClass = "bg-bravo text-white py-3 px-7 relative z-10" %}
{% set topBarClass = "absolute top-0" %}
{% set headerClass = "absolute top-0 lg:top-[50px]" %}
{% if staticHeader %}
{% set topBarClass = "relative" %}
{% set headerClass = "relative" %}
{% set navTheme = "contrast" %}
{% endif %}
<div class="{{topBarClass}} w-full h-[50px] z-30 flex-shrink-0 flex-grow-0 hidden lg:block overflow-hidden js-top-nav [&[data-nav-theme='contrast']]:bg-white" data-nav-theme="{{ navTheme }}">
<div class="container relative flex justify-between">
<div class="flex relative after:bg-bravo after:absolute after:right-0 after:translate-x-full after:w-[300vw] after:h-full before:bg-bravo before:absolute before:left-0 before:-translate-x-full before:w-[300vw] before:h-full before:z-50 {% if activeSection == "personal" %}before:rounded-br-2xl {% elseif activeSection == "business" %}after:rounded-bl-2xl{% endif %}">
<a href="{{ './index' | path }}" class="{% if activeSection == "personal" %}{{ activeSectionClass }} {% else %}{{ inactiveSectionClass }} rounded-br-2xl{% endif %}">
Home
</a>
<a href="{{ './business' | path }}" class="{% if activeSection == "business" %}{{ activeSectionClass }} {% else %}{{ inactiveSectionClass }} rounded-bl-2xl{% endif %}">
Business
</a>
</div>
<ul class="flex justify-end space-x-10 py-3 border border-bravo">
{% for item in quickLinks %}
<li class="relative">
{% render "@icon-link", { name: item.name, url: item.url, icon: item.icon, colour: 'text-white' } %}
</li>
{% endfor %}
</ul>
</div>
</div>
<header {% if staticHeader %}data-static-data-nav-theme{% endif %} data-nav-theme="{{ navTheme }}" class="{{ headerClass }} lg:[[data-is-sticky]]:top-0 w-full z-20 transition-transform ease-in-out duration-500 flex-shrink-0 flex-grow-0 will-change-transform" data-vanilla-module="StickyHeader">
<div class="bg-nav-bg py-7 relative lg:[[data-is-sticky]_&]:shadow-nav">
<div class="container">
<div class="flex flex-row justify-between items-stretch">
{% render "@logo" %}
<div class="flex items-center lg:items-stretch lg:justify-end lg:flex-1 lg:pl-4">
{% render "@navigation", { pageTitle: pageTitle, navItems: navItems, quickLinks: quickLinks, dropDownButtons: dropDownButtons, activeSection: activeSection } %}
</div>
</div>
</div>
</div>
</header>
{% render "@search-modal" %}
{
"siteName": "Gigaclear Pattern Library",
"quickLinks": [
{
"name": "Login",
"url": "./login",
"icon": "icon-user"
},
{
"name": "Contact us",
"url": "./contact-us"
}
],
"navItems": [
{
"menu_item": "Packages",
"url": "./products",
"megaList": [
{
"component": "mega-secondary-list",
"data": {
"colHeading": "Our Products",
"columns": [
{
"list": [
{
"url": "./index",
"name": "Product 1"
},
{
"url": "./index",
"name": "Product 2"
},
{
"url": "./index",
"name": "Product 3"
},
{
"url": "./index",
"name": "Product 4"
},
{
"url": "./index",
"name": "Product 5"
}
]
}
]
}
},
{
"component": "mega-secondary-list",
"data": {
"colHeading": "Services",
"columns": [
{
"list": [
{
"url": "./index",
"name": "Service 1"
},
{
"url": "./index",
"name": "Service 2"
},
{
"url": "./index",
"name": "Service 3"
},
{
"url": "./index",
"name": "Service 4"
},
{
"url": "./index",
"name": "Service 5"
}
]
},
{
"list": [
{
"url": "./index",
"name": "Service 6"
},
{
"url": "./index",
"name": "Service 7"
},
{
"url": "./index",
"name": "Service 8"
},
{
"url": "./index",
"name": "Service 9"
},
{
"url": "./index",
"name": "Service 10"
}
]
}
]
}
},
{
"component": "mega-card",
"data": {
"colHeading": "Featured",
"url": "./index",
"heading": "Our main service",
"description": "Lorem ipsum dolor sit amet consectetur adipisicing elit sed do eiusmod tempor",
"image": {
"src": "images/test-imagery/example1@16-9@1200w.jpg",
"srcSet": [
{
"url": "images/test-imagery/example1@16-9@1200w.jpg",
"size": "1200"
}
]
}
}
}
]
},
{
"menu_item": "News & insights",
"url": "./article-list"
},
{
"menu_item": "Help & Support",
"url": "./event-list"
},
{
"menu_item": "Our mission",
"url": "./event-list"
}
]
}
No notes defined.