Suds System StudioRelease and design control

Suds Build System 2.0

Design-system reference — sections, variants, tokens
62 sections 26 categories 13 brand tokens 112 structural knobs prefix {prefix}
Page
Signal

Section library

Every section is token-driven (re-skins per archetype) and self-gating (renders real content, a claim-safe fallback, or hides — never an empty shell, never an invented fact). Pick by page, signal, and use case below.

No sections match those filters.

Story / about 3 variants

About / Story

story · prose
stable

About intro as plain prose. Pick when there is editor copy or you want a simple, text-led lead with no image.

Pagesabouthome
Renders always (claim-safe fallback)
Optionaleditor content

Always renders; claim-safe generated intro from name/city/areas when no copy.

template-parts/sections/section-story.php

About / Story — split

story_split · split
stable

About intro copy beside a photo. Pick for an image-led, warmer lead when a storefront/interior photo exists.

Pagesabouthome
Renders always (claim-safe fallback)
Optionalimage arg · featured image · why image · location gallery

Shows a claim-safe striped photo placeholder when no image; always renders.

template-parts/sections/section-story-split.php

About / Story — values

story_values · values
stable

Generic, claim-safe value cards (clean / easy / helpful). Pick when there is no copy or photo and you want a structured, confident block (commercial / premium).

Pagesabouthome
Renders always (claim-safe fallback)

Generic-safe; invents no facts. Always renders.

template-parts/sections/section-story-values.php

Service area 3 variants

Service areas

areas · chips
stable

Compact chip row of service-area towns. Pick for a light area touch on home/about/contact.

Pageshomeaboutcontact
Signalservice_area_content
Needsoption:suds_service_areas
Renders hides if no data

Hides if suds_service_areas is empty.

template-parts/sections/section-areas.php

Service areas — columns

areas_columns · columns
stable

Multi-column town list. Pick when the area list is long and you want a denser, scannable block.

Pageshomeaboutcontact
Signalservice_area_content
Needsoption:suds_service_areas
Renders hides if no data

Hides if no areas.

template-parts/sections/section-areas-columns.php

Service areas — map

areas_map · map
stable

Town list beside the map embed. Pick on location-focused pages where a map embed exists.

Pageshomeaboutcontact
Signalservice_area_content
Needsoption:suds_service_areas
Renders hides if no data

List-only without a map; hides if no areas.

template-parts/sections/section-areas-map.php

Pricing 3 variants

Pricing & payment

payment · payment_callout
stable

Pricing fallback callout ("call for pricing"). Pick on Pricing when no service has public pricing rows.

Pagespricing
Renders always (claim-safe fallback)
Optionalsuds_copy_payment_*

Renders only when pricing is visible globally and no service has public pricing rows.

template-parts/sections/section-payment.php

Pricing — table

pricing_table · table
stable

Per-service rate table. Pick on Pricing when services carry public pricing rows.

Pagespricing
Needscpt:service
Renders hides if no data

Hides unless a service has client-confirmed pricing or market-default rows marked for review.

template-parts/common/common-pricing.php

Pricing — plan cards

pricing_cards · cards
stable

Marketing plan cards per priced service (lowest public price + up to 3 benefits). Pick for a sales-oriented pricing presentation.

Pagespricingservices
Needscpt:service
Renders hides if no data

Hides when no service has client-confirmed pricing or market-default rows marked for review.

template-parts/sections/section-pricing-cards.php

Amenities 3 variants

Amenities

amenities · grid
stable

Amenities grid from the primary location. Pick to showcase confirmed amenities plainly.

Pagesabouthomelocation
Needsprimary_loc:location_amenities
Renders hides if no data

Hides if location_amenities is empty.

template-parts/sections/section-amenities.php

Amenities — chips

amenities_chips · chips
stable

Compact chip row of amenities. Pick for a light amenities touch (express / value).

Pagesabouthomelocation
Needsprimary_loc:location_amenities
Renders hides if no data

Hides if none.

template-parts/sections/section-amenities-chips.php

Amenities — feature

amenities_feature · feature
stable

A few large amenity feature cards. Pick to spotlight 2–4 standout amenities (warm / premium / eco).

Pagesabouthomelocation
Needsprimary_loc:location_amenities
Renders hides if no data

