<?php
/**
 * Title: Accordion (style 1)
 * Slug: mroya/accordion-1
 * Description: Displays collapsible content panels for presenting information.
 * Categories: text
 * Keywords: accordion, text
 * Viewport Width: 720
 */

?>
<!-- wp:group {"metadata":{"name":"<?php echo esc_html_x( 'Accordion (style 1)', 'Name for the Accordion pattern', 'mroya' ); ?>"},"className":"accordion accordion--1","style":{"spacing":{"blockGap":"0"},"elements":{"link":{"color":{"text":"var:preset|color|contrast"}}}},"textColor":"contrast","layout":{"type":"default"}} -->
<div class="wp-block-group accordion accordion--1 has-contrast-color has-text-color has-link-color">
	<!-- wp:details {"style":{"border":{"top":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"right":[],"bottom":[],"left":[]},"spacing":{"blockGap":"0"},"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontSize":"large"} -->
	<details class="wp-block-details has-large-font-size" style="border-top-color:var(--wp--preset--color--contrast-4);border-top-style:solid;border-top-width:1px;font-style:normal;font-weight:500">
		<summary><span><?php echo esc_html_x( 'What services do you offer?', 'Accordion pattern section title', 'mroya' ); ?></span></summary>

		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2","fontSize":"normal"} -->
		<p class="has-contrast-2-color has-text-color has-link-color has-normal-font-size" style="font-style:normal;font-weight:400;line-height:1.5"><?php echo esc_html_x( 'I specialize in web design, UI/UX, and WordPress development. Whether you need a custom website, a design refresh, or a portfolio site, I can help bring your vision to life.', 'Accordion pattern section text', 'mroya' ); ?></p>
		<!-- /wp:paragraph -->
	</details>
	<!-- /wp:details -->

	<!-- wp:details {"style":{"border":{"top":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"right":[],"bottom":[],"left":[]},"spacing":{"blockGap":"0"},"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontSize":"large"} -->
	<details class="wp-block-details has-large-font-size" style="border-top-color:var(--wp--preset--color--contrast-4);border-top-style:solid;border-top-width:1px;font-style:normal;font-weight:500">
		<summary><span><?php echo esc_html_x( 'Do you work with clients from different countries?', 'Accordion pattern section title', 'mroya' ); ?></span></summary>

		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2","fontSize":"normal"} -->
		<p class="has-contrast-2-color has-text-color has-link-color has-normal-font-size" style="font-style:normal;font-weight:400;line-height:1.5"><?php echo esc_html_x( 'Yes! I work remotely with clients from all over the world. Clear communication and reliable project management tools help keep everything on track regardless of time zones.', 'Accordion pattern section text', 'mroya' ); ?></p>
		<!-- /wp:paragraph -->
	</details>
	<!-- /wp:details -->

	<!-- wp:details {"style":{"border":{"top":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"right":[],"bottom":[],"left":[]},"spacing":{"blockGap":"0"},"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontSize":"large"} -->
	<details class="wp-block-details has-large-font-size" style="border-top-color:var(--wp--preset--color--contrast-4);border-top-style:solid;border-top-width:1px;font-style:normal;font-weight:500">
		<summary><span><?php echo esc_html_x( 'How long does it take to complete a website?', 'Accordion pattern section title', 'mroya' ); ?></span></summary>

		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2","fontSize":"normal"} -->
		<p class="has-contrast-2-color has-text-color has-link-color has-normal-font-size" style="font-style:normal;font-weight:400;line-height:1.5"><?php echo esc_html_x( 'It depends on the complexity of the project. A simple portfolio site usually takes 1–2 weeks, while more complex sites may take 3–5 weeks. I’ll provide a detailed timeline after we discuss your goals.', 'Accordion pattern section text', 'mroya' ); ?></p>
		<!-- /wp:paragraph -->
	</details>
	<!-- /wp:details -->

	<!-- wp:details {"style":{"border":{"top":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"right":[],"bottom":[],"left":[]},"spacing":{"blockGap":"0"},"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontSize":"large"} -->
	<details class="wp-block-details has-large-font-size" style="border-top-color:var(--wp--preset--color--contrast-4);border-top-style:solid;border-top-width:1px;font-style:normal;font-weight:500">
		<summary><span><?php echo esc_html_x( 'Can you redesign my existing website?', 'Accordion pattern section title', 'mroya' ); ?></span></summary>

		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2","fontSize":"normal"} -->
		<p class="has-contrast-2-color has-text-color has-link-color has-normal-font-size" style="font-style:normal;font-weight:400;line-height:1.5"><?php echo esc_html_x( 'Absolutely. I can evaluate your current site and suggest design improvements to enhance usability, aesthetics, and performance, while keeping your brand identity intact.', 'Accordion pattern section text', 'mroya' ); ?></p>
		<!-- /wp:paragraph -->
	</details>
	<!-- /wp:details -->

	<!-- wp:details {"style":{"border":{"top":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"right":{},"bottom":{"color":"var:preset|color|contrast-4","style":"solid","width":"1px"},"left":{}},"spacing":{"blockGap":"0"},"typography":{"fontStyle":"normal","fontWeight":"500"}},"fontSize":"large"} -->
	<details class="wp-block-details has-large-font-size" style="border-top-color:var(--wp--preset--color--contrast-4);border-top-style:solid;border-top-width:1px;border-bottom-color:var(--wp--preset--color--contrast-4);border-bottom-style:solid;border-bottom-width:1px;font-style:normal;font-weight:500">
		<summary><span><?php echo esc_html_x( 'What do you need from me to get started?', 'Accordion pattern section title', 'mroya' ); ?></span></summary>

		<!-- wp:paragraph {"style":{"typography":{"lineHeight":"1.5","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|contrast-2"}}}},"textColor":"contrast-2","fontSize":"normal"} -->
		<p class="has-contrast-2-color has-text-color has-link-color has-normal-font-size" style="font-style:normal;font-weight:400;line-height:1.5"><?php echo esc_html_x( 'We\'ll start with a short briefing where you share your goals, content, branding materials (if available), and any specific ideas you have. From there, I’ll create a proposal and we can move forward.', 'Accordion pattern section text', 'mroya' ); ?></p>
		<!-- /wp:paragraph -->
	</details>
	<!-- /wp:details -->
</div>
<!-- /wp:group -->
