AICTPO AI Coding Agents Knowledge Modules

Accordion section with 9 questions about the AI agents platform. The section anchors at #faq on the home page rather than living at its own URL. The section heading appears above a vertical stack of 9 question rows. Each row collapses to a single line by default and expands inline when its trigger button is clicked. Rows are not mutually exclusive — the user can have several open simultaneously. Each question row is a button with aria-expanded toggling between "false" (collapsed) and "true" (expanded). The answer panel is the next sibling and is hidden via [hidden] or zero-height styling when collapsed. Clicking the button or pressing Enter / Space while focused toggles the state. Snapshot all questions: scroll #faq into view, list every button[aria-expanded] inside it, capture text content for each. Read all answers: for each question button, click to expand if aria-expanded="false", snapshot the matching answer panel by aria-controls ID, then collapse. Verify count and order: assert exactly 9 question rows and that the visible label text matches the expected question copy. The answer panels are inert when collapsed — they may not be in the accessibility tree at all, so a snapshot before expansion will miss them.Smooth-scroll on the parent page can intercept #faq deep links; wait for scroll to settle before reading positions.The accordion is intentionally non-exclusive. Tests that assume "expanding question N collapses question N-1" will fail.Keyboard activation works on Enter and Space — both should be supported in any QA flow that exercises a11y.

Marketing landing page at /. Anchors all of the site's top-level sections — hero, mobile app showcase, FAQ, pricing, plus the global header and footer that wrap every other page. The global header and footer also appear on /imprint, /privacy, /terms, and any other route — they are not unique to home. The hero is the first paint above the fold. It contains: H1 headline: "Your AI Engineering Department"A short subheading explaining the value propA primary CTA button (typically routing to a contact / signup target) Selector hints: main > section:first-of-type h1, primary CTA via [data-cta] or by visible text. Nav links scroll to in-page anchors (#mobile-app, #faq, #pricing) rather than navigating between pages. Clicking a nav link should trigger a smooth scroll. The mobile menu collapses behind a hamburger toggle below the breakpoint. Verify hero render: navigate to /, snapshot the first <section>, assert the H1 text and that the CTA is visible and clickable. Test in-page navigation: click each nav link, verify the URL hash updates and the corresponding section scrolls into view. Check global chrome: assert the header and footer render with the expected link set on every page (/, /imprint, /privacy, /terms).

German legal imprint page (Impressum) at /imprint. Static content required by §5 TMG (Telemediengesetz) for any commercial website operated from Germany. The page is mostly informational text — there is no interactive state to track beyond rendering. The page renders as a single column of headings + paragraphs inside the global page chrome. The order of blocks usually follows the list above, but only the existence of each block is required by law — not the ordering. Verify all required blocks are present: snapshot the main content region, check each section heading matches the expected block name. Verify EU ODR link: locate the link by href substring consumers/odr and assert it is a valid outbound HTTPS link. Verify contact email is reachable: extract the email link, optionally probe DNS / MX records out-of-band (do not actually send mail from a test). The imprint must remain reachable from every page on the site — typically via a footer link. QA should also assert the footer link is present and resolves.Email addresses are sometimes obfuscated (HTML entities, JS injection) to deter scraping; selector strategy must handle decoded text.VAT ID may be absent if the entity is not VAT-registered (Kleinunternehmer); its absence is not an error.This page is one of the rare ones where SEO keyword optimization should be deprioritized — accuracy of the legal text matters more than keyword density.

"Your Fleet In Your Pocket" marketing section anchored at #mobile-app on the home page. A phone mockup with a four-tab carousel demonstrating product capabilities. Tabs are mutually exclusive — selecting one updates the phone mockup screenshot and surrounding caption. The section is a two-column layout (stacks vertically on mobile): Left: tab list with label + icon + short description.Right: phone-shaped frame containing the screenshot for the active tab. Above the columns sits the section heading. Below them, an optional CTA may appear depending on campaign config. Tab activation follows the WAI-ARIA pattern: click or ArrowLeft / ArrowRight while a tab is focused moves selection. The active tab gets aria-selected="true"; the corresponding panel becomes visible while inactive panels are hidden via hidden attribute or display:none. Cycle all tabs: click each tab in order, snapshot the panel after each click, assert the screenshot src changes between tabs. Verify default tab: on first load, assert the first tab is aria-selected="true" and its panel is visible. Test keyboard navigation: focus the first tab, press ArrowRight three times, assert the fourth tab is now active.