Hides if none.

template-parts/sections/section-amenities-feature.php

Hours 2 variants

Hours

hours · card
stable

Per-day hours card for a SINGLE-LOCATION shop. Pick on contact/about/location when per-day hours exist.

Pagescontactaboutlocation
Renders hides if no data

Renders the primary location per-day hours; falls back to the global hours summary, else hides. Self-gates OFF on MULTI-LOCATION builds (>1 published location) — there, hours are per-branch (locations_grid/locations_map <details> + Location pages), so a lone generic hours block would misrepresent branches with different hours. hours_summary_strip (a global operator one-liner) is unaffected.

template-parts/sections/section-hours.php

Hours — summary strip

hours_summary_strip · summary_strip
stable

One-line hours strip. Pick for a compact hours mention when only a summary line is set.

Pagescontactabouthomelocation
Needsoption:suds_hours_summary
Renders hides if no data

Hides if suds_hours_summary is empty.

template-parts/sections/section-hours-summary-strip.php

Map / directions 2 variants

Map

map · full
stable

Full-width Google map embed. Pick on contact/location when an embed is set.

Pagescontactaboutlocation
Needsprimary_loc:location_map_embed
Renders hides if no data

Hides if no primary-location map embed.

template-parts/sections/section-map.php

Map — split (map + NAP/hours)

map_split · split
stable

Map beside the location name/address/phone + hours. Pick when you want the map plus confirmed contact details.

Pagescontactaboutlocation
Needsprimary_loc:location_map_embed
Renders hides if no data

Hides if no map embed; all data confirmed.

template-parts/sections/section-map-split.php

FAQ 2 variants

FAQ

faq · accordion
stable

FAQ accordion from the faq CPT. Pick for collapsible Q&A.

Pagesfaqcontactabouthome
Needscpt:faq
Renders hides if no data

Hides if no faq posts.

template-parts/common/common-faq.php

FAQ — two columns

faq_twocol · twocol
stable

Open two-column Q&A. Pick when you want all answers visible (dense / value / commercial).

Pagesfaqcontactabouthome
Needscpt:faq
Renders hides if no data

Hides if no faq posts.

template-parts/sections/section-faq-twocol.php

Commercial / B2B 2 variants

Commercial / B2B

commercial · card
stable

B2B card. Pick to surface commercial accounts when a commercial service exists.

Pageshomeservicescommercial
Signalcommercial_accounts
Renders hides if no data
Optionalsuds_copy_commercial_*

Signal-gated: only renders if a commercial service exists.

template-parts/sections/section-commercial.php

Commercial / B2B — split

commercial_split · split
stable

Commercial benefits + photo from the commercial service. Pick for a richer B2B showcase.

Pageshomeservicescommercial
Signalcommercial_accounts
Renders hides if no data
Optionalservice image

Commercial-service gated.

template-parts/sections/section-commercial-split.php

Call to action 3 variants

CTA — band

cta_band · band
stable

Full-width final CTA band. The default page closer; always safe.

Pagesservicespricingaboutcontactlocation
Renders always (claim-safe fallback)
Optionalheading arg · sub arg

Always renders; label/sub are signal-aware (no pickup claim on self-service).

template-parts/common/common-cta.php

CTA — split

cta_split · split
stable

Two-column CTA: copy + an action card (CTA link + call/text). Pick when you want a contact-action card alongside the CTA.

Pageshomeservicespricingaboutcontact
Renders always (claim-safe fallback)
Optionalheading arg · sub arg

Real link, no fake form; signal-aware copy. tone targets the OUTER band; the panel itself takes the cta_bg knob (ink|primary|tint|surface) — on tone=dark the default ink panel lifts to the shared card mix so it never sinks ink-on-ink.

template-parts/sections/section-cta-split.php

CTA — boxed

cta_boxed · boxed
stable

Centered boxed CTA card. Pick for a softer, contained closer (warm / premium / eco).

Pageshomeservicespricingaboutcontactfaq
Renders always (claim-safe fallback)
Optionalheading arg · sub arg

Always renders; signal-aware copy.

template-parts/sections/section-cta-boxed.php

Page hero 1 variant

Page header

page_header · header
stable

