Sections Documentation

Bio Blocks

Partial: partials/sections/bio_blocks.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Bio Blocks”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_bio_blocks.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Blocks

Partial: partials/sections/blocks.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Blocks”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_blocks.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Body Hero Banner

Partial: partials/sections/body_hero_banner.php

Availability

Editor usage

Quick link: Search ACF groups for “Body Hero Banner”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_body_hero_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Body Vimeo Video

Partial: partials/sections/body_vimeo_video.php

Availability

Editor usage

Quick link: Search ACF groups for “Body Vimeo video”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_body_vimeo_video.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Body Youtube Video

Partial: partials/sections/body_youtube_video.php

Availability

Editor usage

Quick link: Search ACF groups for “Body Youtube video”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_body_youtube_video.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Border Columns

Partial: partials/sections/border_columns.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Border Columns”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_border_columns.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Card Slider

Partial: partials/sections/card_slider.php

Carousel of card-like slides with image, pre-head, heading, copy, and CTAs. Rich layout controls for padding, image alignment, and banner ratio.

Image guidance

• sizes: slide_image '(max-width: 767px) 100vw, (min-width: 768px) 50vw' typical
• widths: 372, 608, 744, 1216
• LCP: Not LCP; allow lazy.

Availability

Editor usage

Quick link: Search ACF groups for “Card Slider”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_card_slider.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Carousel

Partial: partials/sections/carousel.php

Owl carousel with per-slide image, pre-head, heading, rich copy, and CTA buttons. Supports colored background and copy color themes.

Image guidance

• sizes: '(max-width: 767px) 100vw, 50vw' for slide_image; pre-head image smaller '(max-width: 767px) 50vw, 25vw'
• widths: slide_image: 372, 608, 744, 1216; pre_head: 160, 320, 480
• LCP: Not intended for LCP; allow default lazy behavior except perhaps first slide in above-the-fold use.

Availability

Editor usage

Quick link: Search ACF groups for “Colored Carousel”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_carousel.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Carousel Copy Block

Partial: partials/sections/carousel_copy_block.php

Availability

Editor usage

Quick link: Search ACF groups for “Colored Img Carousel Single Copy ”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_carousel_copy_block.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Code Section

Partial: partials/sections/code_section.php

Availability

Editor usage

Quick link: Search ACF groups for “Code Section”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_code_section.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Compare Images Slider

Partial: partials/sections/compare_images_slider.php

Side-by-side (or overlay) image comparison slider to show before/after or variants.

Image guidance

• sizes: '(max-width: 767px) 100vw, 100vw'
• widths: 768, 1024, 1366, 1600, 1920
• LCP: Not LCP; allow lazy.

Availability

Editor usage

Quick link: Search ACF groups for “Compare Images Slider”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_compare_images_slider.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Contact Form

Partial: partials/sections/contact_form.php

Centered or aligned contact form with optional heading and lead copy, renders via shortcode.

Image guidance

• LCP: Not LCP; ensure form scripts are deferred when possible.

Availability

Editor usage

Quick link: Search ACF groups for “Contact Form”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_contact_form.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Contact Form Halves

Partial: partials/sections/contact_form_halves.php

Availability

Editor usage

Quick link: Search ACF groups for “Contact Form Halves”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_contact_form_halves.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Copy Columns

Partial: partials/sections/copy_columns.php

N columns (1–4) with optional image, pre-head, heading, lead copy and CTAs per column. Supports per-section alignment, colors, and gutters.

Image guidance

• sizes: column image '(max-width: 767px) 100vw, (min-width: 768px) 33vw' typical
• widths: 240, 360, 480, 720
• LCP: Not typically LCP; rely on lazy.

Availability

Editor usage

Quick link: Search ACF groups for “Content Columns”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_copy_columns.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Db Column

Partial: partials/sections/db_column.php

Availability

Editor usage

Quick link: Search ACF groups for “Double Column Text only”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_db_column.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Db Col Copy Image Rows