The pricing module is the primary conversion section of aictpo.com. It displays three plan cards (Squad, Fleet, Custom Fleet) with feature lists and pricing. Clicking any CTA button opens a lead capture modal with a contact form that submits to a hosted form endpoint. On success, the user is redirected to /start which embeds a Calendly booking widget. Navigate to https://aictpo.com/Click "Pricing" in nav or scroll to #pricingVerify three plan cards visible: Squad, Fleet, Custom FleetVerify pricing: Squad $125/agent, Fleet $99/agent Scroll to #pricing sectionClick the plan's CTA button (button[data-plan="Squad"], button[data-plan="Fleet"], or button[data-plan="Custom Fleet"])Wait for modal: #lead-modal.lead-modal-openVerify modal title matches plan (e.g., "Start with Squad")Verify plan badge shows correct plan name Open lead modal for desired plan (Task 2)Type name into input#lead-nameType valid email into input#lead-emailOptionally type message into textarea#lead-messageClick submit button #lead-submitWait for redirect to /startVerify "You're In" heading visibleVerify Calendly iframe loaded Open lead modal for any planClick submit without filling fieldsVerify name error visible: #lead-name-error.lead-error-visibleVerify email error visible: #lead-email-error.lead-error-visibleVerify name input has class lead-input-error Open lead modal for any planClose via one of:Click close button #lead-modal-closeClick backdrop #lead-modal-backdropPress Escape keyVerify modal no longer has class lead-modal-openVerify body overflow restored (scroll enabled)

GDPR-compliant privacy policy at /privacy. Static content; no interactive state beyond rendering. The page is required to be reachable from every other page on the site (typically via a footer link). Single column of headings + paragraphs inside the global page chrome. Long-form text; no carousels, accordions, or other interactive components by default. Verify required sections present: snapshot the main content, check each required heading is present. Verify last-updated date: locate the "Last updated" / "Letzte Aktualisierung" line, parse the date, assert it is plausibly recent. Verify cookie disclosure aligns with deployed cookies: cross-check the cookie list against what the site actually sets in the browser at first visit. Verify supervisory authority contact: assert the DPA contact (typically the relevant German Landesdatenschutzbeauftragte) is named and reachable. Privacy policy text is the controlling document for compliance — accuracy matters more than SEO. Do not rewrite copy for keyword optimization.The page may exist in two languages (English and German) at parallel URLs. Both must stay in sync.Cookie disclosure must match the actual cookie banner behavior — drift between the policy text and the cookie consent UI is itself a GDPR violation."Last updated" should be re-stamped any time the policy changes; QA can flag stale dates as a soft signal that copy may have drifted from current practice.

Terms of service / Allgemeine Geschäftsbedingungen at /terms. Static content covering the contractual relationship between the platform operator and its clients. German jurisdiction (German civil and commercial law applies). Single long-form column of headings + paragraphs inside the global page chrome. No interactive elements by default. Verify required clauses present: snapshot the page, check that core sections (governing law, liability, termination) are present. Verify governing law clause: locate the "Governing law" / "Anwendbares Recht" section, assert it names German law. Verify last-updated date: parse the version / "last updated" line, flag if stale relative to a known recent revision. Verify accessibility from other pages: assert that /terms is reachable from at least the footer of every other page. Terms are the controlling contract; do not rewrite copy for SEO. Edits require legal review.A change to the terms typically requires advance notice to existing customers (per the Changes section). Silent edits can be unenforceable.Bilingual sites should keep English and German versions in sync; if they diverge, the version specified in the Governing Law section usually controls.Customer-facing tooltips that summarize the terms ("by clicking you agree…") must not contradict the terms themselves — drift between the two is a frequent compliance bug.