<div class="js-component relative z-0 container component-spacer-margin">
<div class="bg-gradient-to-b relative text-white rounded-2xl overflow-hidden bg-bravo">
<div class="flex flex-col items-center justify-center px-8 py-12 lg:py-24 relative z-10">
<div class="max-w-4xl text-center">
<div class="uppercase text-white mb-4 font-semibold">Faster Speeds</div>
<h2 class="text-4xl lg:6xl xl:text-8xl font-heading font-extrabold leading-tight text-white">Full fibre speeds are much faster than regular part fibre</h2>
<div class="prose prose-p:leading-snug prose-xl lg:prose-2xl mt-4 text-white">
<p> Full fibre runs directly to your house, giving you the fastest and most reliable speeds. Most rural properties do not have full fibre installed - That’s where we make the difference.</p>
</div>
</div>
<div class="mt-10">
<a href="./.html" class="btn group bg-white text-bravo border-2 border-white">
<div class="relative z-10 group-hover:-translate-x-2 transition ease-in-out duration-300">
Find out more
</div>
<div class="w-3.5 h-3.5 absolute right-2 top-2/4 translate-x-2 -translate-y-2/4 -rotate-90 transition-all ease-in-out duration-300 fill-current opacity-0 group-hover:-translate-x-2 group-hover:opacity-100">
<svg class="w-full h-full fill-current" aria-hidden="true">
<use href="/front-end/sprite.svg?v=1.2#icon-chevron"></use>
</svg>
</div>
</a>
</div>
</div>
</div>
</div>
{% if buttonColour %}
{% set buttonModifier = buttonColour %}
{% else %}
{% set buttonModifier = 'default' %}
{% endif %}
{% if theme %}
{% set bgColourClass = theme.bgColour %}
{% set textColourClass = theme.textColour %}
{% set richTextColourClass = theme.richTextColour %}
{% else %}
{% set bgColourClass = 'bg-grey-50' %}
{% set textColourClass = 'text-bravo' %}
{% set richTextColourClass = 'text-grey-600' %}
{% endif %}
<div class="js-component relative z-0 container component-spacer-margin">
<div class="bg-gradient-to-b relative text-white rounded-2xl overflow-hidden {{ bgColourClass }}">
<div class="flex flex-col items-center justify-center px-8 py-12 lg:py-24 relative z-10">
<div class="max-w-4xl text-center">
<div class="uppercase {{ textColourClass }} mb-4 font-semibold">Faster Speeds</div>
<h2 class="text-4xl lg:6xl xl:text-8xl font-heading font-extrabold leading-tight {{ textColourClass }}">{{heading}}</h2>
<div class="prose prose-p:leading-snug prose-xl lg:prose-2xl mt-4 {{ richTextColourClass }}">
<p>{{description}}</p>
</div>
</div>
{% if link %}
<div class="mt-10">
{% render "@button--" + buttonModifier, link, true %}
</div>
{% endif %}
</div>
{% if backgroundImage %}
<picture class="w-full h-full z-0 top-0 left-0 absolute {{ backgroundImageOpacity }}">
<img alt="" data-srcset="{{ backgroundImage | path }}" class="lazyload object-cover object-center w-full h-full" />
</picture>
{% endif %}
</div>
</div>
{
"siteName": "Gigaclear Pattern Library",
"heading": "Full fibre speeds are much faster than regular part fibre",
"description": " Full fibre runs directly to your house, giving you the fastest and most reliable speeds. Most rural properties do not have full fibre installed - That’s where we make the difference.",
"link": {
"text": "Find out more",
"url": "./"
},
"buttonColour": "white",
"theme": {
"bgColour": "bg-bravo",
"textColour": "text-white",
"richTextColour": "text-white"
}
}
No notes defined.