<?php
/**
 * Title: FAQ Accordion
 * Slug: super-agency/faq-accordion
 * Categories: text, featured
 * Keywords: faq, accordion, questions, answers, help
 * Description: Frequently asked questions with accordion functionality (outlined style)
 */
?>

<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|xxx-large","bottom":"var:preset|spacing|xxx-large"},"margin":{"top":"0","bottom":"0"}}},"className":"super-agency-faq-accordion","layout":{"type":"constrained"}} -->
<div class="wp-block-group alignwide super-agency-faq-accordion" style="margin-top:0;margin-bottom:0;padding-top:var(--wp--preset--spacing--xxx-large);padding-bottom:var(--wp--preset--spacing--xxx-large)">
    <!-- wp:group {"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|xx-large"}}},"layout":{"type":"constrained","contentSize":"600px"}} -->
    <div class="wp-block-group" style="margin-bottom:var(--wp--preset--spacing--xx-large)">
        <!-- wp:heading {"textAlign":"center","style":{"spacing":{"margin":{"bottom":"var:preset|spacing|medium"}},"typography":{"fontWeight":"800"}},"textColor":"heading","fontSize":"xxxx-large"} -->
        <h2 class="wp-block-heading has-text-align-center has-heading-color has-text-color has-xxxx-large-font-size" style="margin-bottom:var(--wp--preset--spacing--medium);font-weight:800"><?php esc_html_e('Frequently Asked Questions', 'super-agency'); ?></h2>
        <!-- /wp:heading -->

        <!-- wp:paragraph {"align":"center","textColor":"body","fontSize":"x-large"} -->
        <p class="has-text-align-center has-body-color has-text-color has-x-large-font-size"><?php esc_html_e('Get answers to common questions about our services, process, and approach.', 'super-agency'); ?></p>
        <!-- /wp:paragraph -->
    </div>
    <!-- /wp:group -->

    <!-- wp:group {"align":"wide","style":{"spacing":{"blockGap":"var:preset|spacing|small"}},"layout":{"type":"constrained"}} -->
    <div class="wp-block-group alignwide">
        <!-- wp:details {"style":{"spacing":{"padding":{"top":"var:preset|spacing|medium","right":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|medium"},"margin":{"bottom":"var:preset|spacing|small"}},"border":{"width":"1px","color":"var:preset|color|border","radius":"8px"}},"backgroundColor":"background"} -->
        <details class="wp-block-details has-background-background-color has-background has-border-color" style="border-color:var(--wp--preset--color--border);border-width:1px;border-radius:8px;margin-bottom:var(--wp--preset--spacing--small);padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--medium)">
            <summary><?php esc_html_e('What makes your agency different?', 'super-agency'); ?></summary>
            <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|small"}}},"textColor":"body"} -->
            <p class="has-body-color has-text-color" style="margin-top:var(--wp--preset--spacing--small)"><?php esc_html_e('We focus exclusively on agencies and creative professionals, understanding their unique challenges and requirements. Our team combines technical expertise with creative vision to deliver solutions that not only look great but perform exceptionally.', 'super-agency'); ?></p>
            <!-- /wp:paragraph -->
        </details>
        <!-- /wp:details -->

        <!-- wp:details {"style":{"spacing":{"padding":{"top":"var:preset|spacing|medium","right":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|medium"},"margin":{"bottom":"var:preset|spacing|small"}},"border":{"width":"1px","color":"var:preset|color|border","radius":"8px"}},"backgroundColor":"background"} -->
        <details class="wp-block-details has-background-background-color has-background has-border-color" style="border-color:var(--wp--preset--color--border);border-width:1px;border-radius:8px;margin-bottom:var(--wp--preset--spacing--small);padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--medium)">
            <summary><?php esc_html_e('How long does a typical project take?', 'super-agency'); ?></summary>
            <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|small"}}},"textColor":"body"} -->
            <p class="has-body-color has-text-color" style="margin-top:var(--wp--preset--spacing--small)"><?php esc_html_e('Project timelines vary based on scope and complexity. A typical website project takes 4-8 weeks, while more complex applications may take 3-6 months. We provide detailed timelines during our initial consultation.', 'super-agency'); ?></p>
            <!-- /wp:paragraph -->
        </details>
        <!-- /wp:details -->

        <!-- wp:details {"style":{"spacing":{"padding":{"top":"var:preset|spacing|medium","right":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|medium"},"margin":{"bottom":"var:preset|spacing|small"}},"border":{"width":"1px","color":"var:preset|color|border","radius":"8px"}},"backgroundColor":"background"} -->
        <details class="wp-block-details has-background-background-color has-background has-border-color" style="border-color:var(--wp--preset--color--border);border-width:1px;border-radius:8px;margin-bottom:var(--wp--preset--spacing--small);padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--medium)">
            <summary><?php esc_html_e('Do you provide ongoing support?', 'super-agency'); ?></summary>
            <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|small"}}},"textColor":"body"} -->
            <p class="has-body-color has-text-color" style="margin-top:var(--wp--preset--spacing--small)"><?php esc_html_e('Yes, we offer comprehensive support and maintenance packages to ensure your digital solutions continue to perform optimally and stay up-to-date with the latest technologies.', 'super-agency'); ?></p>
            <!-- /wp:paragraph -->
        </details>
        <!-- /wp:details -->

        <!-- wp:details {"style":{"spacing":{"padding":{"top":"var:preset|spacing|medium","right":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|medium"},"margin":{"bottom":"var:preset|spacing|small"}},"border":{"width":"1px","color":"var:preset|color|border","radius":"8px"}},"backgroundColor":"background"} -->
        <details class="wp-block-details has-background-background-color has-background has-border-color" style="border-color:var(--wp--preset--color--border);border-width:1px;border-radius:8px;margin-bottom:var(--wp--preset--spacing--small);padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--medium)">
            <summary><?php esc_html_e('What technologies do you work with?', 'super-agency'); ?></summary>
            <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|small"}}},"textColor":"body"} -->
            <p class="has-body-color has-text-color" style="margin-top:var(--wp--preset--spacing--small)"><?php esc_html_e('We work with modern technologies including React, WordPress, Node.js, and various mobile development frameworks. We choose the best technology stack based on your specific project requirements and goals.', 'super-agency'); ?></p>
            <!-- /wp:paragraph -->
        </details>
        <!-- /wp:details -->

        <!-- wp:details {"style":{"spacing":{"padding":{"top":"var:preset|spacing|medium","right":"var:preset|spacing|medium","bottom":"var:preset|spacing|medium","left":"var:preset|spacing|medium"}},"border":{"width":"1px","color":"var:preset|color|border","radius":"8px"}},"backgroundColor":"background"} -->
        <details class="wp-block-details has-background-background-color has-background has-border-color" style="border-color:var(--wp--preset--color--border);border-width:1px;border-radius:8px;padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--medium);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--medium)">
            <summary><?php esc_html_e('How do you handle project communication?', 'super-agency'); ?></summary>
            <!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"var:preset|spacing|small"}}},"textColor":"body"} -->
            <p class="has-body-color has-text-color" style="margin-top:var(--wp--preset--spacing--small)"><?php esc_html_e('We believe in transparent communication throughout the project lifecycle. You\'ll have a dedicated project manager and access to our project management tools for real-time updates and collaboration.', 'super-agency'); ?></p>
            <!-- /wp:paragraph -->
        </details>
        <!-- /wp:details -->
    </div>
    <!-- /wp:group -->
</div>
<!-- /wp:group -->