Shopify (Feather Theme) – Convert Split Layout to Stacked + Add Dynamic Collapsible Sections -- 2

Job ID: 40266047

Budget: $30 – $250 USD

*** PLEASE READ PROJECT DESCRIPTION - DO NOT ASK QUESTIONS THAT ARE ALREADY CONTAINED ***

*** PLEASE INPUT AN ACCURATE BID. QUOTES THAT ARE HIGHER THAN THE BID WILL NOT BE ACCEPTED ***

*** ASK QUESTIONS PRIOR TO ENTERING A BID ***

We are using the Feather theme by Archetype on Shopify.
Currently, our product pages use a split layout (images on the left, description/info on the right).
We want to switch to a stacked full-width layout and introduce collapsible information sections that pull from product-specific metafields (so each product displays its own details dynamically).

Scope of Work:
1. Layout Conversion (Feather Theme)
Convert the Feather product page from a split (two-column) layout to a stacked, full-width layout.
Maintain all native Feather functionality (image gallery, variant selector, dynamic checkout, sticky add-to-cart, and zoom).

Layout order should be:
Product media/gallery
Product title, price, and purchase buttons
Product description (full width)
Collapsible sections (dynamic metafields)

2. Collapsible Sections (Dynamic / Per Product)
Create collapsible sections that pull values from Shopify product metafields, ensuring that each product can have unique content.

Metafields required:
Variety (e.g., Pacamara, Castillo, etc.)
Country of Origin (e.g., El Salvador, Colombia)
Roast Level (e.g., Medium, Medium-Dark)
Brewing Methods (Rich Text – allows multiple lines or formatting)

Developer must:
Create metafield definitions in Settings → Custom data → Products.
Use product.metafields.custom.* calls in Liquid to dynamically populate the collapsibles.
Make collapsibles reorderable or toggleable in the Shopify visual editor (no hard-coded content).
Keep everything responsive and visually consistent with Feather’s design system.

Deliverables:
Updated main-product.liquid (or a new custom section) implementing stacked layout and metafield-based collapsibles.
Corresponding metafield setup in Shopify admin for per-product data entry.
Clean, lightweight CSS to ensure consistent spacing and alignment.
Short documentation explaining how to add metafield content for new products.

Technical Requirements:
Developer must have prior experience customizing Archetype themes (Feather, Streamline, Motion, Impulse, etc.).
All content must remain editable via Shopify Theme Editor and metafields — no hard-coded values.
Feather’s core JS behavior (gallery, cart, checkout) must remain unaffected.