The sub-page opener: per-PAGE eyebrow / title override / lead + a background style (none · surface · ink · gradient · image-with-scrim). Fields live on each page/post edit screen.

Pagesaboutservicespricingcontactfaq
Renders always (claim-safe fallback)
Optionalsuds_header_* per-page fields · eyebrow arg · subtitle arg

Always renders; blank fields fall back to the template default, the page title, and the sentence-bounded auto subtitle. Image bg falls back to the featured image, then degrades to ink (never an empty frame). Agent CLI: `wp suds field-set page_header <field> <v> --page=<type>`.

template-parts/common/common-header.php

Services 6 variants

Services — grid

services_grid · grid
stable

Services card grid. The default services presentation; image-friendly.

Pageshomeservices
Renders always (claim-safe fallback)
Optionalservice posts

Generic claim-safe fallback cards; always renders.

template-parts/sections/section-services-grid.php

Services — list

services_list · list
stable

Alternating-row services; a service's featured image renders beside its copy when set. Pick for dense/structured services (value / commercial).

Pagesserviceshome
Renders always (claim-safe fallback)
Optionalservice posts

Generic claim-safe fallback; always renders. Rows without an image stay text-only (no empty frames).

template-parts/sections/section-services-list.php

Services — featured

services_featured · featured
stable

Flagship-led services: the FIRST service (menu_order) renders as a large feature (photo or icon panel + excerpt + CTA), the rest as compact rows. Pick when one service (wash & fold, pickup) leads the business.

Pageshomeservices
Renders always (claim-safe fallback)

The operator's service ORDER is the emphasis — reorder Services to change the flagship. Same claim-safe generic fallback as the other services variants.

template-parts/sections/section-services-featured.php

Services — photo grid

services_photo · photo
stable

Services card grid where each card LEADS WITH THE SERVICE FEATURED IMAGE instead of an icon. Pick for image-led services on photo-forward skins (warm / premium / eco).

Pageshomeservices
Renders always (claim-safe fallback)
Optionalservice posts · service featured images

Generic claim-safe fallback cards; always renders. A service with no featured image (and every fallback card) shows the claim-safe striped "add a photo" placeholder — NEVER a fabricated photo — so it looks complete during a build and swaps to real photos as service featured images are set.

template-parts/sections/section-services-photo.php

Services — icon row

services_iconrow · iconrow
stable

Compact icon + label strip of services. Pick for a light services overview (express).

Pageshomeservicesabout
Renders always (claim-safe fallback)
Optionalservice posts

Generic fallback; always renders. `display=cards` upgrades the bare icons to tappable cards (gradient icon tile + hover lift) when the band feels too plain.

template-parts/sections/section-services-iconrow.php

Services — archive grid

services_archive · archive
stable

The /services/ CPT-archive grid (every published service as a card), riding the MAIN archive query. The default grid slot on the services archive — compose a services_* variant to swap it.

Pagesservices
Needscpt:service
Renders hides if no data

Archive-context section: it renders the main query, so outside /services/ it shows the empty state. Promoted from the hardcoded archive part (byte-identical).

template-parts/services/services-archive.php

Reviews 4 variants

Reviews — embed

reviews_embed · embed
stable

Admin-entered third-party reviews widget. Pick only when a reviews embed is provided.

Pageshomeaboutcontact
Needshome:suds_reviews_embed
Renders hides if no data

Requires suds_reviews_embed; never shows sample quotes. Hides if none.

template-parts/sections/section-reviews-embed.php

Reviews — cards

reviews_cards · cards
stable

Real reviews as cards. Pick when the suds_reviews repeater has entries.

Pageshomeabout
Needshome:suds_reviews
Renders hides if no data
Optionalrating per review

REAL reviews only; hides if none; stars only when a rating is set.

template-parts/sections/section-reviews-cards.php

Reviews — quote wall

reviews_quotewall · quotewall
stable

Dense masonry wall of real reviews. Pick when there are many reviews and you want social-proof density.

Pageshomeabout
Needshome:suds_reviews
Renders hides if no data

REAL reviews only; hides if none.

template-parts/sections/section-reviews-quotewall.php

Reviews — panel (home)

reviews_panel · panel
stable

Home reviews rich panel. The home `quotes` slot.

