File: /var/www/viitorcloud.stgviitor.com/Viitorcloud3.0-wp/wp-content/themes/viitorcloud/single-pov.php
<?php get_header(); ?>
<div id="main-banner" class="pb-15 md:pb-0 flex items-end md:items-center relative banner-shadow min-h-[100vh] md:min-h-[580px] md:h-[580px]">
<div class="absolute top-0 left-0 z-[-1] w-full h-full">
<div class="relative w-full h-full">
<img alt="contact us" fetchpriority="high" decoding="async" data-nimg="fill" class="object-cover object-position-banner" src="<?php echo esc_url(get_field('background_image')['url']) ?>" style="position: absolute; height: 100%; width: 100%; inset: 0px; color: transparent;">
</div>
</div>
<div class="container z-[1]">
<div class="grid grid-cols-12">
<div class="col-span-12 xl:col-span-7">
<div class="flex items-center mb-2 gap-x-5 md:mb-4">
<p class="heading xl:text-body5 text-body7 text-indigo-800">POINT OF VIEW</p>
<p class="heading xl:text-body6 text-body7 flex items-center gap-2 mb-0 text-grey-500">
<svg width="16" height="16" viewBox="0 0 15 16" fill="none" xmlns="http://www.w3.org/2000/svg" class="text-grey-500">
<g clip-path="url(#clip0_9006_6817)">
<path d="M6.87012 1.43652C5.91309 1.43652 5.01953 1.61719 4.18945 1.97852C3.34961 2.33008 2.61963 2.81836 1.99951 3.44336C1.37939 4.06836 0.888672 4.7959 0.527344 5.62598C0.175781 6.46582 0 7.35938 0 8.30664C0 9.26367 0.175781 10.1572 0.527344 10.9873C0.888672 11.8271 1.37939 12.5571 1.99951 13.1772C2.61963 13.7974 3.34961 14.2881 4.18945 14.6494C5.01953 15.0107 5.91309 15.1914 6.87012 15.1914C7.82715 15.1914 8.7207 15.0107 9.55078 14.6494C10.3906 14.2881 11.1206 13.7974 11.7407 13.1772C12.3608 12.5571 12.8516 11.8271 13.2129 10.9873C13.5645 10.1572 13.7402 9.26367 13.7402 8.30664C13.7402 7.35938 13.5645 6.46582 13.2129 5.62598C12.8516 4.7959 12.3608 4.06836 11.7407 3.44336C11.1206 2.81836 10.3906 2.33008 9.55078 1.97852C8.7207 1.61719 7.82715 1.43652 6.87012 1.43652ZM6.87012 13.9316C6.08887 13.9316 5.35645 13.7852 4.67285 13.4922C3.98926 13.1992 3.39355 12.7988 2.88574 12.291C2.37793 11.7832 1.97754 11.1875 1.68457 10.5039C1.3916 9.82031 1.24512 9.08789 1.24512 8.30664C1.24512 7.52539 1.3916 6.79297 1.68457 6.10938C1.97754 5.42578 2.37793 4.83008 2.88574 4.32227C3.39355 3.81445 3.98926 3.41406 4.67285 3.12109C5.35645 2.82812 6.08887 2.68164 6.87012 2.68164C7.65137 2.68164 8.38379 2.82812 9.06738 3.12109C9.75098 3.41406 10.3467 3.81445 10.8545 4.32227C11.3623 4.83008 11.7627 5.42578 12.0557 6.10938C12.3486 6.79297 12.4951 7.52539 12.4951 8.30664C12.4951 9.08789 12.3486 9.82031 12.0557 10.5039C11.7627 11.1875 11.3623 11.7832 10.8545 12.291C10.3467 12.7988 9.75098 13.1992 9.06738 13.4922C8.38379 13.7852 7.65137 13.9316 6.87012 13.9316ZM9.62402 8.99512L7.5 7.94043V4.55664C7.5 4.37109 7.44141 4.22217 7.32422 4.10986C7.20703 3.99756 7.05566 3.94141 6.87012 3.94141C6.68457 3.94141 6.5332 3.99756 6.41602 4.10986C6.29883 4.22217 6.24023 4.37109 6.24023 4.55664V8.30664C6.24023 8.43359 6.27197 8.54346 6.33545 8.63623C6.39893 8.729 6.49414 8.80957 6.62109 8.87793L9.12598 10.123C9.15527 10.1523 9.18701 10.1694 9.22119 10.1743C9.25537 10.1792 9.30664 10.1816 9.375 10.1816C9.49219 10.1816 9.59961 10.1523 9.69727 10.0938C9.79492 10.0352 9.87305 9.94238 9.93164 9.81543C9.99023 9.68848 9.99268 9.54443 9.93896 9.3833C9.88525 9.22217 9.78027 9.09277 9.62402 8.99512Z" fill="#A7A7A7"></path>
</g>
<defs>
<clipPath id="clip0_9006_6817">
<rect width="100%" height="100%" fill="white" transform="matrix(1 0 0 -1 0 15.5)"></rect>
</clipPath>
</defs>
</svg><?php echo get_the_date('M j, Y'); ?>
</p>
</div>
<div class="text-left">
<h1 class="heading xl:text-font40 text-body4 mb-3 font-medium text-white xl:mb-6 md:mb-4"><?php echo get_field('main_heading'); ?></h1>
</div>
</div>
</div>
</div>
</div>
<?php
$choose_heading = get_field('choose_heading');
$key_takeaways_main_title = get_field('key_takeaways_main_title');
$key_takeaways = get_field('key_takeaways');
$add_content = get_field('add_content');
?>
<section class="section xl:py-20 py-10 overflow-hidden bg-grey-100/40">
<div class="container">
<?php if ($key_takeaways_main_title) : ?>
<div data-aos="fade-up" data-aos-duration="500">
<h2 class="heading xl:text-h5 md:text-body4 text-body5 mt-5 mb-4">
<?= esc_html($key_takeaways_main_title); ?>
</h2>
</div>
<?php endif; ?>
<?php if ($key_takeaways) : ?>
<div data-aos="fade-up" data-aos-duration="500">
<ul class="[&>*:last-child]:mb-0 md:my-10 my-6 pl-5">
<?php foreach ($key_takeaways as $takeaway) : ?>
<li class="relative pl-4 mb-4 md:pl-6">
<div class="absolute w-[5px] h-[5px] md:w-2 md:h-2 bg-verdigris-900 rounded-full
top-[8px] md:top-[8px] lg:top-[7.5px] xl:top-[10.5px] left-0"></div>
<p class="heading xl:text-body5 text-body7 flex font-normal text-black-900">
<?= esc_html($takeaway['title']); ?>
</p>
</li>
<?php endforeach; ?>
</ul>
</div>
<?php endif; ?>
</div>
</section>
<section class="section xl:py-20 py-10 overflow-hidden">
<div class="container">
<?php if (!empty($add_content)) : ?>
<?php foreach ($add_content as $block) : ?>
<!-- SECTION HEADING -->
<?php if (!empty($block['main_title'])) : ?>
<div data-aos="fade-up" data-aos-duration="500">
<h2 class="heading xl:text-h5 md:text-body4 text-body5 mt-5 mb-4 md:mt-15">
<?= esc_html($block['main_title']); ?>
</h2>
</div>
<?php endif; ?>
<!-- IF NO: Paragraph-only LIST (Pattern A) -->
<?php if ($block['description_with_title'] === 'no') : ?>
<?php if (!empty($block['description'])) : ?>
<ul>
<?php foreach ($block['description'] as $row) : ?>
<li>
<div data-aos="fade-up" data-aos-duration="500">
<p class="heading xl:text-body5 text-body7 mb-5 text-black-600">
<?= esc_html($row['add']); ?>
</p>
</div>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<!-- IF YES: Title + Description LIST (Pattern C) -->
<?php else : ?>
<?php if (!empty($block['title_with_description'])) : ?>
<ul>
<?php foreach ($block['title_with_description'] as $row) : ?>
<li>
<div data-aos="fade-up" data-aos-duration="500">
<h3 class="heading xl:text-body5 text-body7 mb-2 font-semibold text-black-700">
<?= esc_html($row['title']); ?>
</h3>
</div>
<div data-aos="fade-up" data-aos-duration="500">
<p class="heading xl:text-body5 text-body7 mb-5 text-black-600">
<?= esc_html($row['description']); ?>
</p>
</div>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
<?php endif; ?>
<?php endforeach; ?>
<?php endif; ?>
</div>
</section>
<?php get_footer(); ?>