refactor(components): separate page shells from reusable components
Additional info: - move page-specific shells into src/components/pages/ - keep reusable building blocks and home sections in their existing component folders - update PageLayout and the home route imports to the new page-shell paths - preserve current page behavior while making the component tree easier to navigate
This commit is contained in:
9 files changed
+20
-20
No files matched your search
@@ -0,0 +1,39 @@
|
||||
---
|
||||
---
|
||||
<div class="about-page">
|
||||
<section class="about-section section">
|
||||
<div class="container">
|
||||
<h2>Our Story</h2>
|
||||
<p>The Arizona Institute for Autism (AIA) was founded in 2018 by Clinical Director Rula Diab, M.Ed, BCBA, LBA. Ms. Diab is an industry expert with over 15 years of experience in the field of Special Education and Behavioral Analysis.</p>
|
||||
<p>As the founder and Clinical Director, Rula Diab, leads the Arizona Institute for Autism's clinical efforts, community outreach, and managing network programming with current local businesses including Arizona State University and Phoenix School District. As a Special Education expert, Ms. Diab works with practitioners, academics, policymakers, teachers, families, and, most importantly, children with developmental disabilities throughout Arizona. After noticing gaps in the way practitioners applied ABA principles, Rula pioneered the AIA model of education, a model centered on recognizing each child's individuality and dignity by cultivating their natural interests, preferences, and motivators. Education doesn't have to be boring, and that should be the case for all children.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="about-section section section-tint">
|
||||
<div class="container">
|
||||
<h2>Our Mission</h2>
|
||||
<p>At AIA, our mission is to improve special education and strengthen communities throughout Arizona. Every day, our team of highly trained clinicians, paraprofessionals, educators, and consultants works with one goal in mind: to support the behavioral and educational development of our 'kiddos' in every way possible.</p>
|
||||
<p>We accomplish this by delivering clinical treatments, including ABA therapy services, and educational support to children with Autism Spectrum Disorder and other developmental disorders. And since every child is unique, we work with each family differently to understand their individual needs before we apply our insights through customized programs.</p>
|
||||
<p>We also bring our 'can-do' mentality to the classroom. AIA works hand-in-hand with SPED teachers and school leaders to address their unique challenges and enhance the classroom environment for their students. Our staff believes that, with the right resources & support, every child can achieve their potential. So, every day, we do everything we can to support each one of our 'kiddos' in the pursuit of their individual potential.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="about-section section">
|
||||
<div class="container">
|
||||
<h2>Our Commitment</h2>
|
||||
<ul class="commitment-list">
|
||||
<li><strong>Integrity</strong> — Integrity is the essence of who we are and at the foundation of everything we do. We approach our relationships with integrity and always adhere to the highest ethical principles.</li>
|
||||
<li><strong>Empowerment</strong> — A heart that serves and empowers others is essential to our success. We are passionate about motivating and encouraging our kiddos and learners for success.</li>
|
||||
<li><strong>Excellence</strong> — At AIA, we strive for excellence in everything we do. We go above and beyond in providing results to support our community partners, customers, kiddos, and everyone in the AIA family.</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.about-section h2 { margin-top: 0; }
|
||||
.about-section p { max-width: 820px; }
|
||||
.commitment-list { list-style: none; max-width: 820px; padding: 0; }
|
||||
.commitment-list li { border-left: 4px solid var(--color-accent); margin-bottom: 1.5rem; padding-left: 1.25rem; }
|
||||
.commitment-list li:last-child { margin-bottom: 0; }
|
||||
</style>
|
||||
@@ -0,0 +1,245 @@
|
||||
---
|
||||
const indeedUrl = 'https://www.indeed.com/cmp/Arizona-Institute-For-Autism/jobs';
|
||||
|
||||
const benefits = [
|
||||
'Competitive Salary', 'Giveback Opportunity', 'Medical Insurance Plan',
|
||||
'Dental Life Insurance Plan', 'Vision Insurance Plan', 'Life Insurance Plan',
|
||||
'401 K', 'Vacation Time', 'Sick Time',
|
||||
];
|
||||
|
||||
const culture = [
|
||||
'Family-Oriented', 'Supportive', 'Educational',
|
||||
'Motivating', 'Transparent', 'Inclusive',
|
||||
];
|
||||
|
||||
const careerPath = [
|
||||
'Behavioral Technician', 'Registered Behavioral Technician (RBT)', 'Senior Behavioral Technician, RBT',
|
||||
'Clinical Case Supervisor', 'BCBA (Board Certified Behavioral Analyst)', 'Clinical Assistant Director, BCBA', 'Clinical Director, BCBA',
|
||||
];
|
||||
|
||||
const benefitIcons = [
|
||||
['competitive-compensation_blue.svg', 'Competitive\nCompensation'],
|
||||
['flexible-scheduling_blue.svg', 'Flexible\nScheduling'],
|
||||
['caseload-teamwork_blue.svg', 'Caseload\nTeamwork'],
|
||||
['career-growth_blue.svg', 'Career\nGrowth'],
|
||||
['monthly-training_blue.svg', 'Monthly\nTraining'],
|
||||
['diversity-inclusion-opportunity_blue.svg', 'Diversity & Inclusive\nOpportunities'],
|
||||
];
|
||||
|
||||
const careerCards = [
|
||||
{ image: 'clinical-careers.webp', title: 'Clinical', body: "Bring your specialized knowledge to the clinical team. You'll get the training tools you need to serve a community you'll love." },
|
||||
{ image: 'non-clinical-careers.webp', title: 'Non-Clinical', body: "Build a career you love as a member of our non-clinical team. In this role, you'll service team members, families, and the community while ensuring quality service." },
|
||||
{ image: 'corporate-center-team-support.webp', title: 'Center Support', body: 'Take a fresh and innovative approach as a member of the Corporate team. Take on new challenges and opportunities to help shape the future of Pediatric care.' },
|
||||
{ image: 'internships-practicum.webp', title: 'Internships', body: 'Our specialty interns help shape the future of our center carefully curated clinical, operations, advocacy, people, and other departments.' },
|
||||
];
|
||||
---
|
||||
|
||||
<article class="careers-page">
|
||||
|
||||
<!-- Join the AIA Team -->
|
||||
<section class="careers-intro container-narrow">
|
||||
<h2>Join the AIA Team</h2>
|
||||
<p>Apply to join the Arizona Institute for Autism (AIA) team today. We are on a mission to improve special education and strengthen communities throughout Arizona.</p>
|
||||
<p>Our talented and passionate employees are a critical piece to the high-quality Autism services we provide along with our commitment to behavioral health, school solutions, and community outreach.</p>
|
||||
<a class="button button-center" href={indeedUrl} target="_blank" rel="noopener noreferrer">View Open Positions</a>
|
||||
</section>
|
||||
|
||||
<!-- Our Benefits -->
|
||||
<section class="careers-section section-tint">
|
||||
<div class="container careers-split">
|
||||
<div class="careers-split__text">
|
||||
<h3>Our Benefits</h3>
|
||||
<ul>
|
||||
{benefits.map((b) => <li>{b}</li>)}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="careers-split__images">
|
||||
<img src="/assets/images/integrated-aba-model_400x300.webp" alt="Integrated ABA model" loading="lazy" />
|
||||
<img src="/assets/images/proud-aia-staff.webp" alt="Compassionate AIA staff members" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Our Diverse Culture -->
|
||||
<section class="careers-section">
|
||||
<div class="container careers-split">
|
||||
<div class="careers-split__text">
|
||||
<h3>Our Diverse Culture</h3>
|
||||
<ul>
|
||||
{culture.map((c) => <li>{c}</li>)}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="careers-split__images">
|
||||
<img src="/assets/images/toddler-bcba-support.webp" alt="Toddler with BCBA support" loading="lazy" />
|
||||
<img src="/assets/images/aba-learn-play-skills.webp" alt="ABA learn and play skills" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- See Your Impact -->
|
||||
<section class="careers-section section-tint">
|
||||
<div class="container careers-two-col">
|
||||
<div>
|
||||
<h3>See Your Impact</h3>
|
||||
<p>The work we do has a direct impact on our learners, families, our communities, our team members, and the healthcare industry.</p>
|
||||
<p>Every day you'll work with others driven to make a difference through transforming primary autism and pediatric care.</p>
|
||||
</div>
|
||||
<img src="/assets/images/scottsdale-ribbon-cutting.webp" alt="Scottsdale location ribbon-cutting ceremony" loading="lazy" />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Expand & Explore -->
|
||||
<section class="careers-section container-narrow">
|
||||
<h3>Expand & Explore Your Potential</h3>
|
||||
<p>We're growing fast, and that makes us a great place for you to grow. Focus on learning, discovering, and trying new areas that interest you. Advance in your chosen field. We'll help you get there.</p>
|
||||
</section>
|
||||
|
||||
<!-- Scholarships GCU -->
|
||||
<section class="careers-section section-tint">
|
||||
<div class="container">
|
||||
<div>
|
||||
<h3>Scholarships Awarded in Partnership with GCU</h3>
|
||||
<p>Through AIA's partnership with GCU, all AIA employees, along with their spouses and dependents, are eligible for a tuition discount when they enroll in one of GCU's programs.</p>
|
||||
<img class="logo-img" src="/assets/images/logo-gcu.webp" alt="Grand Canyon University logo" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- BCBA Internships -->
|
||||
<section class="careers-section container-narrow">
|
||||
<h3>Build Your Resume with BCBA Internships & Practicum</h3>
|
||||
<p>At the Arizona Institute for Autism, we afford students at Arizona State University to gain practicum experience. Due to our partnership with the Arizona State University Department of Psychology, future Board Certified Behavior Analysts will meet the training requirements of the ASU Department of Psychology MS ABA Program and the BACB.</p>
|
||||
<p>Students will be given the opportunity to obtain thorough behavior-analytic experience and training in a fashion that fulfills its service provision related functions as an organization, so long as those functions are analytic in nature and the goals of the practicum experience are in accordance with the Behavior Analyst Certification Board.</p>
|
||||
<img class="logo-img" src="/assets/images/asu.webp" alt="Arizona State University" loading="lazy" />
|
||||
</section>
|
||||
|
||||
<!-- Choose Your Clinical Career Path -->
|
||||
<section class="careers-section section-tint">
|
||||
<div class="container">
|
||||
<h2>Choose Your Clinical Career Path</h2>
|
||||
<p>Work someone you love. Begin your journey with Arizona's leading ABA Integrated Therapy provider today!</p>
|
||||
<div class="careers-split">
|
||||
<div class="careers-split__text">
|
||||
<ul>
|
||||
{careerPath.map((p) => <li>{p}</li>)}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="careers-split__images">
|
||||
<img src="/assets/images/casp-member-logo.webp" alt="The Council of Autism Service Providers member logo" loading="lazy" />
|
||||
<img src="/assets/images/logo-BACB.png" alt="BACB logo" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<a class="button button-center" href={indeedUrl} target="_blank" rel="noopener noreferrer">View Open Positions</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Benefits of Working at AIA -->
|
||||
<section class="careers-section careers-center">
|
||||
<div class="container">
|
||||
<h3>Benefits of Working at Arizona Institute for Autism</h3>
|
||||
<div class="benefits-grid">
|
||||
{benefitIcons.map(([icon, label]) => (
|
||||
<div class="benefit-item">
|
||||
<img src={`/assets/images/${icon}`} alt={label.replace('\n', ' ')} width="80" height="80" loading="lazy" />
|
||||
<p>{label.split('\n').map((line, i) => i > 0 ? [<br />, line] : line)}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Your Clinical Path to Success -->
|
||||
<section class="careers-section section-tint">
|
||||
<div class="container-narrow careers-path">
|
||||
<h2>Your Clinical Path to Success</h2>
|
||||
<p>Behavioral Technician → Registered Behavioral Technician → Senior Behavioral Technician</p>
|
||||
<p>Clinical Case Supervisor → BCBA → Clinical Assistant Director → Clinical Director</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Find Your Path -->
|
||||
<section class="careers-section">
|
||||
<div class="container careers-center">
|
||||
<h3>Find Your Path</h3>
|
||||
<p>If you have an interest, we have a department for you to step into and teams to support you in your growth.</p>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="career-cards">
|
||||
{careerCards.map(({ image, title, body }) => (
|
||||
<div class="career-card">
|
||||
<img src={`/assets/images/${image}`} alt={title} loading="lazy" />
|
||||
<div class="career-card__body">
|
||||
<h4>{title}</h4>
|
||||
<p>{body}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<a class="button button-center" href={indeedUrl} target="_blank" rel="noopener noreferrer">View Open Positions</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</article>
|
||||
|
||||
<style>
|
||||
/* ── Shared ─────────────────────────────────────────── */
|
||||
.careers-intro { padding-block: 3rem; }
|
||||
.careers-section { padding-block: 3rem; }
|
||||
.careers-section.container-narrow { max-width: 760px; margin-inline: auto; padding-inline: 1rem; }
|
||||
.careers-center { text-align: center; }
|
||||
|
||||
/* ── Two-column split: 50% text + 25%+25% images ───── */
|
||||
.careers-split { display: grid; gap: 2rem; grid-template-columns: 1fr 1fr; align-items: center; }
|
||||
.careers-split__images { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
|
||||
.careers-split__images img { width: 100%; height: auto; border-radius: 4px; }
|
||||
.careers-split__text h3 { margin-top: 0; }
|
||||
.careers-split__text ul { padding-left: 1.25rem; }
|
||||
.careers-split__text ul li { margin-bottom: .4rem; }
|
||||
|
||||
/* ── Two-column 50/50 ───────────────────────────────── */
|
||||
.careers-two-col { display: grid; gap: 2rem; grid-template-columns: 1fr 1fr; align-items: center; }
|
||||
.careers-two-col h3 { margin-top: 0; }
|
||||
.careers-two-col img { width: 100%; height: auto; border-radius: 4px; }
|
||||
.careers-two-col--logo { align-items: center; }
|
||||
.logo-img { display: block; max-width: 100%; height: auto; margin-top: 2rem; margin-inline: auto; }
|
||||
|
||||
/* ── Benefits icon grid ─────────────────────────────── */
|
||||
.benefits-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; margin-top: 2rem; text-align: center; }
|
||||
.benefit-item img { display: block; margin: 0 auto .75rem; }
|
||||
.benefit-item p { font-size: .75rem; line-height: 1.4; margin: 0; }
|
||||
|
||||
/* ── Clinical path ──────────────────────────────────── */
|
||||
.careers-path { text-align: center; }
|
||||
.careers-path h2 { margin-bottom: 1rem; }
|
||||
.careers-path p { font-size: 1rem; margin-bottom: .5rem; }
|
||||
|
||||
/* ── Find Your Path ─────────────────────────────────── */
|
||||
.career-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.5rem; padding-block: 1rem; }
|
||||
.career-card { display: flex; flex-direction: column; isolation: isolate; text-align: center; }
|
||||
.career-card img { display: block; margin-inline: auto; object-fit: cover; }
|
||||
.career-card__body { flex: 1;
|
||||
background: var(--color-tint);
|
||||
border-radius: 0 0 4px 4px;
|
||||
margin-top: -2.4rem;
|
||||
padding: 2.4rem 1rem 1.25rem;
|
||||
position: relative;
|
||||
z-index: -1;
|
||||
}
|
||||
.career-card__body h4 { font-size: 1.25rem; margin: 0 0 .4rem; }
|
||||
.career-card__body p { font-size: .8rem; margin: 0; }
|
||||
|
||||
/* ── CTA ────────────────────────────────────────────── */
|
||||
.careers-cta { padding-block: 3rem; text-align: center; }
|
||||
|
||||
/* ── Responsive ─────────────────────────────────────── */
|
||||
@media (max-width: 900px) {
|
||||
.careers-split, .careers-two-col { grid-template-columns: 1fr; }
|
||||
.careers-split__images { grid-template-columns: 1fr; }
|
||||
.career-cards { grid-template-columns: repeat(2, 1fr); }
|
||||
.benefits-grid { grid-template-columns: repeat(3, 1fr); }
|
||||
}
|
||||
@media (max-width: 540px) {
|
||||
.career-cards { grid-template-columns: 1fr; }
|
||||
.benefits-grid { grid-template-columns: repeat(2, 1fr); }
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,608 @@
|
||||
---
|
||||
---
|
||||
<article class="faq-page">
|
||||
<div class="faq-source container source-page">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<section class="faq-search container-narrow">
|
||||
<div class="hs-search-field hs-search-field--initialized">
|
||||
<div class="hs-search-field__bar hs-search-field__bar--button-inline">
|
||||
<form class="hs-search-field__form" action="/search">
|
||||
<label class="sr-only" for="faq-search-input">Search FAQs</label>
|
||||
<input
|
||||
id="faq-search-input"
|
||||
type="search"
|
||||
class="hs-search-field__input"
|
||||
name="q"
|
||||
autocomplete="off"
|
||||
placeholder="Search"
|
||||
data-faq-search
|
||||
/>
|
||||
<button class="hs-search-field__button" type="button" aria-label="Search">
|
||||
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" aria-hidden="true" width="18" height="18">
|
||||
<path d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z" fill="#254080"/>
|
||||
</svg>
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="faq-accordion" aria-labelledby="faq-questions-heading">
|
||||
<div class="container-narrow faq-accordion__inner">
|
||||
<h2 id="faq-questions-heading">Questions & Answers</h2>
|
||||
<div class="faq-list" data-faq-list></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="faq-cta faq-cta-primary">
|
||||
<div class="container-narrow">
|
||||
<p class="script-label">Still have questions?</p>
|
||||
<h2>Reach Out to Learn More</h2>
|
||||
<p>We hope this FAQ gives you a clear picture of how Applied Behavior Analysis (ABA) therapy at the Arizona Institute for Autism can support your child’s growth. If you have more questions or would like to <a href="/client-consultation">schedule an assessment</a>, please reach out. Our team is here to guide you and your learner every step of the way!</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="faq-cta faq-cta-secondary">
|
||||
<div class="container-narrow">
|
||||
<h2>Need Support in Getting an Autism Diagnosis?</h2>
|
||||
<p>To meet diagnostic criteria for ASD, a child must have persistent deficits in each of three areas of social communication and interaction plus at least two of four types of restricted repetitive behaviors. Consult with a Client Advocate today to receive individual and family support!</p>
|
||||
<a class="button button-center" href="/client-consultation">Request an Appointment</a>
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<script>
|
||||
const initFaqPage = () => {
|
||||
const root = document.querySelector('.faq-page');
|
||||
const source = root?.querySelector('.faq-source.source-page');
|
||||
const list = root?.querySelector('[data-faq-list]');
|
||||
const search = root?.querySelector('[data-faq-search]');
|
||||
|
||||
if (!(root instanceof HTMLElement) || !(source instanceof HTMLElement) || !(list instanceof HTMLElement) || !(search instanceof HTMLInputElement)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const nodes = [...source.childNodes];
|
||||
const firstQuestionIndex = nodes.findIndex((node) => node.nodeType === Node.ELEMENT_NODE && node.tagName === 'H3');
|
||||
|
||||
if (firstQuestionIndex === -1) {
|
||||
return;
|
||||
}
|
||||
|
||||
let index = firstQuestionIndex;
|
||||
let openedFirst = false;
|
||||
|
||||
while (index < nodes.length) {
|
||||
const node = nodes[index];
|
||||
|
||||
if (!(node instanceof HTMLElement) || node.tagName !== 'H3') {
|
||||
index += 1;
|
||||
continue;
|
||||
}
|
||||
|
||||
const details = document.createElement('details');
|
||||
details.className = 'faq';
|
||||
details.open = !openedFirst;
|
||||
|
||||
const summary = document.createElement('summary');
|
||||
const title = document.createElement('h3');
|
||||
title.textContent = node.textContent?.trim() || '';
|
||||
const icon = document.createElement('span');
|
||||
icon.className = 'faq-icon';
|
||||
icon.setAttribute('aria-hidden', 'true');
|
||||
summary.append(title, icon);
|
||||
details.appendChild(summary);
|
||||
|
||||
const answer = document.createElement('div');
|
||||
answer.className = 'faq-answer interactive-faq-with-seo-schema-integration__list__answer';
|
||||
const answerInner = document.createElement('div');
|
||||
answerInner.className = 'faq-answer__inner';
|
||||
|
||||
index += 1;
|
||||
while (index < nodes.length && !(nodes[index] instanceof HTMLElement && nodes[index].tagName === 'H3')) {
|
||||
const answerNode = nodes[index];
|
||||
if (answerNode.nodeType === Node.TEXT_NODE) {
|
||||
const text = answerNode.textContent?.trim();
|
||||
if (text) {
|
||||
const paragraph = document.createElement('p');
|
||||
paragraph.textContent = text;
|
||||
answerInner.appendChild(paragraph);
|
||||
}
|
||||
} else {
|
||||
answerInner.appendChild(answerNode.cloneNode(true));
|
||||
}
|
||||
answerNode.remove();
|
||||
index += 1;
|
||||
}
|
||||
|
||||
answer.appendChild(answerInner);
|
||||
details.appendChild(answer);
|
||||
list.appendChild(details);
|
||||
openedFirst = true;
|
||||
}
|
||||
|
||||
for (let i = firstQuestionIndex; i < nodes.length; i += 1) {
|
||||
nodes[i].remove();
|
||||
}
|
||||
|
||||
const faqItems = [...list.querySelectorAll('details.faq')];
|
||||
|
||||
const closeTimers = new WeakMap();
|
||||
const closeHandlers = new WeakMap();
|
||||
|
||||
const getAnswer = (item) => item.querySelector('.interactive-faq-with-seo-schema-integration__list__answer');
|
||||
const getAnswerInner = (item) => item.querySelector('.faq-answer__inner');
|
||||
|
||||
const setClosedStyles = (answer) => {
|
||||
answer.style.height = '0px';
|
||||
answer.style.opacity = '0';
|
||||
answer.style.transform = 'translateY(-.35rem)';
|
||||
};
|
||||
|
||||
const setOpenStyles = (answer) => {
|
||||
answer.style.opacity = '1';
|
||||
answer.style.transform = 'translateY(0)';
|
||||
};
|
||||
|
||||
faqItems.forEach((item, index) => {
|
||||
const answer = getAnswer(item);
|
||||
|
||||
if (!answer) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (index === 0 && item.open) {
|
||||
answer.style.height = 'auto';
|
||||
setOpenStyles(answer);
|
||||
delete item.dataset.state;
|
||||
} else if (!item.open) {
|
||||
answer.style.height = '0px';
|
||||
setClosedStyles(answer);
|
||||
}
|
||||
});
|
||||
|
||||
const closeItem = (item) => {
|
||||
if (!item.open || item.dataset.state === 'closing') {
|
||||
return;
|
||||
}
|
||||
|
||||
item.dataset.state = 'closing';
|
||||
const answer = getAnswer(item);
|
||||
const answerInner = getAnswerInner(item);
|
||||
|
||||
if (answer && answerInner) {
|
||||
const priorHandler = closeHandlers.get(item);
|
||||
if (priorHandler) {
|
||||
answer.removeEventListener('transitionend', priorHandler);
|
||||
}
|
||||
|
||||
answer.style.height = `${answerInner.scrollHeight}px`;
|
||||
answer.offsetHeight; // force reflow
|
||||
setClosedStyles(answer);
|
||||
|
||||
const onTransitionEnd = (event) => {
|
||||
if (event.target !== answer || event.propertyName !== 'height') {
|
||||
return;
|
||||
}
|
||||
|
||||
item.removeAttribute('open');
|
||||
delete item.dataset.state;
|
||||
answer.style.height = '0px';
|
||||
answer.removeEventListener('transitionend', onTransitionEnd);
|
||||
closeHandlers.delete(item);
|
||||
closeTimers.delete(item);
|
||||
};
|
||||
|
||||
closeHandlers.set(item, onTransitionEnd);
|
||||
answer.addEventListener('transitionend', onTransitionEnd);
|
||||
}
|
||||
|
||||
const timer = window.setTimeout(() => {
|
||||
const answerStillOpen = answer && answer.offsetHeight > 0;
|
||||
if (!answerStillOpen) {
|
||||
return;
|
||||
}
|
||||
|
||||
item.removeAttribute('open');
|
||||
delete item.dataset.state;
|
||||
if (answer) {
|
||||
answer.style.height = '0px';
|
||||
}
|
||||
closeHandlers.delete(item);
|
||||
closeTimers.delete(item);
|
||||
}, 360);
|
||||
closeTimers.set(item, timer);
|
||||
};
|
||||
|
||||
const openItem = (item) => {
|
||||
if (item.open && item.dataset.state !== 'closing') {
|
||||
return;
|
||||
}
|
||||
|
||||
const timer = closeTimers.get(item);
|
||||
if (timer) {
|
||||
window.clearTimeout(timer);
|
||||
closeTimers.delete(item);
|
||||
}
|
||||
|
||||
const priorHandler = closeHandlers.get(item);
|
||||
const answer = getAnswer(item);
|
||||
if (priorHandler && answer) {
|
||||
answer.removeEventListener('transitionend', priorHandler);
|
||||
closeHandlers.delete(item);
|
||||
}
|
||||
|
||||
item.setAttribute('open', '');
|
||||
item.dataset.state = 'opening';
|
||||
|
||||
const answerInner = getAnswerInner(item);
|
||||
if (answer && answerInner) {
|
||||
answer.style.height = '0px';
|
||||
setClosedStyles(answer);
|
||||
answer.offsetHeight; // force reflow
|
||||
window.requestAnimationFrame(() => {
|
||||
answer.style.height = `${answerInner.scrollHeight}px`;
|
||||
setOpenStyles(answer);
|
||||
});
|
||||
|
||||
const onTransitionEnd = (event) => {
|
||||
if (event.target !== answer || event.propertyName !== 'height') {
|
||||
return;
|
||||
}
|
||||
|
||||
if (item.dataset.state === 'opening') {
|
||||
answer.style.height = 'auto';
|
||||
delete item.dataset.state;
|
||||
}
|
||||
|
||||
answer.removeEventListener('transitionend', onTransitionEnd);
|
||||
};
|
||||
|
||||
answer.addEventListener('transitionend', onTransitionEnd);
|
||||
}
|
||||
};
|
||||
|
||||
faqItems.forEach((item) => {
|
||||
const summary = item.querySelector('summary');
|
||||
summary?.addEventListener('click', (event) => {
|
||||
event.preventDefault();
|
||||
const willOpen = !item.open;
|
||||
|
||||
faqItems.forEach((other) => {
|
||||
if (other !== item) {
|
||||
closeItem(other);
|
||||
}
|
||||
});
|
||||
|
||||
if (willOpen) {
|
||||
openItem(item);
|
||||
} else {
|
||||
closeItem(item);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const applyFilter = () => {
|
||||
const query = search.value.trim().toLowerCase();
|
||||
faqItems.forEach((item) => {
|
||||
const text = item.textContent?.toLowerCase() || '';
|
||||
item.hidden = Boolean(query) && !text.includes(query);
|
||||
});
|
||||
};
|
||||
|
||||
search.addEventListener('input', applyFilter);
|
||||
};
|
||||
|
||||
if (document.readyState === 'loading') {
|
||||
document.addEventListener('DOMContentLoaded', initFaqPage, { once: true });
|
||||
} else {
|
||||
initFaqPage();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.faq-page {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.faq-source {
|
||||
padding-block: 4rem 1rem;
|
||||
}
|
||||
|
||||
.faq-search {
|
||||
margin-bottom: 1.5rem;
|
||||
padding-block: 1rem 0.75rem;
|
||||
}
|
||||
|
||||
.sr-only {
|
||||
clip: rect(0, 0, 0, 0);
|
||||
border: 0;
|
||||
height: 1px;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
padding: 0;
|
||||
position: absolute;
|
||||
white-space: nowrap;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.hs-search-field {
|
||||
margin-inline: auto;
|
||||
width: min(780px, 100%);
|
||||
}
|
||||
|
||||
.hs-search-field--initialized {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.hs-search-field__bar {
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hs-search-field__form {
|
||||
display: flex;
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.hs-search-field__input {
|
||||
appearance: none;
|
||||
background: #fff;
|
||||
border: 2px solid rgba(37, 64, 128, .2);
|
||||
border-radius: 4px;
|
||||
color: var(--color-primary);
|
||||
flex: 1;
|
||||
font: inherit;
|
||||
line-height: 1.5;
|
||||
min-height: 3.125rem;
|
||||
min-width: 0;
|
||||
padding: .9rem 1.25rem;
|
||||
box-shadow: 0 1px 2px rgba(37, 64, 128, .06);
|
||||
}
|
||||
|
||||
.hs-search-field__input::placeholder {
|
||||
color: var(--color-muted);
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.hs-search-field__input:focus {
|
||||
border-color: var(--color-accent);
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.hs-search-field__button {
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
border: 2px solid rgba(37, 64, 128, .2);
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 2px rgba(37, 64, 128, .06);
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
justify-content: center;
|
||||
margin-left: 2px;
|
||||
min-height: 3.125rem;
|
||||
opacity: .85;
|
||||
padding-inline: 1rem;
|
||||
}
|
||||
|
||||
.hs-search-field__button:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.faq-accordion {
|
||||
background: var(--color-tint);
|
||||
padding-block: 2rem 4rem;
|
||||
}
|
||||
|
||||
.faq-accordion__inner {
|
||||
margin-inline: auto;
|
||||
}
|
||||
|
||||
.faq-accordion h2 {
|
||||
color: var(--color-primary);
|
||||
font-family: var(--font-heading);
|
||||
font-size: clamp(2rem, 4vw, 3rem);
|
||||
margin: 0 0 1.75rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
:global(.faq-list) {
|
||||
padding: 1.5rem 1.25rem 1rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq) {
|
||||
background: transparent;
|
||||
border-bottom: 1px solid var(--color-accent-strong);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq:last-child) {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq[hidden]) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:global(.faq-list summary) {
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
gap: 1.5rem;
|
||||
justify-content: space-between;
|
||||
list-style: none;
|
||||
padding: .875rem 0;
|
||||
}
|
||||
|
||||
:global(.faq-list summary::-webkit-details-marker) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:global(.faq-list summary h3) {
|
||||
color: var(--color-primary);
|
||||
font-family: var(--font-body);
|
||||
font-size: 1rem;
|
||||
font-weight: 700;
|
||||
line-height: 1.625;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-icon) {
|
||||
flex: 0 0 auto;
|
||||
display: block;
|
||||
height: 12px;
|
||||
margin-inline-start: auto;
|
||||
position: relative;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-icon::after) {
|
||||
border-bottom: 1px solid var(--color-accent-strong);
|
||||
border-right: 1px solid var(--color-accent-strong);
|
||||
content: "";
|
||||
display: block;
|
||||
height: 12px;
|
||||
transform: translateY(-50%) rotate(45deg);
|
||||
transform-origin: center;
|
||||
transition: transform 300ms ease;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
:global(.faq-list details[open] .faq-icon::after) {
|
||||
transform: rotate(-135deg);
|
||||
}
|
||||
|
||||
:global(.faq-list .interactive-faq-with-seo-schema-integration__list__answer) {
|
||||
height: 0;
|
||||
margin-bottom: 0;
|
||||
opacity: 0;
|
||||
transform: translateY(-.35rem);
|
||||
overflow: hidden;
|
||||
transition: height .3s ease, margin-bottom .3s ease, opacity .3s ease, transform .3s ease;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq[open] .interactive-faq-with-seo-schema-integration__list__answer) {
|
||||
margin-bottom: .85rem;
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner) {
|
||||
padding-bottom: .25rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer p) {
|
||||
margin: 0 0 1rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer p:last-child) {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner h4),
|
||||
:global(.faq-list .faq-answer__inner h5) {
|
||||
color: var(--color-primary);
|
||||
font-family: var(--font-heading);
|
||||
font-weight: 700;
|
||||
margin-top: 0;
|
||||
text-wrap: balance;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner h4) {
|
||||
font-size: 2rem;
|
||||
line-height: 2.5rem;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner h5) {
|
||||
font-size: 1.5rem;
|
||||
line-height: 2rem;
|
||||
margin-bottom: 1.25rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner :where(ul, ol)) {
|
||||
margin-block: 0 1.5rem;
|
||||
padding-inline-start: 2.5rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner :where(ul, ol) :where(ul, ol)) {
|
||||
margin-block: .25rem 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner li) {
|
||||
line-height: 1.625;
|
||||
margin-block: 0;
|
||||
padding-inline-start: .15rem;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner li > p) {
|
||||
margin-block: 0;
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner ul > li::marker) {
|
||||
color: var(--color-accent-strong);
|
||||
}
|
||||
|
||||
:global(.faq-list .faq-answer__inner ol > li::marker) {
|
||||
color: var(--color-primary);
|
||||
}
|
||||
|
||||
.faq-cta-primary {
|
||||
background: var(--color-primary);
|
||||
color: #fff;
|
||||
padding-block: 3.5rem;
|
||||
}
|
||||
|
||||
.faq-cta-primary .script-label {
|
||||
color: #f9b34d;
|
||||
}
|
||||
|
||||
.faq-cta-primary h2,
|
||||
.faq-cta-primary p {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.faq-cta-primary h2 {
|
||||
font-size: clamp(1.8rem, 4vw, 2.8rem);
|
||||
margin-bottom: .75rem;
|
||||
}
|
||||
|
||||
.faq-cta-secondary {
|
||||
background: #fff;
|
||||
padding-block: 3.5rem 4rem;
|
||||
}
|
||||
|
||||
.faq-cta-secondary h2 {
|
||||
color: var(--color-primary);
|
||||
font-size: clamp(1.8rem, 4vw, 2.8rem);
|
||||
margin-bottom: .75rem;
|
||||
}
|
||||
|
||||
.faq-cta-secondary .button {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.faq-source {
|
||||
padding-top: 4.5rem;
|
||||
}
|
||||
|
||||
.faq-search {
|
||||
margin-bottom: 2rem;
|
||||
padding-block-end: 1rem;
|
||||
}
|
||||
|
||||
.faq-list {
|
||||
padding: 2.5rem 2rem 1.5rem;
|
||||
}
|
||||
|
||||
.faq-accordion h2 {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,69 @@
|
||||
---
|
||||
import { getEntry } from 'astro:content';
|
||||
import BaseLayout from '../../layouts/BaseLayout.astro';
|
||||
import HomeBenefits from '../home/HomeBenefits.astro';
|
||||
import HomeDirector from '../home/HomeDirector.astro';
|
||||
import HomeEsa from '../home/HomeEsa.astro';
|
||||
import HomeFinancialHelp from '../home/HomeFinancialHelp.astro';
|
||||
import HomeHero from '../home/HomeHero.astro';
|
||||
import HomeInsurance from '../home/HomeInsurance.astro';
|
||||
import HomeProcess from '../home/HomeProcess.astro';
|
||||
import HomeServicesIntro from '../home/HomeServicesIntro.astro';
|
||||
import HomeSkills from '../home/HomeSkills.astro';
|
||||
import HomeTestimonials from '../home/HomeTestimonials.astro';
|
||||
import type { HomePageContent, HomeSection } from '../../types/home-sections';
|
||||
|
||||
interface Props { lang?: string }
|
||||
const { lang = 'en' } = Astro.props;
|
||||
const es = lang === 'es';
|
||||
const entry = await getEntry('pages', es ? 'es/index' : 'en/index');
|
||||
if (!entry) throw new Error(`[HomePage] Content entry not found for lang="${lang}". If running in dev, restart the dev server to rebuild the content layer cache.`);
|
||||
const { title, description, canonical } = entry.data;
|
||||
|
||||
function fromHomeContent(home: HomePageContent): HomeSection[] {
|
||||
return [
|
||||
{ type: 'hero', ...home.hero },
|
||||
{ type: 'services-intro', ...home.servicesIntro },
|
||||
{ type: 'benefits', ...home.benefits },
|
||||
{ type: 'skills', ...home.skills },
|
||||
{ type: 'insurance', ...home.insurance },
|
||||
{ type: 'esa', ...home.esa },
|
||||
{ type: 'financial-help', ...home.financialHelp },
|
||||
{ type: 'process', ...home.process },
|
||||
{ type: 'director', ...home.director },
|
||||
{ type: 'testimonials', ...home.testimonials },
|
||||
];
|
||||
}
|
||||
|
||||
const sections: HomeSection[] = entry.data.home
|
||||
? fromHomeContent(entry.data.home)
|
||||
: ((entry.data.sections ?? []) as HomeSection[]);
|
||||
---
|
||||
<BaseLayout {title} {description} {canonical} {lang}>
|
||||
{sections.map((section) => {
|
||||
switch (section.type) {
|
||||
case 'hero':
|
||||
return <HomeHero section={section} />;
|
||||
case 'services-intro':
|
||||
return <HomeServicesIntro section={section} />;
|
||||
case 'benefits':
|
||||
return <HomeBenefits section={section} />;
|
||||
case 'skills':
|
||||
return <HomeSkills section={section} />;
|
||||
case 'insurance':
|
||||
return <HomeInsurance section={section} />;
|
||||
case 'esa':
|
||||
return <HomeEsa section={section} />;
|
||||
case 'financial-help':
|
||||
return <HomeFinancialHelp section={section} />;
|
||||
case 'process':
|
||||
return <HomeProcess section={section} />;
|
||||
case 'director':
|
||||
return <HomeDirector section={section} />;
|
||||
case 'testimonials':
|
||||
return <HomeTestimonials section={section} />;
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
})}
|
||||
</BaseLayout>
|
||||
@@ -0,0 +1,78 @@
|
||||
---
|
||||
import Button from '../Button.astro';
|
||||
---
|
||||
|
||||
<style>
|
||||
.services-intro { padding-block: 5rem 1.25rem; }
|
||||
.services-intro-cta { margin-top: 2rem; text-align: center; }
|
||||
|
||||
.services-cards-section { background: var(--color-primary); padding-block: 3rem; }
|
||||
.services-cards-section h2 { color: white; margin-top: 0; text-align: center; }
|
||||
.services-cards-desc { color: white; margin-bottom: 2rem; }
|
||||
|
||||
.service-cards-grid { display: grid; gap: 20px; grid-template-columns: 1fr; }
|
||||
.service-card-link { background-color: var(--color-accent); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 6px; display: block; padding: 20% 2rem 2rem; text-align: center; text-decoration: none; transition: all .3s ease-in-out; }
|
||||
.service-card-link:hover { transform: scale(1.05); }
|
||||
.service-card-link:hover .service-card-title { background: #fffc; border-color: var(--color-accent-strong); color: var(--color-primary) !important; }
|
||||
.service-card-title { background: var(--color-accent); border: 2px solid var(--color-accent); border-radius: var(--radius-sm); color: var(--color-primary) !important; display: inline-block; font-family: var(--font-body); font-size: 1rem; font-weight: 600; line-height: 1.5; margin: 0; padding: .65rem 1.2rem; position: relative; top: .15rem; white-space: nowrap; }
|
||||
|
||||
.services-diagnosis-section { margin-block: 6rem; }
|
||||
.services-diagnosis-card { background: var(--color-tint); border-radius: 6px; padding: 2rem 1.25rem; }
|
||||
.services-diagnosis-inner { align-items: center; display: flex; flex-direction: column; gap: 2rem; justify-content: space-between; }
|
||||
.services-diagnosis-text h2 { margin-top: 0; }
|
||||
.services-diagnosis-text p { margin-bottom: 0; }
|
||||
.services-diagnosis-btn { min-width: fit-content; }
|
||||
|
||||
@media (min-width: 768px) { .service-cards-grid { gap: 30px; grid-template-columns: repeat(2, 1fr); } .services-diagnosis-card { padding: 4.375rem; } .services-diagnosis-inner { flex-direction: row; } }
|
||||
@media (min-width: 768px) and (max-width: 1023px) { .service-card-link:last-child { grid-column: 1 / -1; margin-inline: auto; padding-top: calc(10% - 3px); width: calc(50% - 15px); } }
|
||||
@media (min-width: 1024px) { .service-cards-grid { grid-template-columns: repeat(3, 1fr); } .service-card-link { padding-top: 42%; } }
|
||||
</style>
|
||||
|
||||
<section class="services-intro">
|
||||
<div class="container">
|
||||
<h2>Autism Spectrum Disorder Services</h2>
|
||||
<p>Autism Spectrum Disorder (ASD) refers to a group of complex brain development disorders and is characterized by difficulties with social interaction, verbal and non-verbal communication, and emotional control.</p>
|
||||
<p>The Arizona Institute for Autism helps with Autism Evaluations and Diagnostic Screenings, Applied Behavior Analysis (ABA) Therapy, and Educational Programming tailored to each learner's needs. To support meaningful skill development, we design integrative ABA programs for children diagnosed with autism. We offer both individualized and group ABA Therapy, along with educational services that reflect each child's unique strengths and goals.</p>
|
||||
<h3>AIA ABA & Educational Options</h3>
|
||||
<ul>
|
||||
<li>In-Center</li>
|
||||
<li>In-School</li>
|
||||
<li>In-Home</li>
|
||||
<li>Early Intervention</li>
|
||||
<li>Academic Readiness</li>
|
||||
<li>Clinical Supervision</li>
|
||||
<li>Parent Consultation</li>
|
||||
</ul>
|
||||
<h3>Does My Learner Have Autism?</h3>
|
||||
<p>Approximately 1 in 36 children in the United States will receive an autism diagnosis each year. If your child exhibits any of the behaviors listed above, it is possible that he or she may be diagnosed on the autism spectrum. Diagnosing children with Autism Spectrum Disorder can be challenging and complex. The most important thing you can do is consult a professional if you think your child is displaying atypical behavior.</p>
|
||||
<p class="services-intro-cta"><Button href="/client-consultation">Consult with a Client Advocate</Button></p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="services-cards-section">
|
||||
<div class="container">
|
||||
<h2>Our Services</h2>
|
||||
<p class="services-cards-desc">Arizona Institute for Autism (AIA) offers a comprehensive range of services tailored to individuals with Autism Spectrum Disorder (ASD). Our programs include early intervention for young children, Applied Behavior Analysis (ABA) therapy, social skills groups, and educational support services. AIA is committed to providing personalized care plans to enhance the quality of life for children with autism and their families.</p>
|
||||
<div class="service-cards-grid">
|
||||
<a href="/aba-therapy" class="service-card-link" style="background-image:url('/assets/images/services-card-behavioral.jpg')"><h3 class="service-card-title">Behavioral Services</h3></a>
|
||||
<a href="/autism-evaluations" class="service-card-link" style="background-image:url('/assets/images/services-card-psychological.jpg')"><h3 class="service-card-title">Psychological Services</h3></a>
|
||||
<a href="/learner-social-club" class="service-card-link" style="background-image:url('/assets/images/services-card-sociological.jpg')"><h3 class="service-card-title">Sociological Services</h3></a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="services-diagnosis-section">
|
||||
<div class="container container-w">
|
||||
<div class="services-diagnosis-card">
|
||||
<div class="services-diagnosis-inner">
|
||||
<div class="services-diagnosis-text">
|
||||
<h2>Need Autism Diagnosis Support?</h2>
|
||||
<p>To meet diagnostic criteria for ASD, a child must have persistent deficits in each of three areas of social communication and interaction plus at least two of four types of restricted repetitive behaviors. Consult with a Client Advocate today to receive individual and family support!</p>
|
||||
</div>
|
||||
<div class="services-diagnosis-btn">
|
||||
<Button href="/client-consultation">Get a Free Consultation</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -0,0 +1,94 @@
|
||||
---
|
||||
const groups = [
|
||||
{
|
||||
title: 'Board Certified Behavioral Analysts & Psychologists',
|
||||
members: [
|
||||
['team-rula-diab.webp', 'Rula Diab, BCBA, LBA, M.Ed', 'Clinical Director'],
|
||||
['team-jennifer-espinoza.webp', 'Jennifer Espinoza, MAOL/ABA', 'Clinical BCBA'],
|
||||
['team-timirah-clay.webp', 'Timirah Clay, M.Psy/ABA', 'Clinical BCBA']
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Clinical Support',
|
||||
members: [
|
||||
['team-carol-harrington.webp', 'Carol Harrington, A.A. Spec. Ed.', 'Clinical Manager'],
|
||||
['team-rachel-crosby.webp', 'Rachel Crosby', 'Clinical Administrator'],
|
||||
['team-jennifer-bonefont.webp', 'Jennifer Bonefont, B.A. Psy', 'Clinical Client Advocate Supervisor']
|
||||
]
|
||||
},
|
||||
{
|
||||
title: 'Clinical Case Supervisors',
|
||||
members: [['team-rachael-sanchez.webp', 'Rachael Sanchez, BS, M Psy/ABA', 'Clinical Supervisor']]
|
||||
},
|
||||
{
|
||||
title: 'Clinical Education Specialists',
|
||||
members: [['team-mahima-bedi.webp', 'Mahima Bedi', 'Clinical Instructor']]
|
||||
},
|
||||
{
|
||||
title: 'ABA Clinic Management',
|
||||
tagline: 'Applied Behavior Analysis "(ABA) at your service"',
|
||||
tinted: true,
|
||||
members: [
|
||||
['team-mariah-marley.webp', 'Mariah Marley', 'Claims Billing'],
|
||||
['team-eney-garcia.webp', 'Eney Garcia, BA', 'Accounts Billing'],
|
||||
['team-ayah-shahbander.webp', 'Ayah Shahbander', 'Human Resources'],
|
||||
['team-barbara-samanich.webp', 'Barbara Samanich, BFA', 'Creative Marketing Developer']
|
||||
]
|
||||
}
|
||||
];
|
||||
---
|
||||
<article class="team-page">
|
||||
<section class="team-intro container-narrow">
|
||||
<h2>Our Clinical Team</h2>
|
||||
<p class="script-label">Arizona Institute for Autism<br />Scottsdale, Arizona</p>
|
||||
<p>AIA's clinical team consists of experienced professionals and paraprofessionals as well as Board Certified Behavior Analysts (BCBA) and Psychologists who have diverse experience and expertise.</p>
|
||||
</section>
|
||||
{groups.map((group) => (
|
||||
<section class:list={['team-group', { 'section-tint': group.tinted }]}>
|
||||
<div class="container">
|
||||
<h2>{group.title}</h2>
|
||||
{group.tagline && <p class="team-group__tagline"><em>{group.tagline}</em></p>}
|
||||
<div class="team-grid">
|
||||
{group.members.map(([image, name, role]) => (
|
||||
<article class="team-member">
|
||||
<div class="team-thumb">
|
||||
<img src={`/assets/images/${image}`} alt={name} loading="lazy" />
|
||||
</div>
|
||||
<h3>{name}</h3>
|
||||
<p>{role}</p>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
))}
|
||||
<section class="team-careers">
|
||||
<div class="container-narrow">
|
||||
<p class="script-label">Join the AIA Team!</p>
|
||||
<h2>Employment Opportunities</h2>
|
||||
<p>Apply online to join the AIA team! At the Arizona Institute for Autism (AIA) we are on a mission to improve special education and strengthen communities throughout Arizona.</p>
|
||||
<p>Our talented and passionate employees are a critical piece to the high-quality ABA therapy we provide along with our commitment to behavioral health, school solutions, and community outreach. For questions regarding open positions, please contact us at <a href="mailto:hr@azinstitute4autism.com">hr@azinstitute4autism.com</a>.</p>
|
||||
<a class="button" href="/careers">View Open Positions</a>
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<style>
|
||||
.team-intro { padding-block: 4rem; text-align: center; }
|
||||
.team-intro .script-label { font-size: 1.8rem; }
|
||||
.team-group { padding-block: 2rem 4rem; text-align: center; }
|
||||
.team-group h2 { margin: 0 auto 1rem; max-width: 760px; }
|
||||
.team-group__tagline { font-size: 1.125rem; margin: 0 auto 2rem; }
|
||||
.team-grid { display: flex; flex-wrap: wrap; gap: 2rem 1.5rem; justify-content: center; }
|
||||
.team-member { flex: 0 0 227px; }
|
||||
.team-thumb { border-radius: 4px; overflow: hidden; }
|
||||
.team-thumb img { display: block; object-fit: cover; transform: scale(1.1); transition: transform .5s; width: 100%; }
|
||||
.team-thumb img:hover { transform: scale(1.05); }
|
||||
.team-member h3 { font-family: var(--font-body); font-size: .8rem; margin-bottom: 0; }
|
||||
.team-member p { font-size: .85rem; margin: 0; }
|
||||
.team-careers { padding-block: 5rem; }
|
||||
.team-careers .button { margin-left: 50%; margin-top: 4rem; translate: -50%; }
|
||||
@media (max-width: 950px) {
|
||||
.team-member { flex-basis: min(100%, 227px); }
|
||||
}
|
||||
</style>
|
||||
Reference in new issue
Block a user