Pageshome
Signalhas_reviews
Renders hides if no data
Optionalreviews embed · complete Google rating trio

Home-only; admin embed → real suds_reviews, with an optional verified Google badge. Self-gates when no real review source exists.

template-parts/home/home-quotes.php

How it works / steps 3 variants

Steps — numbered

steps_numbered · numbered
stable

Numbered "how it works". The default how-it-works; balanced.

Pageshomeservicesabout
Renders always (claim-safe fallback)
Optionalsuds_steps · eyebrow/heading/sub args

Signal-aware claim-safe default flow (self-service vs pickup); always renders.

template-parts/sections/section-steps-numbered.php

Steps — icon row

steps_iconrow · iconrow
stable

Compact horizontal numbered steps. Pick for a light, scannable flow (express / value).

Pageshomeservicesabout
Renders always (claim-safe fallback)
Optionalsuds_steps

Signal-aware default flow; always renders.

template-parts/sections/section-steps-iconrow.php

Steps — vertical

steps_vertical · vertical
stable

Vertical numbered timeline. Pick for a structured, sequential flow (commercial / premium).

Pageshomeservicesabout
Renders always (claim-safe fallback)
Optionalsuds_steps

Signal-aware default flow; always renders.

template-parts/sections/section-steps-vertical.php

Pickup & delivery 3 variants

Pickup & delivery — form

pickup_form · form
stable

ZIP lead-in + real scheduling link. Pick as an app-style lead capture when pickup is offered (express).

Pageshomeservices
Signalpickup_delivery
Renders hides if no data

Signal-gated: pickup_delivery. Never on self-service-only.

template-parts/sections/section-pickup-form.php

Pickup & delivery — steps

pickup_steps · steps
stable

Pickup flow steps + scheduling CTA. Pick to explain the pickup process.

Pageshomeservices
Signalpickup_delivery
Renders hides if no data
Optionalsuds_steps

Signal-gated: pickup_delivery.

template-parts/sections/section-pickup-steps.php

Pickup & delivery — promo

pickup_promo · promo
stable

Punchy pickup promo card + CTA. Pick as a compact pickup highlight.

Pageshomeservicespricing
Signalpickup_delivery
Renders hides if no data
Optionalsuds_copy_pickup_*

Signal-gated: pickup_delivery.

template-parts/sections/section-pickup-promo.php

newsletter 1 variant

Newsletter — signup band

newsletter_signup · band
stable

Email-capture band ahead of the footer. Pick when the client has a real list destination (WPForms form or an external signup URL).

Pageshomeaboutservicespricingfaqcontact
Renders hides if no data
Optionalsuds_copy_newsletter_*

Self-gates: renders NOTHING without a WPForms id (plugin active) or external link — never a dead form. Claim-safe default copy promises no cadence or offers.

template-parts/sections/section-newsletter-signup.php

contact 1 variant

Contact — form + info

contact_form · form
stable

Contact block: an inquiry FORM beside a phone/email/address/directions card. Leads the contact page; also fits about/location. The bundled "Contact Us" WPForms form auto-imports so a fresh build works out of the box.

Pagescontactaboutlocation
Renders always (claim-safe fallback)
Optionalsuds_copy_contact_* · suds_contact_form_id · suds_contact_link

Form column self-gates (WPForms id → external form link → nothing — never a dead form); the NAP card keeps the section useful, so it always renders. Scheduling stays a separate link CTA (suds_cta_url); this captures general inquiries, invents no contact facts.

template-parts/sections/section-contact-form.php

team 1 variant

Team — spotlight

team_spotlight · spotlight
stable

Owner/attendant spotlight — a person-led trust surface ('meet our guides' shape). Pick on Home/About when the client supplies real people.

Pageshomeabout
Renders hides if no data
Optionalsuds_copy_team_*

Self-gates on the suds_team_people repeater (empty → renders nothing). Auto-layout by count: 1 person = feature split, 2–3 = card grid. No photo → initials monogram, NEVER a stock face; role is free text (no invented credentials).

template-parts/sections/section-team-spotlight.php

Locations 4 variants

Locations — grid

locations_grid · grid
stable

One card per published Location (name, address, phone, directions, page link; primary badged). Pick on Contact/About/Location pages for MULTI-location clients.

