File: //home/wicomm2/public_html/pages/careers-page.php
<?php
//template name: Programa de capacitação
get_header();
?>
<main class="careers">
<?php
$section_main = get_field('secao_principal');
$background = $section_main['banner_de_fundo'];
$title_section_main = $section_main['titulo'];
$text_section_main = $section_main['texto'];
$text_button_section_main = $section_main['texto_do_botao'];
$link_button_section_main = $section_main['link_do_botao'];
$section_whatsIs = get_field('pra_quem_e');
$img_section_whatsIs = $section_whatsIs['imagem'];
$title_section_whatsIs = $section_whatsIs['titulo'];
$item_1_section_whatsIs = $section_whatsIs['item_1'];
$item_2_section_whatsIs = $section_whatsIs['item_2'];
$item_3_section_whatsIs = $section_whatsIs['item_2'];
?>
<section class="wc-careers-main" style="background-image: url('<?php echo esc_url($background); ?>');">
<div class="wc-limit-screen">
<div class="wc-careers-main__content">
<h1><?php echo $title_section_main ?></h1>
<p><?php echo $text_section_main ?></p>
<div class="wc-careers-main__button">
<a class="wc-button-link-white" href="<?php echo $link_button_section_main ?>" target="_blank">
<span><?php echo $text_button_section_main ?></span>
</a>
</div>
</div>
<div class="wc-careers-main__whats">
<img src="<?php echo $img_section_whatsIs ?>" />
<div class="wc-careers-main__whats--container">
<h2><?php echo $title_section_whatsIs ?></h2>
<ul>
<li>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M3.84922 8.61998C3.70326 7.9625 3.72567 7.27882 3.91437 6.63231C4.10308 5.98581 4.45196 5.39742 4.92868 4.9217C5.40541 4.44597 5.99453 4.09832 6.64142 3.91097C7.28832 3.72362 7.97205 3.70264 8.62922 3.84998C8.99093 3.28428 9.48922 2.81873 10.0782 2.49626C10.6671 2.17379 11.3278 2.00476 11.9992 2.00476C12.6707 2.00476 13.3313 2.17379 13.9203 2.49626C14.5092 2.81873 15.0075 3.28428 15.3692 3.84998C16.0274 3.702 16.7123 3.72288 17.3602 3.91069C18.0081 4.09849 18.598 4.44712 19.0751 4.92413C19.5521 5.40114 19.9007 5.99105 20.0885 6.63898C20.2763 7.28691 20.2972 7.97181 20.1492 8.62998C20.7149 8.99168 21.1805 9.48998 21.5029 10.0789C21.8254 10.6679 21.9944 11.3285 21.9944 12C21.9944 12.6714 21.8254 13.3321 21.5029 13.921C21.1805 14.51 20.7149 15.0083 20.1492 15.37C20.2966 16.0271 20.2756 16.7109 20.0882 17.3578C19.9009 18.0047 19.5532 18.5938 19.0775 19.0705C18.6018 19.5472 18.0134 19.8961 17.3669 20.0848C16.7204 20.2735 16.0367 20.2959 15.3792 20.15C15.018 20.7178 14.5193 21.1854 13.9293 21.5093C13.3394 21.8332 12.6772 22.003 12.0042 22.003C11.3312 22.003 10.669 21.8332 10.0791 21.5093C9.48914 21.1854 8.99045 20.7178 8.62922 20.15C7.97205 20.2973 7.28832 20.2763 6.64142 20.089C5.99453 19.9016 5.40541 19.554 4.92868 19.0783C4.45196 18.6025 4.10308 18.0141 3.91437 17.3676C3.72567 16.7211 3.70326 16.0374 3.84922 15.38C3.27917 15.0192 2.80963 14.5201 2.48426 13.9292C2.1589 13.3382 1.98828 12.6746 1.98828 12C1.98828 11.3254 2.1589 10.6617 2.48426 10.0708C2.80963 9.4798 3.27917 8.98073 3.84922 8.61998Z"
stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M9 12L11 14L15 10" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
<?php echo $item_1_section_whatsIs ?>
</li>
<li>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M3.84922 8.61998C3.70326 7.9625 3.72567 7.27882 3.91437 6.63231C4.10308 5.98581 4.45196 5.39742 4.92868 4.9217C5.40541 4.44597 5.99453 4.09832 6.64142 3.91097C7.28832 3.72362 7.97205 3.70264 8.62922 3.84998C8.99093 3.28428 9.48922 2.81873 10.0782 2.49626C10.6671 2.17379 11.3278 2.00476 11.9992 2.00476C12.6707 2.00476 13.3313 2.17379 13.9203 2.49626C14.5092 2.81873 15.0075 3.28428 15.3692 3.84998C16.0274 3.702 16.7123 3.72288 17.3602 3.91069C18.0081 4.09849 18.598 4.44712 19.0751 4.92413C19.5521 5.40114 19.9007 5.99105 20.0885 6.63898C20.2763 7.28691 20.2972 7.97181 20.1492 8.62998C20.7149 8.99168 21.1805 9.48998 21.5029 10.0789C21.8254 10.6679 21.9944 11.3285 21.9944 12C21.9944 12.6714 21.8254 13.3321 21.5029 13.921C21.1805 14.51 20.7149 15.0083 20.1492 15.37C20.2966 16.0271 20.2756 16.7109 20.0882 17.3578C19.9009 18.0047 19.5532 18.5938 19.0775 19.0705C18.6018 19.5472 18.0134 19.8961 17.3669 20.0848C16.7204 20.2735 16.0367 20.2959 15.3792 20.15C15.018 20.7178 14.5193 21.1854 13.9293 21.5093C13.3394 21.8332 12.6772 22.003 12.0042 22.003C11.3312 22.003 10.669 21.8332 10.0791 21.5093C9.48914 21.1854 8.99045 20.7178 8.62922 20.15C7.97205 20.2973 7.28832 20.2763 6.64142 20.089C5.99453 19.9016 5.40541 19.554 4.92868 19.0783C4.45196 18.6025 4.10308 18.0141 3.91437 17.3676C3.72567 16.7211 3.70326 16.0374 3.84922 15.38C3.27917 15.0192 2.80963 14.5201 2.48426 13.9292C2.1589 13.3382 1.98828 12.6746 1.98828 12C1.98828 11.3254 2.1589 10.6617 2.48426 10.0708C2.80963 9.4798 3.27917 8.98073 3.84922 8.61998Z"
stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M9 12L11 14L15 10" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
<?php echo $item_2_section_whatsIs ?>
</li>
<li>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M3.84922 8.61998C3.70326 7.9625 3.72567 7.27882 3.91437 6.63231C4.10308 5.98581 4.45196 5.39742 4.92868 4.9217C5.40541 4.44597 5.99453 4.09832 6.64142 3.91097C7.28832 3.72362 7.97205 3.70264 8.62922 3.84998C8.99093 3.28428 9.48922 2.81873 10.0782 2.49626C10.6671 2.17379 11.3278 2.00476 11.9992 2.00476C12.6707 2.00476 13.3313 2.17379 13.9203 2.49626C14.5092 2.81873 15.0075 3.28428 15.3692 3.84998C16.0274 3.702 16.7123 3.72288 17.3602 3.91069C18.0081 4.09849 18.598 4.44712 19.0751 4.92413C19.5521 5.40114 19.9007 5.99105 20.0885 6.63898C20.2763 7.28691 20.2972 7.97181 20.1492 8.62998C20.7149 8.99168 21.1805 9.48998 21.5029 10.0789C21.8254 10.6679 21.9944 11.3285 21.9944 12C21.9944 12.6714 21.8254 13.3321 21.5029 13.921C21.1805 14.51 20.7149 15.0083 20.1492 15.37C20.2966 16.0271 20.2756 16.7109 20.0882 17.3578C19.9009 18.0047 19.5532 18.5938 19.0775 19.0705C18.6018 19.5472 18.0134 19.8961 17.3669 20.0848C16.7204 20.2735 16.0367 20.2959 15.3792 20.15C15.018 20.7178 14.5193 21.1854 13.9293 21.5093C13.3394 21.8332 12.6772 22.003 12.0042 22.003C11.3312 22.003 10.669 21.8332 10.0791 21.5093C9.48914 21.1854 8.99045 20.7178 8.62922 20.15C7.97205 20.2973 7.28832 20.2763 6.64142 20.089C5.99453 19.9016 5.40541 19.554 4.92868 19.0783C4.45196 18.6025 4.10308 18.0141 3.91437 17.3676C3.72567 16.7211 3.70326 16.0374 3.84922 15.38C3.27917 15.0192 2.80963 14.5201 2.48426 13.9292C2.1589 13.3382 1.98828 12.6746 1.98828 12C1.98828 11.3254 2.1589 10.6617 2.48426 10.0708C2.80963 9.4798 3.27917 8.98073 3.84922 8.61998Z"
stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
<path d="M9 12L11 14L15 10" stroke="white" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" />
</svg>
<?php echo $item_3_section_whatsIs ?>
</li>
</ul>
</div>
</div>
</div>
</section>
<section class="wc-cereers-learn">
<?php
$section_learn = get_field('secao_o_que_aprender');
$title_section_learn = $section_learn['titulo'];
$text_section_learn = $section_learn['texto'];
$text_button_section_learn = $section_learn['texto_do_botao'];
$link_button_section_learn = $section_learn['link_do_botao'];
$cards_section_learn = $section_learn['cards'];
$icon_cards_01_learn = $section_learn['cards']['card_1']['icone'];
$title_cards_01_learn = $section_learn['cards']['card_1']['titulo'];
$text_cards_01_learn = $section_learn['cards']['card_1']['texto'];
$icon_cards_02_learn = $section_learn['cards']['card_2']['icone'];
$title_cards_02_learn = $section_learn['cards']['card_2']['titulo'];
$text_cards_02_learn = $section_learn['cards']['card_2']['texto'];
$icon_cards_03_learn = $section_learn['cards']['card_3']['icone'];
$title_cards_03_learn = $section_learn['cards']['card_3']['titulo'];
$text_cards_03_learn = $section_learn['cards']['card_3']['texto'];
$icon_cards_04_learn = $section_learn['cards']['card_4']['icone'];
$title_cards_04_learn = $section_learn['cards']['card_4']['titulo'];
$text_cards_04_learn = $section_learn['cards']['card_4']['texto'];
?>
<div class="wc-careers-learn__header">
<div class="wc-limit-screen">
<div>
<span class="wc-careers-learn__title-section">PROGRAMA DE CAPACITAÇÃO</span>
<h2 class="wc-careers-learn__title">PROGRAMA DE CAPACITAÇÃO</h2>
<p class="wc-careers-learn__text"><?php echo $text_section_learn ?></p>
</div>
<?php if (!wp_is_mobile()): ?>
<div class="wc-careers-learn__button">
<a class="wc-button-link-pink" href="<?php echo $link_button_section_main ?>" target="_blank">
<span><?php echo $text_button_section_main ?></span>
</a>
</div>
<?php endif; ?>
</div>
</div>
<div class="wc-careers-learn__cards">
<div class="wc-limit-screen">
<ul>
<li>
<div class="wc-careers-learn__card">
<img src="<?php echo $icon_cards_01_learn ?>" />
<h3><?php echo $title_cards_01_learn ?></h3>
<p><?php echo $text_cards_01_learn ?></p>
</div>
</li>
<li>
<div class="wc-careers-learn__card">
<img src="<?php echo $icon_cards_02_learn ?>" />
<h3><?php echo $title_cards_02_learn ?></h3>
<p><?php echo $text_cards_02_learn ?></p>
</div>
</li>
<li>
<div class="wc-careers-learn__card">
<img src="<?php echo $icon_cards_03_learn ?>" />
<h3><?php echo $title_cards_03_learn ?></h3>
<p><?php echo $text_cards_03_learn ?></p>
</div>
</li>
<li>
<div class="wc-careers-learn__card">
<img src="<?php echo $icon_cards_04_learn ?>" />
<h3><?php echo $title_cards_04_learn ?></h3>
<p><?php echo $text_cards_04_learn ?></p>
</div>
</li>
</ul>
</div>
</div>
</section>
<section class="wc-careers-learn-forms">
<div class="wc-limit-screen">
<h2>Interessado?</h2>
<p>
Inscreva-se no programa de capacitação e dê o start na sua carreira.
As vagas são limitadas — garanta a sua agora e receba todas as informações por e-mail
</p>
<?php echo do_shortcode('[ninja_form id=4]'); ?>
</div>
</section>
</main>
<?php get_footer(); ?>