{{! Articles (ADR 0061): WordPress articles, filled in by the site ("source": "query" props: items, filters, pages), each a Service card (service-card/style.css, the same seven arrangements) with a line of details (category, date, reading time) — or, Category on top (ADR 0167), the category over the title and the author, date and reading time at the foot — and an optional link text; the whole card opens the article. "All, with pages": category buttons on top and Newer/Older links below. The carousel is motion's. Nothing is shown publicly when there are no articles; the editor shows a note. }}
<div {{@attrs}}>{{^hidden}}{{#hasFilters}}<nav class="sv-posts__filters{{#filterLook}} sv-posts__filters--{{filterLook}}{{/filterLook}}" aria-label="{{filtersLabel}}">{{#filters}}<a class="sv-posts__filter" href="{{url}}"{{#current}} aria-current="page"{{/current}}>{{name}}</a>{{/filters}}</nav>{{/hasFilters}}{{#hasItems}}{{#overflow}}<div class="sv-carousel sv-carousel--nav-{{carouselNav}}" data-sv-carousel><div class="sv-carousel__track">{{/overflow}}{{^overflow}}<div class="sv-posts__grid">{{/overflow}}{{#items}}<article class="sv-service-card sv-service-card--look-{{look}}{{#shape}} sv-service-card--shape-{{shape}}{{/shape}}{{#titleSize}} sv-service-card--title-size-{{titleSize}}{{/titleSize}} sv-posts__item{{#arrowTitle}} sv-posts__item--arrow{{/arrowTitle}}{{^turns}}{{#style}} sv-card-{{style}}{{#styleCustom}} sv-card-custom{{/styleCustom}}{{/style}}{{/turns}}{{#turns}} sv-card-turns{{/turns}} sv-round-{{corners}}{{#hover}} sv-cardhover-{{hover}}{{/hover}}"{{^turns}}{{#styleCustom}} style="--sv-custom-card:{{styleCustom}}"{{/styleCustom}}{{/turns}}><div class="sv-service-card__media">{{#image.url}}<img class="sv-service-card__photo" src="{{image.url}}" alt="{{image.alt}}"{{#image.width}} width="{{image.width}}" height="{{image.height}}"{{/image.width}} loading="lazy" decoding="async">{{/image.url}}{{^image.url}}<span class="sv-posts__nophoto" aria-hidden="true"></span>{{/image.url}}</div><div class="sv-service-card__body"><p class="sv-posts__meta">{{#showCategory}}{{#category.name}}<span class="sv-posts__category">{{category.name}}</span>{{/category.name}}{{/showCategory}}{{^splitDetails}}{{#showDate}}<time class="sv-posts__date" datetime="{{dateTime}}">{{date}}</time>{{/showDate}}{{#showReadingTime}}<span class="sv-posts__time">{{readingTime}}</span>{{/showReadingTime}}{{/splitDetails}}</p><h3 class="sv-service-card__title">{{title}}</h3>{{#showExcerpt}}{{#excerpt}}<p class="sv-service-card__text">{{excerpt}}</p>{{/excerpt}}{{/showExcerpt}}{{^splitDetails}}{{#showAuthor}}{{#author}}<p class="sv-posts__author">{{author}}</p>{{/author}}{{/showAuthor}}{{/splitDetails}}{{#splitDetails}}<p class="sv-posts__meta sv-posts__meta--foot">{{#showAuthor}}{{#author}}<span class="sv-posts__by">{{author}}</span>{{/author}}{{/showAuthor}}{{#showDate}}<time class="sv-posts__date" datetime="{{dateTime}}">{{date}}</time>{{/showDate}}{{#showReadingTime}}<span class="sv-posts__time">{{readingTime}}</span>{{/showReadingTime}}</p>{{/splitDetails}}{{#moreLabel}}<span class="sv-posts__more" aria-hidden="true">{{moreLabel}}</span>{{/moreLabel}}</div>{{#tiles}}<span class="sv-image__arrow sv-service-card__arrow" aria-hidden="true"></span>{{/tiles}}<a class="sv-service-card__link" href="{{url}}"><span class="sv-service-card__sr">{{title}}</span></a></article>{{/items}}{{^overflow}}</div>{{/overflow}}{{#overflow}}</div><button type="button" class="sv-carousel__arrow sv-carousel__arrow--prev" aria-label="{{prevLabel}}"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="m15 6-6 6 6 6"/></svg></button><button type="button" class="sv-carousel__arrow sv-carousel__arrow--next" aria-label="{{nextLabel}}"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="m9 6 6 6-6 6"/></svg></button></div>{{/overflow}}{{#pages.show}}<nav class="sv-posts__pages" aria-label="{{pages.label}}">{{#pages.newer}}<a class="sv-posts__page sv-posts__page--newer" href="{{pages.newer}}">{{pages.newerLabel}}</a>{{/pages.newer}}<span class="sv-posts__page-count">{{pages.count}}</span>{{#pages.older}}<a class="sv-posts__page sv-posts__page--older" href="{{pages.older}}">{{pages.olderLabel}}</a>{{/pages.older}}</nav>{{/pages.show}}{{/hasItems}}{{^hasItems}}{{#ready}}{{@placeholder articles}}{{/ready}}{{^ready}}{{@placeholder loading}}{{/ready}}{{/hasItems}}{{/hidden}}</div>