{{! The title and the small label show the page's name unless text is typed; breadcrumbs come from the menu (ADR 0019). On a project's page an empty description shows the project's services (ADR 0168). The look — background, height, alignment, title size, breadcrumbs — is the site's shared page title look (titleLook, ADR 0065); the picture covers the whole section. }}
<div {{@attrs}}><div class="sv-titleband sv-titleband--bg-{{titleLook.background}} sv-titleband--height-{{titleLook.height}} sv-titleband--align-{{titleLook.align}} sv-titleband--size-{{titleLook.titleSize}} sv-titleband--tone-{{titleLook.tone}}{{#titlePlaced}} sv-titleband--valign-{{titleLook.valign}}{{/titlePlaced}}{{#titleSpaced}} sv-titleband--spaced{{/titleSpaced}}"{{#titleLook.bandStyle}} style="{{titleLook.bandStyle}}"{{/titleLook.bandStyle}}>{{#titleLook.image.url}}<div class="sv-titleband__bg sv-titleband__bg--{{titleLook.shade}}" aria-hidden="true"><img class="sv-titleband__img wp-image-{{titleLook.image.id}}" src="{{titleLook.image.url}}" alt=""{{#titleLook.image.width}} width="{{titleLook.image.width}}" height="{{titleLook.image.height}}"{{/titleLook.image.width}} sizes="100vw"></div>{{/titleLook.image.url}}{{#titleLook.breadcrumbs}}{{#hasBreadcrumbs}}<nav class="sv-page-title__crumbs" aria-label="{{breadcrumbLabel}}"><ol>{{#breadcrumbs}}<li>{{#url}}<a href="{{url}}">{{label}}</a>{{/url}}{{^url}}<span aria-current="page">{{label}}</span>{{/url}}</li>{{/breadcrumbs}}</ol></nav>{{/hasBreadcrumbs}}{{/titleLook.breadcrumbs}}{{#showLabel}}<p class="sv-page-title__label"{{@edit label}}>{{#label}}{{label}}{{/label}}{{^label}}{{pageName}}{{/label}}</p>{{/showLabel}}<{{level}} class="sv-page-title__title"{{@edit title}}>{{#title}}{{title}}{{/title}}{{^title}}{{pageName}}{{/title}}</{{level}}>{{#description}}<p class="sv-page-title__description"{{@edit description}}>{{description}}</p>{{/description}}{{^description}}{{#projectServices}}<p class="sv-page-title__description">{{projectServices}}</p>{{/projectServices}}{{/description}}</div></div>