Partial: partials/sections/db_col_copy_image_rows.php

Availability

Editor usage

Quick link: Search ACF groups for “Double Columns Copy Image ”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_db_col_copy_image_rows.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Db Col Image Copy Rows

Partial: partials/sections/db_col_image_copy_rows.php

Repeating rows of two columns: one image column and one copy column with optional pre-head image, headings, copy, quote, and CTAs. Supports flipping on desktop and full-width image.

Image guidance

• sizes: column_image: '(max-width: 767px) 100vw, (min-width: 768px) 50vw'; pre_head image smaller '(max-width: 767px) 50vw, 25vw'
• widths: column_image: 372, 608, 744, 1216; pre_head: 160, 320, 480
• LCP: If used near top, consider eager for the first row image.

Availability

Editor usage

Quick link: Search ACF groups for “Double Columns Image Copy”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_db_col_image_copy_rows.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Diagonal Copy Image

Partial: partials/sections/diagonal_copy_image.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Diagonal Copy Image”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_diagonal_copy_image.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Faqs

Partial: partials/sections/faqs.php

Frequently-asked questions grouped by sub-sections, two-column layout on desktop with accordion behavior.

Image guidance

• LCP: Not LCP-critical.

Availability

Editor usage

Quick link: Search ACF groups for “Faqs”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_faqs.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Google Reviews Widget

Partial: partials/sections/google_reviews_widget.php

Availability

Editor usage

Quick link: Search ACF groups for “Google Reviews Widget”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_google_reviews_widget.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Hero Carousel

Partial: partials/sections/hero_carousel.php

Full-bleed hero carousel with desktop/mobile background images, pre-head, heading, copy, and CTA link per slide. Supports content alignment per breakpoint.

Image guidance

• sizes: desktop: 100vw; mobile: 100vw
• widths: desktop: 1366, 1600, 1920, 2560; mobile: 360, 480, 640, 768, 1024
• LCP: If carousel is the first section, prefer eager for the first slide image and high fetchpriority; keep others lazy.

Availability

Editor usage

Quick link: Search ACF groups for “Hero Carousel”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_hero_carousel.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Hero Video

Partial: partials/sections/hero_video.php

Full-width hero with desktop and mobile video sources.

Image guidance

• LCP: Not for LCP; keep video lazy if possible, ensure poster where supported.

Availability

Editor usage

Quick link: Search ACF groups for “Hero Video ”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_hero_video.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Highlights Banner

Partial: partials/sections/highlights_banner.php

Availability

Editor usage

Quick link: Search ACF groups for “Highlights Columns”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_highlights_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Instagram Feed Widget

Partial: partials/sections/instagram_feed_widget.php

Availability

Editor usage

Quick link: Search ACF groups for “Instagram Feed Widget”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_instagram_feed_widget.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Instagram Feed Widget Public

Partial: partials/sections/instagram_feed_widget_public.php

Availability

Editor usage

Quick link: Search ACF groups for “Instagram Feed Widget Public”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_instagram_feed_widget_public.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Location Carousel

Partial: partials/sections/location_carousel.php

Full-bleed image carousel with optional captions, supporting full-width or contained layout.

Image guidance

• sizes: slide_image '(max-width: 767px) 100vw, 100vw'
• widths: 768, 1024, 1366, 1600, 1920
• LCP: Not for LCP; allow lazy, but consider eager for first if above-the-fold.

Availability

Editor usage

Quick link: Search ACF groups for “Location Carousel”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_location_carousel.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Map Block

Partial: partials/sections/map_block.php

Displays a Google Map for a given address with custom marker icon and optional section heading/subtitle.

Image guidance

• LCP: Not image-based; script loads async/defer.

Availability

Editor usage

Quick link: Search ACF groups for “Map Block”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_map_block.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Masonry

Partial: partials/sections/masonry.php

Simple masonry-like image stream from a gallery field.

Image guidance

