templates/galilea/import/components/security.twig line 1

  1. <div class="bg-brand-50 overflow-clip {{pt}} {{pb}}" {{ id ? ('id="' ~ id ~ '"')|raw }} x-reveal>
  2.     <div class="container">
  3.         <div x-reveal>
  4.             <div class="flex-none space-y-8">
  5.                 {% if topline %}
  6.                     <div class="inline-flex gap-2 items-center text-sm tracking-wider leading-none text-white uppercase">
  7.                         <div class="bg-current rounded-full size-1"></div>
  8.                         {{ topline|raw }}
  9.                     </div>
  10.                 {% endif %}
  12.                 {% if title %}
  13.                     <div class="text-3xl font-medium text-white lg:text-5xl highlight-secondary-50 lg:leading-[1.2]">{{ title|raw }}</div>
  14.                 {% endif %}
  15.             </div>
  16.         </div>
  18.         <div class="-my-[30%]" x-reveal:opacitycenter>
  19.             <canvas class="w-full aspect-square" x-rive="{{ animation }}"></canvas>
  20.         </div>
  22.         <div x-reveal:stagger>
  23.             {% if text %}
  24.                 <div class="ml-auto text-lg font-medium text-right text-white lg:w-1/2 leading-[1.3]">{{ text }}</div>
  25.             {% endif %}
  27.             <div class="flex gap-2 justify-end mt-10">
  28.                 {% include (baseIncludePath ? baseIncludePath : '') ~ 'components/ctas.twig' with {'ctas' : ctas, 'size' : 'btn-lg', 'dot': true} %}
  29.             </div>
  30.         </div>
  32.         <div class="pt-8 mt-16 border-t border-white/10">
  33.             {% if audit_topline %}
  34.                 <div x-reveal>
  35.                     <div class="inline-flex gap-2 items-center mb-14 text-sm tracking-wider leading-none text-white uppercase">
  36.                         <div class="bg-current rounded-full size-1"></div>
  37.                         {{ audit_topline|raw }}
  38.                     </div>
  39.                 </div>
  40.             {% endif %}
  42.             <div class="grid grid-cols-1 gap-6 text-white lg:grid-cols-4" x-reveal:stagger>
  43.                 {% for item in items %}
  44.                     <div class="p-8 rounded-2xl bg-white/10">
  45.                         <img src="{{ item.image }}" alt="{{ item.title }}" class="block mb-20 h-10">
  47.                         <div class="text-2xl leading-[1.2]">
  48.                             {{ item.title }}
  49.                         </div>
  50.                     </div>
  51.                 {% endfor %}
  52.             </div>
  53.         </div>
  54.     </div>
  55. </div>