Services CTA Mostly

Services CTA Mostly

A dark two-column CTA section featuring a heading/description on the left and a list of linked case studies on the right.

Key Feature: Hover Dim Effect

When hovering over any link (including "See all work" or any case study item), all other links fade to 40% opacity while the hovered item stays at full opacity.

Structure

section.services-cta-mostly
└── div.services-cta-mostly__container
    ├── div.services-cta-mostly__left
    │   ├── h2.services-cta-mostly__heading
    │   ├── p.services-cta-mostly__description
    │   └── a.services-cta-mostly__link (hoverable)
    └── div.services-cta-mostly__right
        ├── span.services-cta-mostly__eyebrow
        └── ul.services-cta-mostly__list
            └── li.services-cta-mostly__item × 3
                └── a.services-cta-mostly__item-link (hoverable)

Customization

• Add/remove list items as needed
• All links with class .services-cta-mostly__hoverable participate in the hover effect
• Uses CSS :has() selector - works in all modern browsers

Responsive

Columns stack on screens below 900px.