• sizes: '(max-width: 767px) 50vw, (min-width: 768px) 33vw' typical
• widths: 372, 608, 744, 1216
• LCP: Not LCP.

Availability

Editor usage

Quick link: Search ACF groups for “Masonry”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_masonry.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Masthead Old Gallery

Partial: partials/sections/masthead-old-gallery.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Masthead Old Gallery”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_masthead-old-gallery.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Masthead

Partial: partials/sections/masthead.php

Full-bleed hero with desktop/mobile background image or video, pre-head, heading, lead copy and CTA buttons. Mobile image can differ from desktop.

Image guidance

• sizes: 100vw (desktop & mobile)
• widths: desktop: 1366, 1600, 1920, 2560; mobile: 360, 480, 640, 768, 1024
• LCP: Use loading=eager, decoding=sync, fetchpriority=high on hero images.

Availability

Editor usage

Quick link: Search ACF groups for “Master Hero Banner”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_masthead.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Material Loop

Partial: partials/sections/material_loop.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Material Loop”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_material_loop.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Meet Investor Team

Partial: partials/sections/meet_investor_team.php

Availability

Editor usage

Quick link: Search ACF groups for “Meet Team”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_meet_investor_team.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Meet Team Vertical

Partial: partials/sections/meet_team_vertical.php

Availability

Editor usage

Quick link: Search ACF groups for “Meet Team Vertical”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_meet_team_vertical.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Member Grid

Partial: partials/sections/member_grid.php

Availability

Editor usage

Quick link: Search ACF groups for “Member Grid”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_member_grid.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

One Column Image

Partial: partials/sections/one_column_image.php

Availability

Editor usage

Quick link: Search ACF groups for “One Column Image”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_one_column_image.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Our Partners Slider

Partial: partials/sections/our_partners_slider.php

Availability

Editor usage

Quick link: Search ACF groups for “Our Partners Slider”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_our_partners_slider.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Our Values

Partial: partials/sections/our_values.php

Availability

Editor usage

Quick link: Search ACF groups for “Icon Columns”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_our_values.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Partners

Partial: partials/sections/partners.php

Availability

Editor usage

Quick link: Search ACF groups for “Partners”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_partners.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Post Carousel

Partial: partials/sections/post_carousel.php

Carousel of content cards with image, pre-head, heading, copy and optional CTA per item; heading for the section is optional.

Image guidance

• sizes: '(max-width: 767px) 100vw, (min-width: 768px) 420px'
• widths: 360, 420, 608, 744, 960
• LCP: Not LCP; allow lazy.

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Post Carousel”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_post_carousel.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Post Loop

Partial: partials/sections/post_loop.php

Availability

Editor usage

Quick link: Search ACF groups for “Post Loop”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_post_loop.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Post Loop Copy

Partial: partials/sections/post_loop copy.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Post Loop Copy”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_post_loop copy.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Post Loop Featured Banner

Partial: partials/sections/post_loop_featured_banner.php

Availability

Editor usage

Quick link: Search ACF groups for “Featured Post Banner”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_post_loop_featured_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Post Row

Partial: partials/sections/post_row.php

Availability

Editor usage

Quick link: Search ACF groups for “Product Row Banner”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_post_row.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Product Loop

Partial: partials/sections/product_loop.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Product Loop”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_product_loop.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Row N Columns

Partial: partials/sections/row_n_columns.php

Availability

Editor usage

Quick link: Search ACF groups for “Row with Columns”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_row_n_columns.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Search Bar

Partial: partials/sections/search_bar.php

Availability

Editor usage

Quick link: Search ACF groups for “Search Bar”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_search_bar.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Shortcode

Partial: partials/sections/shortcode.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Shortcode”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_shortcode.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Subscribe Banner

Partial: partials/sections/subscribe_banner.php

Availability

Editor usage

Quick link: Search ACF groups for “Subscribe Banner”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_subscribe_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Supply Chain