Pagescontactaboutlocation
Signalmulti_location
Needscpt:location
Renders hides if no data
Optionalsuds_copy_locations_*

Signal-gated (multi_location) AND self-gates below 2 published locations — a single-location site never renders it. Real Location posts only; per-branch hours render behind a native <details> disclosure when confirmed rows exist.

template-parts/sections/section-locations-grid.php

Locations — photo grid

locations_photo · photo
stable

Same as locations_grid but each branch card LEADS WITH THE LOCATION FEATURED IMAGE. Pick for image-led multi-location on photo-forward skins.

Pagescontactaboutlocation
Signalmulti_location
Needscpt:location
Renders hides if no data
Optionalsuds_copy_locations_* · location featured images

Same gating as locations_grid (multi_location + 2+ published locations). A location with no featured image shows the claim-safe striped "add a photo" placeholder — NEVER a fabricated photo — swapping to the real photo when set.

template-parts/sections/section-locations-photo.php

Locations — map

locations_map · map
stable

Compact branch list beside the primary map embed — the map-led locations variant. Pick on Contact/About/Location for MULTI-location clients on map-forward skins.

Pagescontactaboutlocation
Signalmulti_location
Needscpt:location
Renders hides if no data
Optionalsuds_copy_locations_*

Same gating as locations_grid (multi_location + 2+ published locations). Renders the list WITHOUT the map column when no embed exists (never hides a composed locations slot). Per-branch hours render behind a native <details> disclosure when confirmed rows exist.

template-parts/sections/section-locations-map.php

Locations — archive grid

locations_archive · archive
stable

The /locations/ CPT-archive branch grid, riding the MAIN archive query. The default grid slot on the locations archive — compose locations_grid/photo/map to swap it (multi-location clients).

Pageslocations
Needscpt:location
Renders hides if no data

Archive-context section, NOT signal-gated: the archive always shows its branches (single-location clients keep it via the template fallback). Promoted from the hardcoded archive part (byte-identical).

template-parts/locations/locations-archive.php

Wash & fold 2 variants

Wash & fold — split

washfold_split · split
stable

Wash & fold explainer + photo. Pick to feature a wash & fold offering.

Pageshomeservices
Signalwash_fold
Renders hides if no data
Optionalservice image

Signal-gated: wash_fold.

template-parts/sections/section-washfold-split.php

Wash & fold — steps

washfold_steps · steps
stable

Wash & fold drop-off flow. Pick to explain the wash & fold process.

Pageshomeservices
Signalwash_fold
Renders hides if no data
Optionalservice_steps

Signal-gated: wash_fold; generic flow fallback.

template-parts/sections/section-washfold-steps.php

Trust / reassurance 3 variants

Trust — badges

trust_badges · badges
stable

Reassurance strip from confirmed amenities, else generic-safe badges. Pick for a light trust row; always safe.

Pageshomeaboutservicescontact
Renders always (claim-safe fallback)

Always renders; generic-safe when no amenities.

template-parts/sections/section-trust-badges.php

Trust — stats

trust_stats · stats
stable

Headline numbers from confirmed hero stats. Pick only when real stats are entered.

Pageshomeaboutcommercial
Needshome:suds_hero_stats
Renders hides if no data

CONFIRMED only — hides if no suds_hero_stats.

template-parts/sections/section-trust-stats.php

Trust — guarantee

trust_guarantee · guarantee
stable

Soft, claim-safe promise + call CTA. Pick for a reassurance block.

Pageshomeaboutservicescontact
Renders always (claim-safe fallback)
Optionalsuds_copy_guarantee_*

Soft promise only; never a fabricated warranty. Always renders.

template-parts/sections/section-trust-guarantee.php

Why us (home panel) 2 variants

Why us — panel (home)

why_panel · panel
stable

Home "why choose us" rich panel (copy + benefits + interior gallery + amenities). The home `why` slot.

Pageshome
Renders always (claim-safe fallback)
Optionalinterior gallery (2+ photos → slider)

Home-only; always renders. Interior gallery shows a slider for 2+ photos, a single photo for one, else a placeholder.

template-parts/home/home-why.php

Why us — tiles (home)

why_tiles · tiles
stable

