DESIGN / ELEMENTOR BUILD REQUIREMENTS
==================================================

APPROVED MCP BUILD PATH

When Admatic Core MCP is available:

1. Complete and lock the Core project draft, page plan, component variants, content, SEO and media manifest.
2. Call admatic/sites/build-project once without dryRun. Global approval is the default authorization for the exposed workflow.
3. Retain the public workflow ID and poll admatic/workflows/get-status until data.releaseGate.releaseReady is true. Then return data.release.artifact.downloadUrl for the existing ZIP. If the status tool is temporarily unavailable, use the project-summary or validation response's data.releaseGate; never call the staging Worker REST endpoint directly.
4. For an evidenced structural repair, inspect the snapshot and schema, plan a bounded patch, apply it under global approval, validate, and rerun QA.
5. Keep idempotency, recovery snapshots and post-write validation intact. Use dryRun only when the user explicitly asks for a preview.

Never transmit raw Elementor JSON as an MCP argument. Use only approved component contracts or admatic.native-composition.v2. Do not skip snapshot, bounded plan, apply and authoritative validation. Region-weighted visual QA is actionable evidence for at most three automatic same-project correction passes.

Build fully editable Elementor pages.

Use:
- Elementor container-based layout
- Populated content arrays


- Fresh custom design
- Global styles/tokens
- Responsive settings
- Clean spacing
- Rounded corners where relevant
- Modern card/info-box layout where relevant
- CSS/Grid where appropriate
- Flex layouts without wrap for general structure
- Valid Elementor icon data only
- Safe inline SVG, text arrows, CSS shapes or verified Font Awesome classes for decorative
icons
- Elementor Pro Nav Menu widgets for global header and footer navigation
- Elementor Pro Forms for contact/lead forms when a form is part of the brief
- A hard build failure when Elementor Pro is missing or incompatible; do not silently downgrade a production-standard package

Do not use:
- Flexbox Wrap
- Old Elementor section/column layouts unless unavoidable
- Unnecessary negative margins
- Unusual layout hacks
- Broken icon objects
- Empty image widgets
- Missing image URLs
- Fake plugin functionality that cannot work
- Raw HTML navigation as the main header or footer navigation
- Screenshot crops from reference images as placeholder assets
- Plain fallback styling for core design

Spacing:
- Use padding and container gap for spacing
- Avoid negative margins unless absolutely necessary
- Keep content inside boxed/site structure by default
- Use full-width sections only when the reference design clearly calls for it

Responsive:
- Include desktop, tablet and mobile settings
- Mobile header must work
- Mobile menu must work
- No horizontal scrolling
- No oversized text
- No broken cards
- No text overflow
- Buttons must be easy to tap on mobile
- Forms must be usable on mobile
- Repeated cards should stack cleanly on mobile
- Grid sections must have responsive fallbacks

==================================================


FRONTEND DESIGN IMPLEMENTATION - MANDATORY
==================================================

The design must be implemented entirely in Elementor widget/container/responsive settings
and global Site Settings. Do not include project CSS, Elementor custom CSS or page/section
classes for enhancements, fixes, grids or fallback styling.

Core visual styling must be present in the Elementor JSON/content arrays:
- Section background colors/images/overlays
- Container widths
- Section padding
- Container gaps
- Typography sizes, weights and colors
- Button styling
- Card backgrounds
- Card borders
- Card radius
- Card shadows
- Image radius
- Grid/card layouts
- Header styling
- Footer styling
- Mobile spacing
- Responsive behavior

The package must not produce a plain or unfinished looking site after Kit Factory Build.

Reference-matching requirements:
- Hero section must clearly resemble the reference structure and visual hierarchy.
- Header must resemble the reference direction, including logo/menu/CTA placement.
- Cards must have intentional styling, spacing, borders, radius and hover/visual treatment.
- Sections must have clear rhythm and alternating background treatments where the
reference does.
- CTA sections must be visually distinct.
- Footer must be designed, not default/plain.
- Mobile layout must still feel designed and complete.

Native Elementor styling:
- Do not include project CSS or Elementor custom CSS.
- Keep page and section CSS Classes fields empty.
- Store every visual and responsive value in Elementor settings so the site is editable and complete immediately after import.


Build-quality rule:
The final output should look like a finished website immediately after Build, not like a
wireframe, placeholder layout, or partially styled Elementor page.

No plain fallback rule:
- Do not deliver a package where fallback styling makes the site look plain.
- Fallbacks are allowed for plugin features, but not for the core visual design.
- If a plugin is inactive, the page must still look like a designed website.
- The design must not depend on the user manually opening and saving Elementor pages.

==================================================
ELEMENTOR CSS GENERATION / POST-BUILD STYLE RELIABILITY - MANDATORY
==================================================

The finished website must not require opening Elementor and clicking Update before styles
appear.

After Kit Factory Build, all Elementor styles must be generated and visible on the frontend
immediately.