Partial: partials/sections/supply_chain.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Supply Chain”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_supply_chain.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Cta Banner

Partial: partials/sections/text_cta_banner.php

Full-width banner with background image and/or color, heading, lead copy, and up to two CTAs.

Image guidance

• sizes: background image 100vw (CSS background)
• LCP: If used near top, consider preloading the background image elsewhere.

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Text Cta Banner”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_cta_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Grid

Partial: partials/sections/text_grid.php

Grid of text boxes with heading, rich copy, and optional CTA link per box. Optional section heading.

Image guidance

• LCP: Not LCP-critical.

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Text Grid”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_grid.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Grid Image

Partial: partials/sections/text_grid_image.php

Text grid similar to Text Grid, with an accompanying side background image.

Image guidance

• sizes: side background image 100vw (CSS background)
• LCP: Not LCP-critical.

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Text Grid Image”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_grid_image.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Image

Partial: partials/sections/text_image.php

Split section with text content (heading and CTA) and a background image container. Simple hero-like banner.

Image guidance

• sizes: background image 100vw (handled via CSS background)
• LCP: If used as top banner, ensure background image is preloaded via inline preload elsewhere; not handled here.

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Text Image”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_image.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Quote Banner

Partial: partials/sections/text_quote_banner.php

Banner-style testimonial with quote, quotee image (desktop/mobile) and person details. Supports alignment, color theme and margins.

Image guidance

• sizes: quotee images '(max-width: 767px) 50vw, 25vw'
• widths: 160, 240, 320, 480
• LCP: Not LCP-critical.

Availability

Editor usage

Quick link: Search ACF groups for “Text Quote Banner”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_quote_banner.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Text Quote Slider

Partial: partials/sections/text_quote_slider.php

Carousel of quotes with optional quotee image (desktop/mobile), name, position and company. Supports alignment, color theme, and image max width.

Image guidance

• sizes: quotee_image '(max-width: 767px) 50vw, 25vw'
• widths: 160, 240, 320, 480
• LCP: Not LCP-critical; allow lazy.

Availability

Editor usage

Quick link: Search ACF groups for “Text Quote Slider”

Fields in this layout

Key fields

Dev notes

• SCSS lives in assets/css/src/sections/_text_quote_slider.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Timeline

Partial: partials/sections/timeline.php

Availability

No post type restrictions found in ACF location rules (may be globally available or in a different field group).

Editor usage

Quick link: Search ACF groups for “Timeline”

Use this section via the Flexible Content “Sections” > matching layout. Provide content and media as prompted by the field group.

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_timeline.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Tours Cruises Grid

Partial: partials/sections/tours_cruises_grid.php

Availability

Editor usage

Quick link: Search ACF groups for “Tours & Cruises Grid”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_tours_cruises_grid.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Two Column Images

Partial: partials/sections/two_column_images.php

Availability

Editor usage

Quick link: Search ACF groups for “Two Column Images”

Fields in this layout

Key fields

No @field tags found in the partial’s docblock.

Dev notes

• SCSS lives in assets/css/src/sections/_two_column_images.scss (if applicable). Import it in assets/css/src/main.scss.
• Keep class names semantic and rely on CSS variables from _variables.scss where possible.
• For JS, prefer data-attributes and initialize in assets/js/src/main.js.

Workflow: add or update a Section

1. Create/extend the ACF Flexible layout under the “Sections” field group (see acf-json/).
2. Add a PHP partial in partials/sections/ with a docblock, e.g.:

   /**
    * Hero Section
    * @usage Add heading, lead, background image/video; optional CTA list
    * @field heading (text)
    * @field lead_copy (wysiwyg)
    * @field background_image (image)
    * @field ctas (repeater)
    * @dev SCSS: assets/css/src/sections/_hero.scss; import in main.scss
    */

3. Style in assets/css/src/sections/_your-section.scss, import into main.scss, then run grunt.
4. Optional JS: add minimal init in assets/js/src/main.js.