The why-us home panel as centered intro + icon tiles + amenities, with NO media frame — pick for photo-poor clients or compact skins so the home never shows a placeholder photo box.

Pageshome
Renders always (claim-safe fallback)

Shares why_panel content (single owner); the interior gallery fields stay live for the About-page gallery sections. Keeps the .s-why class so band/texture rhythm applies. `align` knob (default center) left-aligns the head + CTA to match pages whose other section heads are left-aligned.

template-parts/home/home-why-tiles.php

Areas (home panel) 1 variant

Service area — panel (home)

areas_panel · panel
stable

Home service-area rich panel. The home `areas` slot.

Pageshome
Renders always (claim-safe fallback)

Home-only; always renders.

template-parts/home/home-areas.php

Service page (single) 2 variants

Service page — body

service_body · body
stable

The single-service main content (description, benefits, process steps, pricing) read from the CURRENT service post. Part of every service single by default.

Pagesservice
Needscpt:service
Renders hides if no data
Optionalservice_benefits · service_steps · service_pricing

Single-context section: reads the queried service post; composable per-type (suds_section_stack_service option) or per-post (suds_section_stack meta).

template-parts/services/service-body.php

Service page — related services

service_related · related
stable

Cross-links the OTHER services from a service single. Part of every service single by default; remove per-type or per-post via composition.

Pagesservice
Needscpt:service
Renders hides if no data

Single-context section: excludes the queried service from its grid.

template-parts/services/service-related.php

Location page (single) 2 variants

Location page — info card

location_info · info
stable

The single-location NAP block (address, phone, hours, map embed, amenities) read from the CURRENT location post. Part of every location single by default.

Pageslocation
Needscpt:location
Renders hides if no data
Optionallocation_hours · location_amenities · location_map_embed

Single-context section: reads the queried location post; composable per-type (suds_section_stack_location option) or per-post (suds_section_stack meta).

template-parts/locations/location-info.php

Location page — gallery

location_gallery · gallery
stable

The single-location photo gallery (location_gallery field, Fancybox lightbox) read from the CURRENT location post. Self-gates when the location has no gallery.

Pageslocation
Needscpt:location
Renders hides if no data
Optionallocation_gallery photos · column count

Single-context section: reads the queried location post.

template-parts/locations/location-gallery.php

payment 1 variant

Laundry card — balance check (home)

cardbalance_panel · cardbalance
stable

Stored-value laundry-card balance check (Laundroworks/FasCard portal link) as a compact home utility band. Pick when the client uses a card system with a customer portal.

Pageshome
Needshome:suds_cardbalance_url
Renders hides if no data
Optionalsuds_cardbalance_cta_label · suds_cardbalance_note

URL-gated on home:suds_cardbalance_url — hidden until the portal link is entered (never a dead CTA). Also surfaces a matching button in the footer hours column when the URL is set. Ported from the t2-laundry fork.

template-parts/sections/section-cardbalance-panel.php

Design tokens

Brand tokens live in style.css :root — client-editable, logo-derivable, ACF-exportable (colors & fonts). Structural knobs live in archetypes.css [data-arch] — one value per archetype skin, so names only.

color

--{prefix}-primary
#1559FF
--{prefix}-on-primary
#ffffff
--{prefix}-secondary
#0B1F3A
--{prefix}-on-secondary
#ffffff
--{prefix}-accent
#00CFE8
--{prefix}-on-accent
#04222a
--{prefix}-ink
#0B1F3A
--{prefix}-bg
#FFFFFF
--{prefix}-surface
#EEF3FF
--{prefix}-muted
#5A6B85

type

--{prefix}-font-header
"Space Grotesk", system-ui, sans-serif
--{prefix}-font-body
"IBM Plex Sans", system-ui, sans-serif
--{prefix}-font-mono
ui-monospace, "SFMono-Regular", Menlo, monospace

Structural knobs (per-archetype values)

layout

