<?php
defined( 'ABSPATH' ) || exit;
return <<<'SHCD_FRAGMENT'
<div class="tokenomics section panel" id="tokenomics">
<div class="section-outer panel py-4 sm:py-6 lg:py-8 xl:py-10">
<div class="container sm:max-w-lg xl:max-w-xl">
<div class="section-inner panel">
<div class="section-header panel sm:max-w-600px xl:max-w-800px mx-auto mb-6 sm:mb-8 xl:mb-9 text-center" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 200});">
<div class="category">
<div class="-rotate-2">
<span class="fs-5 xl:fs-4 text-secondary fw-bold">%%SHCD_TEXT_t0%%</span>
</div>
</div>
<h2 class="title h4 sm:h3 xl:h2 my-2 text-white text-uppercase ls-0">%%SHCD_TEXT_t1%%</h2>
<p class="desc fs-6 sm:fs-5 xl:fs-4">%%SHCD_TEXT_t2%%</p>
</div>
<div class="section-content panel">
<div class="row child-cols-12 sm:child-cols-6 lg:child-cols-3 items-center g-4 sm:g-3 xl:g-5">
<div class="order-2 sm:order-1">
<div class="panel">
<div class="row child-cols-12 g-4 sm:g-8 xl:g-9" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 400});">
<div>
<div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 rotate-2" style="background: linear-gradient(20deg, #ffffff17, #0d042c)">
<p class="fs-5 xl:fs-4">
                                                            %%SHCD_TEXT_t3%% <br/>
                                                            %%SHCD_TEXT_t4%%
                                                        </p>
</div>
</div>
<div>
<div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 -rotate-2" style="background: linear-gradient(20deg, #ffffff17, #0d042c)">
<p class="fs-5 xl:fs-4">
                                                            %%SHCD_TEXT_t5%% <br/>
                                                            %%SHCD_TEXT_t6%%
                                                        </p>
</div>
</div>
</div>
</div>
</div>
<div class="col sm:d-none lg:d-block order-1 sm:order-2">
<div class="features-image panel" data-anime="onview: -300; translateY: [24, 0]; opacity: [0, 1]; delay: 200;">
<img alt="تصویر" src="%%SHCD_IMG_i0%%"/>
</div>
</div>
<div class="order-2 sm:order-2">
<div class="panel">
<div class="row child-cols-12 g-4 sm:g-8 xl:g-9" data-anime="onview: -300; targets: &gt;*; translateY: [24, 0]; opacity: [0, 1]; delay: anime.stagger(100, {start: 400});">
<div>
<div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 -rotate-2" style="background: linear-gradient(20deg, #ffffff17, #0d042c)">
<p class="fs-5 xl:fs-4">%%SHCD_TEXT_t7%%</p>
</div>
</div>
<div>
<div class="features-item p-3 border border-1 border-gray-100 border-opacity-40 rounded-3 rotate-2" style="background: linear-gradient(20deg, #ffffff17, #0d042c)">
<p class="fs-5 xl:fs-4">%%SHCD_TEXT_t8%%</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="section-footer panel d-flex justify-center mt-6 sm:mt-8" data-anime="onview: -100; translateY: [24, 0]; opacity: [0, 1]; delay: 200;">
<a class="btn btn-md sm:btn-xl xl:btn-2xl px-4 xl:px-6 border border-3 border-black bg-gradient-45n from-secondary to-tertiary contrast-shadow -rotate-2 hover:rotate-0" href="%%SHCD_LINK_l0%%" style="--shadowColor: var(--color-secondary)">
<span class="text-black">%%SHCD_TEXT_t9%%</span>
<span class="fs-4 mb-narrow">%%SHCD_TEXT_t10%%</span>
</a>
</div>
</div>
</div>
</div>
</div>
SHCD_FRAGMENT;