The project/package must be prepared so Kit Factory can:
- Regenerate Elementor CSS/files after all pages and templates are imported
- Regenerate CSS for every imported page
- Regenerate CSS for every imported Elementor template
- Regenerate CSS for the active Elementor Site Kit/global settings
- Clear Elementor CSS cache/files where needed
- Clear WP Rocket/cache plugin cache if active
- Clear/minify cache if performance plugins are active

Do not rely on the first Elementor editor save to generate missing frontend styles.

Post-build QA must confirm:
- Header styling appears before manually editing the header
- Footer styling appears before manually editing the footer
- Frontpage styling appears before manually editing the page
- Elementor-generated page/template CSS files are regenerated
- The site looks finished immediately after Build

README-HANDOFF.txt must mention:
- Whether Elementor CSS regeneration was performed
- Whether WP Rocket/cache clearing is required after build
- Whether any manual cache/CSS action is needed

QA-CHECKLIST.txt must include:
- Elementor CSS regenerated
- Cache cleared
- Frontend checked before manual Elementor editing


- Header/footer/page styles visible immediately after build

==================================================
PAGES / CONTENT
==================================================

Create all required pages with Danish content unless otherwise requested.

For each page:
- Use the client's real info
- Use clear conversion-focused copy
- Use local SEO where relevant
- Use natural Danish
- Use section structure based on the reference screenshots
- Include CTA sections
- Include contact details where relevant
- Make everything editable in Elementor

Recommended page structure:

Forside:
- Hero section
- Intro/trust section
- Services overview
- Why choose us / benefits
- Visual content/card section
- CTA/contact strip
- FAQ or reassurance section
- Contact section

Om os:
- Brand story
- Values
- Trust/experience
- Clinic/business info
- CTA

Ydelser:
- Service cards
- Short descriptions
- Benefits
- CTA per service or section
- FAQ

Kontakt:
- Contact form
- Phone/email/address
- Opening hours if provided


- Map placeholder or address section
- CTA

==================================================
HEADER / FOOTER
==================================================

Header:
- Must be a populated Elementor template
- Must be globally connected
- Must contain logo/site name
- Must contain navigation
- Must use an Elementor Pro Nav Menu widget connected to the primary menu
- Must contain primary CTA
- Must include sticky-header plugin adapter support
- Must be mobile-friendly
- Must preserve only the exact semantic global/header markers required by the production standard, and must not target them for design
- Must include an intentional navigation area
- Must be compatible with Kit Factory v2.13.1+ auto-insert/connect Nav Menu
behavior
- Must be styled directly in Elementor settings
- Must not appear unstyled before opening Elementor editor
- Must have readable text/menu colors before and after sticky scroll state

Footer:
- Must be a populated Elementor template
- Must be globally connected
- Must include business name
- Must include phone
- Must include email
- Must include address
- Must include navigation links
- Must use an Elementor Pro Nav Menu widget connected to the footer menu
- Must include CTA/contact info
- Must be mobile-friendly
- Footer menu must use location: "footer"
- Must be styled directly in Elementor settings
- Must not appear unstyled before opening Elementor editor
- Must have readable text and link colors

==================================================
VALIDATOR / AUTO-REPAIR EXPECTATIONS
==================================================

The package should be compatible with Kit Factory's validator and auto-repair mode.


Before delivery, make sure the package should pass or only show acceptable warnings for:

Package validator:
- project.json exists in root
- schema_version exists and is compatible
- all pages have title, slug, type, content
- all templates have title, slug, type, content
- header/footer have global conditions
- homepage has is_front: true
- image references resolve
- global colors/fonts exist
- forms are populated with Elementor Pro when a form is required
- no empty containers
- no broken icon data
- menu data exists where required
- plugin adapters are referenced
- Elementor-safe header/footer conditions exist
- site identity is prepared
- CSS generation/cache notes exist

Auto-repair compatibility:
The package should be structured so Kit Factory can safely repair minor issues such as:
- Add missing type
- Add missing template conditions
- Add is_front: true to first page if missing
- Convert relative image paths to uploaded media URLs
- Restore only canonical header/footer markers required by the production-standard contract; never inject discretionary project classes
- Normalize global colors/fonts
- Remove or flag empty containers
- Replace bad icon objects with safe fallback text/icon
- Reject raw HTML navigation in a production-standard project and require Elementor Pro Nav Menu widgets
- Auto-insert/connect Nav Menu widget into header templates if a WordPress menu exists
and the header has no Nav Menu widget
- Assign menus to Admatic Theme locations primary/footer
- Regenerate Elementor CSS/files after build where supported
- Clear Elementor/WP Rocket cache where supported
- Apply site identity defaults where supported

==================================================

CAPABILITY ADAPTER REGISTRY V3
Every canonical package stores 17 named contracts: menu-header-footer, elementor-pro-forms, mobile-cta, sticky-header-effects, visual-fidelity-v3, performance-images, seo-metadata, schema-aeo, social-meta, accessibility-semantics, analytics-events, consent-mode, security-delivery, dynamic-content, booking-conversion, woocommerce-commerce and multilingual-routing. The last three apply only when their features are detected. Analytics must not inject tracking until explicitly configured and consented. Plugin candidates are optional implementation accelerators except Elementor Pro, which remains mandatory.