--{prefix}-container
--{prefix}-header-h
--{prefix}-logo-size
--{prefix}-logo-maxw
--{prefix}-dur
--{prefix}-ease
--{prefix}-reveal-y
--{prefix}-eyebrow-mark-w
--{prefix}-o-hero
--{prefix}-o-services
--{prefix}-o-how
--{prefix}-o-why
--{prefix}-o-areas
--{prefix}-o-quotes
--{prefix}-o-cta
--{prefix}-hero-cols
--{prefix}-hero-ph-h
--{prefix}-band-texture
--{prefix}-band-texture-size
--{prefix}-img-grade
--{prefix}-ls-head
--{prefix}-tt-head
--{prefix}-h1
--{prefix}-h2
--{prefix}-lead
--{prefix}-card-hover-t
--{prefix}-chip-fg
--{prefix}-ph-stripe-a
--{prefix}-ph-stripe-b
--{prefix}-step-num-stroke
--{prefix}-step-connector
--{prefix}-band-how
--{prefix}-band-quotes
--{prefix}-band-payment
--{prefix}-quote-style
--{prefix}-band-why
--{prefix}-band-story
--{prefix}-band-services
--{prefix}-band-areas
--{prefix}-warm-anchor
--{prefix}-tt-card-head
--{prefix}-fs-card-head
--{prefix}-ls-card-head
--{prefix}-band-newsletter
--{prefix}-edge-display
--{prefix}-edge-mask
--{prefix}-edge-size
--{prefix}-edge-h
--{prefix}-eyebrow-fg
--{prefix}-hero-scrim
--{prefix}-band-texture-opacity
--{prefix}-fx-opacity
--{prefix}-fx-tempo

color

--{prefix}-icon-box
--{prefix}-on-band-fg
--{prefix}-on-band-muted
--{prefix}-on-band-eyebrow
--{prefix}-nav-link-fs
--{prefix}-nav-link-fw
--{prefix}-card-bg
--{prefix}-card-border
--{prefix}-icon-bg
--{prefix}-icon-fg
--{prefix}-chip-bg
--{prefix}-ph-border
--{prefix}-header-border
--{prefix}-step-num-color
--{prefix}-hero-bg
--{prefix}-hero-fg
--{prefix}-hero-h1
--{prefix}-hero-lead
--{prefix}-card-hover-border
--{prefix}-chip-border
--{prefix}-nav-link-tt
--{prefix}-nav-link-ls
--{prefix}-surface-warm
--{prefix}-edge-hero-bg
--{prefix}-eyebrow-bg

space

--{prefix}-hero-gap
--{prefix}-hero-stat-gap
--{prefix}-card-pad
--{prefix}-pad-section
--{prefix}-gap
--{prefix}-hero-pad
--{prefix}-nav-link-gap
--{prefix}-svc-row-gap
--{prefix}-eyebrow-pad

type

--{prefix}-fw-btn
--{prefix}-fw-head
--{prefix}-quote-font

button

--{prefix}-btn-pad
--{prefix}-btn-pad-lg
--{prefix}-ls-btn
--{prefix}-tt-btn
--{prefix}-btn-border-w
--{prefix}-btn-hover-t
--{prefix}-btn-ghost-border
--{prefix}-btn-ghost-hover-bg
--{prefix}-btn-ghost-hover-fg

radius

--{prefix}-radius
--{prefix}-radius-lg
--{prefix}-btn-radius
--{prefix}-icon-radius
--{prefix}-chip-radius
--{prefix}-logo-radius
--{prefix}-tick-radius

shadow

--{prefix}-btn-shadow
--{prefix}-btn-shadow-hover
--{prefix}-card-shadow
--{prefix}-card-shadow-hover
--{prefix}-media-shadow
--{prefix}-logo-shadow

Reference

How the selector reads a section: filter by page type, drop any whose signal isn't present, then confirm needs (or rely on a claim-safe fallback).

Signals

commercial_accounts

Section appears only when this offering/condition is detected on the site.

has_reviews

Section appears only when this offering/condition is detected on the site.

multi_location

Section appears only when this offering/condition is detected on the site.

pickup_delivery

Section appears only when this offering/condition is detected on the site.

service_area_content

Section appears only when this offering/condition is detected on the site.

wash_fold

Section appears only when this offering/condition is detected on the site.

Dependency kinds (needs)

option:…

Theme Settings option field (sbs_setting)

home:…

Home-page content field (sbs_home_field)

primary_loc:…

Primary location CPT field (sbs_primary_location_field)

cpt:…

At least one published post of this CPT