+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'CivicTheme is an open-source design system build for modern web development. It offers a comprehensive suite of customisable components and templates designed to streamline the creation of visually appealing and highly functional websites.',
+ } only %}
+
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'With a strong emphasis on accessibility compliance, CivicTheme ensures compliance with WCAG 2.2 standards and the platform\'s responsive design provides a seamless user experience across various devices and screen sizes. The rich library of pre-built components, such as buttons, forms, and navigation menus, allow developers to quickly integrate essential features into their projects, significantly reducing development time and costs.',
+ } only %}
+
+
+
+ {% include '@atoms/heading/heading.twig' with {
+ theme: 'dark',
+ content: 'Key benefits',
+ level: 3,
+ } only %}
+
+ {% set list_item1 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'layer',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: list_item_icon_1 ~ ' Atomic design system of 60+ components',
+ allow_html: true,
+ } only %}
+ {% endset %}
+
+ {% set list_item2 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'eye',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Compliant with WCAG 2.2 AA Standards',
+ } only %}
+ {% endset %}
+
+ {% set list_item3 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'water-drop',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Integrates with Drupal theme',
+ } only %}
+ {% endset %}
+
+ {% set list_item4 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'open-source',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Open source and community-driven',
+ } only %}
+ {% endset %}
+
+ {% include '@base/item-list/item-list.twig' with {
+ direction: 'vertical',
+ items: [
+ list_item1,
+ list_item2,
+ list_item3,
+ list_item4,
+ ],
+ } only %}
+
+
+
+
+ {% include '@atoms/heading/heading.twig' with {
+ theme: 'dark',
+ content: 'Key features',
+ level: 3,
+ } only %}
+
+ {% set list_item1 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'web',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Enhanced user experience',
+ } only %}
+ {% endset %}
+
+ {% set list_item2 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'mobile',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Responsive design and consistent branding',
+ } only %}
+ {% endset %}
+
+ {% set list_item3 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'layers',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Scalable and flexible for evolving needs',
+ } only %}
+ {% endset %}
+
+ {% set list_item4 %}
+ {% include '@base/icon/icon.twig' with {
+ symbol: 'document',
+ size: 'large',
+ } only %}
+ {% include '@atoms/paragraph/paragraph.twig' with {
+ theme: 'dark',
+ content: 'Documentation and support',
+ } only %}
+ {% endset %}
+
+ {% include '@base/item-list/item-list.twig' with {
+ direction: 'vertical',
+ items: [
+ list_item1,
+ list_item2,
+ list_item3,
+ list_item4,
+ ],
+ } only %}
+
+