/*
Theme Name: OLB 2026
Theme URI: https://www.ownlivingbenefits.com/
Author: Own Living Benefits
Description: Block theme for Own Living Benefits. Quote-focused layouts for business, home and auto insurance, built on WordPress block templates with no page builder dependency.
Version: 2.1.2
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: olb
Tags: block-theme, business, insurance, one-column, custom-colors, custom-logo, editor-style, full-site-editing, wide-blocks, accessibility-ready
*/

/*
 * Design tokens live in theme.json. This file is the component layer.
 *
 * House rules this stylesheet is built to:
 *   - Elevation is hairline borders. Shadows are only for things that float
 *     above the page (the hero panel, an open FAQ, the stuck header).
 *   - No decorative gradients. The one gradient here is the scrim over the
 *     hero photograph, which exists so white text stays legible on it.
 *   - Motion is 140-220ms, ease-out, on transform/opacity/color only.
 *   - Neutrals are tuned: off-white background, near-black ink, one grey ramp.
 */

/* ===============================================================
 * Aliases for the theme.json tokens
 * =============================================================== */

:root {
	--olb-radius-sm: var(--wp--custom--olb--radius--sm);
	--olb-radius-md: var(--wp--custom--olb--radius--md);
	--olb-radius-lg: var(--wp--custom--olb--radius--lg);
	--olb-radius-xl: var(--wp--custom--olb--radius--xl);
	--olb-radius-pill: var(--wp--custom--olb--radius--pill);

	--olb-shadow-sm: var(--wp--custom--olb--shadow--sm);
	--olb-shadow-md: var(--wp--custom--olb--shadow--md);
	--olb-shadow-lg: var(--wp--custom--olb--shadow--lg);
	--olb-shadow-xl: var(--wp--custom--olb--shadow--xl);

	--olb-brand: var(--wp--preset--color--primary);
	--olb-brand-deep: var(--wp--preset--color--primary-dark);
	--olb-accent: var(--wp--preset--color--accent);
	--olb-accent-deep: var(--wp--preset--color--accent-dark);
	--olb-ink: var(--wp--preset--color--contrast);
	--olb-muted: var(--wp--preset--color--muted-text);
	--olb-line: var(--wp--preset--color--hairline);
	--olb-paper: var(--wp--preset--color--base);

	--olb-out: 180ms cubic-bezier(0.22, 0.61, 0.36, 1);
	--olb-in: 140ms cubic-bezier(0.55, 0.06, 0.68, 0.19);

	/* One small z-index scale. Nothing else in the theme sets z-index. */
	--olb-z-sticky: 100;
	--olb-z-overlay: 200;
}

/* ===============================================================
 * Base
 * =============================================================== */

/*
 * WordPress core does not ship a universal box-sizing reset, and neither did
 * this theme. Anything combining `width: 100%` with padding therefore
 * overflowed its container by exactly the padding: the quote form's inputs
 * spilled into the next grid column, and every row of the mobile menu ran
 * 48px past its own band. Both were patched locally before; this closes the
 * class of bug.
 *
 * :where() keeps specificity at zero so a component can still opt out with a
 * plain `box-sizing: content-box` and no specificity fight.
 */
:where(*, *::before, *::after) {
	box-sizing: border-box;
}

body {
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

/* Body copy gets a measure. Long lines are the fastest way to make a page
   feel like a document rather than a designed page. */
:where(a):focus-visible,
:where(button):focus-visible,
:where(input):focus-visible,
:where(select):focus-visible,
:where(textarea):focus-visible,
:where(summary):focus-visible,
:where(.wp-block-button__link):focus-visible {
	outline: 3px solid var(--olb-accent);
	outline-offset: 2px;
	border-radius: 3px;
}

.olb-screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ===============================================================
 * Masthead
 * =============================================================== */

/*
 * The header is rendered inside a block template-part wrapper that is
 * exactly as tall as the header, so `sticky` on the header itself had
 * nothing to stick within and the bar scrolled away. The wrapper is the
 * sticky element; the header keeps the stacking context.
 */
.wp-site-blocks > .wp-block-template-part:has(> .olb-masthead) {
	position: sticky;
	top: 0;
	z-index: var(--olb-z-sticky);
}

.olb-masthead {
	isolation: isolate;
}

/* Once the page has scrolled the bar tightens and casts a shadow, so it
   reads as a fixed toolbar rather than a slice of the page. */
.olb-header {
	transition: padding var(--olb-out), box-shadow var(--olb-out);
}

.is-scrolled .olb-header {
	padding-block: 0.45rem !important;
	box-shadow: var(--olb-shadow-md);
}

@media (prefers-reduced-motion: reduce) {
	.olb-header {
		transition: none;
	}
}

/* --- Utility strip --------------------------------------------- */

.olb-utility {
	font-size: var(--wp--preset--font-size--x-small);
	letter-spacing: 0.01em;
}

.olb-utility p {
	margin: 0;
}

.olb-utility a {
	color: inherit;
	text-decoration: none;
	opacity: 0.88;
	transition: opacity var(--olb-out);
}

.olb-utility a:hover {
	opacity: 1;
	text-decoration: underline;
}

.olb-utility .olb-contact-link svg {
	width: 0.9rem;
	height: 0.9rem;
}

/* The utility bar renders the address on one line via the block attribute,
   so it aligns with the rest of the strip. */
.olb-utility .olb-contact-link--address {
	align-items: center;
}

.olb-utility .olb-contact-link--address svg {
	margin-block-start: 0;
}

.olb-utility__hours,
.olb-utility__parent {
	opacity: 0.88;
}

@media (max-width: 900px) {
	.olb-utility {
		display: none;
	}
}

/* --- Main bar --------------------------------------------------- */

.olb-header {
	background-color: var(--olb-paper);
	border-bottom: 1px solid var(--olb-line);
}

.olb-brand__logo {
	display: block;
	width: auto;
	height: 52px;
}

.olb-header__phone,
a.olb-header__phone {
	font-weight: 700;
	white-space: nowrap;
	color: var(--olb-ink);
	text-decoration: none;
}

.olb-header__phone svg {
	color: var(--olb-accent);
	opacity: 1;
}

.olb-header__phone:hover {
	color: var(--olb-accent-deep);
}

.olb-brand .wp-block-site-logo img {
	height: auto;
	max-height: 58px;
	width: auto;
}

/* The text title is a fallback for before a logo is uploaded. */
.wp-block-site-logo + .olb-brand__fallback {
	display: none;
}

.olb-header__end {
	gap: clamp(1rem, 0.2rem + 1.6vw, 2.25rem) !important;
}

/* The quote page is where the button leads; showing it there is noise. */
.page-template-page-quote .olb-cta-button {
	display: none;
}

/* --- Navigation -------------------------------------------------- */

.olb-nav {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: 0.9375rem;
}

.olb-nav a:where(:not(.wp-element-button)) {
	position: relative;
	padding-block: 0.4rem;
	text-decoration: none;
	color: var(--olb-ink);
	transition: color var(--olb-out);
}

.olb-nav a:where(:not(.wp-element-button))::after {
	content: "";
	position: absolute;
	left: 50%;
	right: 50%;
	bottom: 0;
	height: 2px;
	background: var(--olb-accent);
	transition: left var(--olb-out), right var(--olb-out);
}

.olb-nav a:where(:not(.wp-element-button)):hover::after,
.olb-nav .current-menu-item > a::after {
	left: 0;
	right: 0;
}

/* --- Call box ---------------------------------------------------- */

.olb-callbox {
	gap: 0.7rem !important;
	align-items: center;
}

.olb-callbox__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	flex: none;
	border-radius: var(--olb-radius-pill);
	background: var(--wp--preset--color--brand-tint);
	color: var(--olb-brand);
}

.olb-callbox__icon svg {
	width: 1.25rem;
	height: 1.25rem;
}

.olb-callbox__text {
	line-height: 1.25;
}

/* Block layout adds a top margin to the first child; the label sits tight
   against the top of the box instead. */
.olb-callbox__text > * {
	margin-block: 0;
}

.olb-callbox__label {
	margin: 0 0 0.1rem;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--olb-muted);
}

.olb-callbox__number,
a.olb-callbox__number {
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.1875rem;
	white-space: nowrap;
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--olb-ink);
	text-decoration: none;
	transition: color var(--olb-out);
}

.olb-callbox__number:hover {
	color: var(--olb-brand);
}

/* Superseded below: the callbox stays, it just gets narrower. */

/* ===============================================================
 * Section furniture
 * =============================================================== */

.olb-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	margin-bottom: 0.9rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: 0.875rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	/* 17px/700 is below the large-text threshold, so it needs 4.5:1: the deep
	   teal is 5.2:1 on paper and 4.7:1 on the surface tint. */
	color: var(--olb-accent-deep);
}

.olb-eyebrow::before {
	content: "";
	width: 1.5rem;
	height: 2px;
	margin-inline-end: 0.15rem;
	background: currentColor;
}

/* Over a photograph the rule reads as a stray mark, so it is dropped. */
.olb-eyebrow--light::before {
	display: none;
}

/* Centred intros drop the rule, which only reads well left-aligned. */
.olb-section-intro {
	text-align: center;
}

.olb-section-intro .olb-eyebrow::before {
	display: none;
}

.olb-section-intro h2 {
	text-wrap: balance;
}

.olb-eyebrow--light {
	color: color-mix(in srgb, var(--olb-paper) 92%, transparent);
}

/* ===============================================================
 * Hero
 * =============================================================== */

.olb-hero {
	position: relative;
	isolation: isolate;
}

/* The inner container above is the gutter; the cover's own global padding
   would double it. */
.olb-hero .wp-block-cover__inner-container.has-global-padding,
.olb-page-hero .wp-block-cover__inner-container.has-global-padding {
	padding-inline: 0;
}

@media (max-width: 1240px) {
	.olb-hero .wp-block-cover__inner-container.has-global-padding,
	.olb-page-hero .wp-block-cover__inner-container.has-global-padding {
		padding-inline: var(--wp--preset--spacing--30);
	}
}

.olb-hero .wp-block-cover__image-background {
	object-position: center 38%;
}

/* The one gradient in the theme: a scrim so white type stays legible over a
   photograph. Core's cover rules outrank a theme-added overlay, so it is
   applied to the block's own background layer. */
.wp-block-cover.olb-hero .wp-block-cover__background,
.wp-block-cover.olb-hero span.wp-block-cover__background {
	background: linear-gradient(
		100deg,
		rgba(10, 14, 22, 0.94) 0%,
		rgba(10, 14, 22, 0.82) 40%,
		rgba(10, 14, 22, 0.48) 74%,
		rgba(10, 14, 22, 0.3) 100%
	);
	background-color: transparent !important;
	opacity: 1 !important;
}

.olb-hero h1 {
	text-wrap: balance;
}

.olb-hero .wp-block-column p,
.olb-hero .wp-block-column h1 {
	margin-inline: 0 !important;
}

/* Light hero. */

/* The home headline is the one place the brand sans carries the display
   size: heavy, tight, and clearly different from the serif inner pages. */
.olb-hero:not(.olb-hero--page) h1 {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 800;
	letter-spacing: -0.025em;
	line-height: 1.05;
}

.olb-hero--light .olb-hero__lead {
	color: var(--olb-muted);
	max-width: 36em;
}

.olb-hero__figure {
	margin: 0;
	padding: var(--wp--preset--spacing--40);
	background: var(--olb-paper);
	border: 1px solid var(--olb-line);
	border-radius: var(--olb-radius-xl);
	box-shadow: var(--olb-shadow-md);
}

.olb-hero__figure img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--olb-radius-md);
}

.olb-hero__figure figcaption {
	margin-block-start: 0.9rem;
	text-align: center;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	color: var(--olb-ink);
}

/* Checklist under the hero copy. */
.olb-checks {
	display: grid;
	gap: 0.55rem;
	margin: 1.75rem 0 0;
	padding: 0;
	list-style: none;
	font-weight: 600;
	color: var(--olb-ink);
}

.olb-checks li {
	display: flex;
	align-items: flex-start;
	gap: 0.65rem;
}

.olb-checks li::before {
	content: "";
	flex: none;
	width: 1.25rem;
	height: 1.25rem;
	margin-block-start: 0.15rem;
	border-radius: 50%;
	background: var(--wp--preset--color--brand-tint) center / 0.75rem no-repeat
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23017160' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7'/%3E%3C/svg%3E");
}

/* Trust badges under the hero copy. */
.olb-badges {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 1.75rem 0 0;
	padding: 0;
	list-style: none;
}

.olb-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.45rem 0.9rem;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--olb-paper);
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.24);
	border-radius: var(--olb-radius-pill);
}

.olb-badge svg {
	width: 1rem;
	height: 1rem;
	opacity: 0.9;
}

/* The quote panel floats over the photograph, so it earns a shadow. */
.olb-hero-panel {
	border: 1px solid rgba(255, 255, 255, 0.16);
	border-radius: var(--olb-radius-lg);
	background: rgba(10, 14, 22, 0.72);
	box-shadow: var(--olb-shadow-xl);
}

/* ===============================================================
 * Stats
 * =============================================================== */

.olb-stat__figure {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: clamp(2.25rem, 1.6rem + 2.4vw, 3.5rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.03em;
	font-variant-numeric: tabular-nums;
	color: var(--olb-brand);
}

.olb-stat__label {
	margin-block-start: 0.5rem;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
	color: var(--olb-muted);
}

.olb-card--dark .olb-stat__figure,
.has-contrast-background-color .olb-stat__figure {
	color: var(--olb-paper);
}

.olb-card--dark .olb-stat__label,
.has-contrast-background-color .olb-stat__label {
	color: color-mix(in srgb, var(--olb-paper) 72%, transparent);
}

/* ===============================================================
 * Cards — hairline borders, no resting shadow
 * =============================================================== */

.olb-card,
.is-style-olb-card {
	position: relative;
	height: 100%;
	background: var(--olb-paper);
	border: 1px solid var(--olb-line);
	border-radius: var(--olb-radius-lg);
	transition: transform var(--olb-out), border-color var(--olb-out);
}

.olb-card:hover,
.is-style-olb-card:hover {
	transform: translateY(-4px);
	border-color: color-mix(in srgb, var(--olb-brand) 45%, transparent);
}

.olb-card--flat,
.olb-card--flat:hover {
	transform: none;
}

/* Coverage cards: the photograph bleeds to the card edge. */
.olb-card--media {
	overflow: hidden;
}

.olb-card__media {
	position: relative;
	margin: 0 0 var(--wp--preset--spacing--40);
	overflow: hidden;
}

.olb-card__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	transition: transform 220ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

.olb-card:hover .olb-card__media img {
	transform: scale(1.04);
}

.olb-card--media > :not(.olb-card__media) {
	padding-inline: var(--wp--preset--spacing--50);
}

/* Chip naming the line of cover, sitting on the photo. */
.olb-card__tag {
	position: absolute;
	left: 1rem;
	bottom: 1rem;
	display: inline-flex;
	align-items: center;
	padding: 0.4rem 0.85rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--olb-accent-deep);
	background: var(--wp--preset--color--brand-tint);
	border-radius: var(--olb-radius-pill);
}

/* Next-step link, which reads as an action rather than body text. */
.olb-arrow-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-weight: 700;
	text-decoration: none;
	color: var(--olb-accent-deep);
}

.olb-arrow-link::after {
	content: "→";
	transition: transform var(--olb-out);
}

.olb-card:hover .olb-arrow-link::after,
.olb-arrow-link:hover::after {
	transform: translateX(4px);
}

/* Icon chip. */
.olb-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: var(--olb-radius-md);
	background: var(--wp--preset--color--brand-tint);
	color: var(--olb-accent-deep);
}

.olb-icon svg {
	width: 1.5rem;
	height: 1.5rem;
	fill: currentColor;
}

.olb-icon--accent {
	background: var(--wp--preset--color--accent-tint);
	color: var(--olb-accent);
}

.olb-card--dark .olb-icon {
	background: rgba(255, 255, 255, 0.14);
	color: var(--olb-paper);
}

/* ===============================================================
 * Numbered process
 * =============================================================== */

.olb-step {
	position: relative;
	padding-top: 4rem;
	text-align: center;
}

/* The rule runs behind the number and stops at the column edges. */
.olb-step::before {
	content: "";
	position: absolute;
	top: 1.5rem;
	left: 0;
	right: 0;
	height: 1px;
	background: var(--olb-line);
}

.olb-step__number {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: 0.9rem;
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	color: var(--olb-paper);
	background: var(--olb-brand);
	border-radius: var(--olb-radius-pill);
	/* A ring in the section colour, so the rule appears to pass behind it. */
	box-shadow: 0 0 0 8px var(--wp--preset--color--surface);
}

/* The heading and copy are siblings of the number inside the column, so the
   column is what gets centred. */
.olb-process .wp-block-column {
	text-align: center;
}

.olb-process .wp-block-column p {
	margin-inline: auto;
	max-width: 34ch;
}

/* ===============================================================
 * Testimonials
 * =============================================================== */

.olb-quote {
	position: relative;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.6;
	color: var(--olb-ink);
}

.olb-quote::before {
	content: "\201C";
	display: block;
	font-family: var(--wp--preset--font-family--display);
	font-size: 3.5rem;
	line-height: 0.7;
	color: color-mix(in srgb, var(--olb-brand) 34%, transparent);
	margin-block-end: 0.75rem;
}

/* The featured quote is deliberately bigger than the two beside it. */
.olb-quote--lead {
	font-size: var(--wp--preset--font-size--x-large);
	line-height: 1.45;
}

.olb-rating {
	margin: 0 0 0.5rem;
	color: #c9791f;
	letter-spacing: 0.18em;
	font-size: 1rem;
}

.olb-attribution {
	font-size: var(--wp--preset--font-size--small);
	color: var(--olb-muted);
}

.olb-attribution strong {
	display: block;
	color: var(--olb-ink);
}

/* ===============================================================
 * FAQ
 * =============================================================== */

.olb-faq details,
details.is-style-olb-faq {
	padding: 1.35rem 1.5rem;
	background: var(--olb-paper);
	border: 1px solid var(--olb-line);
	border-radius: var(--olb-radius-md);
	transition: border-color var(--olb-out);
}

.olb-faq details + details {
	margin-top: 0.75rem;
}

/* An open panel is the one thing on the page that floats. */
.olb-faq details[open] {
	border-color: color-mix(in srgb, var(--olb-brand) 35%, transparent);
	box-shadow: var(--olb-shadow-md);
}

.olb-faq summary,
details.is-style-olb-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 1.0625rem;
	line-height: 1.4;
	list-style: none;
}

.olb-faq summary::-webkit-details-marker {
	display: none;
}

.olb-faq summary::after {
	content: "";
	flex: none;
	width: 1.6rem;
	height: 1.6rem;
	border-radius: var(--olb-radius-pill);
	background-color: var(--wp--preset--color--brand-tint);
	background-image: linear-gradient(var(--olb-brand), var(--olb-brand)),
		linear-gradient(var(--olb-brand), var(--olb-brand));
	background-position: center;
	background-repeat: no-repeat;
	background-size: 0.7rem 2px, 2px 0.7rem;
	transition: transform 200ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

.olb-faq details[open] summary::after {
	transform: rotate(135deg);
}

.olb-faq details > :not(summary) {
	margin-block-start: 0.85rem;
	color: var(--olb-muted);
	max-width: 68ch;
}

/* ===============================================================
 * Page hero (inner pages)
 * =============================================================== */

.olb-page-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}

.olb-page-hero .wp-block-cover__image-background {
	object-position: center 45%;
}

.wp-block-cover.olb-page-hero .wp-block-cover__background,
.wp-block-cover.olb-page-hero span.wp-block-cover__background {
	/* Weighted to the left, where the copy sits, and clearing by the middle
	   so the photograph is actually visible. */
	background: linear-gradient(
		90deg,
		rgba(10, 14, 22, 0.92) 0%,
		rgba(10, 14, 22, 0.82) 30%,
		rgba(10, 14, 22, 0.45) 58%,
		rgba(10, 14, 22, 0.12) 100%
	);
	background-color: transparent !important;
	opacity: 1 !important;
}

/* The cover is full-bleed, but its contents belong in the same 1200px box as
   the rest of the site. The inner container becomes that box; the copy then
   starts at the box's left edge rather than the viewport's. */
.olb-page-hero .wp-block-cover__inner-container,
.olb-hero .wp-block-cover__inner-container {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding-inline: 0;
}

/* Below the box width the copy needs a gutter of its own. */
@media (max-width: 1240px) {
	.olb-page-hero .wp-block-cover__inner-container,
	.olb-hero .wp-block-cover__inner-container {
		padding-inline: var(--wp--preset--spacing--30);
	}
}

/* Core centres constrained children with !important, so the hero copy needs
   the same weight to sit left inside that box. */
.olb-page-hero .wp-block-cover__inner-container > .wp-block-group {
	margin-inline-start: 0 !important;
	margin-inline-end: auto !important;
	max-width: 38rem;
}

.olb-page-hero .wp-block-cover__inner-container > .wp-block-group > * {
	margin-inline: 0 !important;
}

.olb-breadcrumb {
	margin: 0 0 1rem;
	font-size: var(--wp--preset--font-size--small);
	color: color-mix(in srgb, var(--olb-paper) 70%, transparent);
}

.olb-breadcrumb a {
	color: inherit;
	text-decoration: none;
}

.olb-breadcrumb a:hover {
	color: var(--olb-paper);
	text-decoration: underline;
}

/* ===============================================================
 * Trust strip
 * =============================================================== */

.olb-trust {
	border-block: 1px solid var(--olb-line);
	background: var(--olb-paper);
}

.olb-trust__item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.35;
}

.olb-trust__item svg {
	flex: none;
	width: 1.35rem;
	height: 1.35rem;
	color: var(--olb-brand);
}

/* ===============================================================
 * Lists
 * =============================================================== */

.olb-checklist,
.olb-watchlist,
.is-style-olb-plain-list {
	list-style: none;
	padding-left: 0;
}

.olb-checklist li,
.olb-watchlist li {
	position: relative;
	padding-left: 2.1rem;
	margin-bottom: 0.9rem;
	line-height: 1.6;
}

.olb-checklist li::before,
.olb-watchlist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.28rem;
	width: 1.3rem;
	height: 1.3rem;
	border-radius: var(--olb-radius-pill);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 0.85rem;
}

.olb-checklist li::before {
	background-color: var(--wp--preset--color--brand-tint);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23d93908'%3E%3Cpath d='M9.6 16.6 5 12l1.4-1.4 3.2 3.2 8-8L19 7.2z'/%3E%3C/svg%3E");
}

/* Caution items read differently from the things that are covered. */
.olb-watchlist li::before {
	background-color: var(--wp--preset--color--accent-tint);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234b66db'%3E%3Cpath d='M12 3 1.5 21h21zm0 4.8 6.6 10.7H5.4zM11 11v4h2v-4zm0 5.2v2h2v-2z'/%3E%3C/svg%3E");
}

/* ===============================================================
 * Photography
 * =============================================================== */

.olb-photo img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--olb-radius-lg);
}

/* ===============================================================
 * Buttons
 * =============================================================== */

.wp-block-button__link {
	transition: background-color var(--olb-out), transform var(--olb-out),
		color var(--olb-out);
}

.wp-block-button__link:hover {
	transform: translateY(-2px);
}

.wp-block-button__link:active {
	transform: translateY(0);
}

.wp-block-button.is-style-outline .wp-block-button__link {
	border-width: 2px;
	border-color: color-mix(in srgb, var(--olb-ink) 28%, transparent);
	color: var(--olb-ink);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--olb-ink);
	background-color: color-mix(in srgb, var(--olb-brand) 6%, transparent);
}

/* Buttons on navy bands invert, or they vanish into the background. */
.has-contrast-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.has-primary-dark-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link {
	/* Navy on the teal is 4.3:1, just under the line; navy on white is 12:1. */
	background-color: var(--olb-paper);
	color: var(--olb-ink);
}

.has-contrast-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.has-primary-dark-background-color .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--brand-tint);
	color: var(--olb-ink);
}

.has-contrast-background-color .wp-block-button.is-style-outline .wp-block-button__link,
.has-primary-dark-background-color .wp-block-button.is-style-outline .wp-block-button__link {
	border-color: rgba(255, 255, 255, 0.45);
	color: var(--olb-paper);
}

/* ===============================================================
 * CTA band — flat brand colour, no gradient
 * =============================================================== */

.olb-cta a:where(:not(.wp-element-button)) {
	color: var(--olb-paper);
	text-decoration: none;
}

.olb-cta a:where(:not(.wp-element-button)):hover {
	text-decoration: underline;
}

.olb-cta .olb-contact-link {
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
}

/* ===============================================================
 * Footer
 * =============================================================== */

/* Block layout puts a gap between the last section and the footer; the two
   should meet edge to edge. */
.wp-site-blocks > .wp-block-template-part:last-child,
.wp-site-blocks > main + .wp-block-template-part {
	margin-block-start: 0;
}

.wp-site-blocks > main {
	margin-block-end: 0;
}

.olb-footer__logo img {
	display: block;
	max-width: 230px;
	height: auto;
}

.olb-footer__logo {
	margin: 0;
}

.olb-footer a:where(:not(.wp-element-button)) {
	color: var(--olb-paper);
	opacity: 0.82;
	text-decoration: none;
	transition: opacity var(--olb-out);
}

.olb-footer a:where(:not(.wp-element-button)):hover {
	opacity: 1;
	text-decoration: underline;
}

/* A link inside running text must not rely on colour alone. */
.olb-footer p a:where(:not(.wp-element-button)) {
	text-decoration: underline;
	text-underline-offset: 0.15em;
}

.olb-footer .wp-block-heading {
	margin-block-end: 1rem;
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--olb-paper) 60%, transparent);
}

/* Contact icons carry the brand colour rather than washed-out white. */
.olb-footer__contact .olb-contact-link svg {
	color: var(--olb-accent);
	opacity: 1;
}

.olb-footer__contact .olb-contact-link {
	align-items: flex-start;
	gap: 0.65rem;
}

.olb-footer__contact .olb-contact-link svg {
	margin-block-start: 0.2rem;
}

/* Opening hours as a term / value pair, so the times line up. */
.olb-hours {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
}

.olb-hours > div {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0.75rem;
	padding-block: 0.3rem;
}

.olb-hours dt {
	min-width: 5rem;
	font-weight: 600;
	color: color-mix(in srgb, var(--olb-paper) 70%, transparent);
}

.olb-hours dd {
	margin: 0;
}

.olb-footer__legal {
	color: color-mix(in srgb, var(--olb-paper) 62%, transparent);
}

.olb-footer__legal p {
	margin: 0;
}

/* ===============================================================
 * Contact links (plugin block)
 * =============================================================== */

.olb-contact-link {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	text-decoration: none;
	line-height: 1.45;
}

.olb-contact-link svg {
	flex: none;
	width: 1.05rem;
	height: 1.05rem;
	fill: currentColor;
	opacity: 0.75;
}

.olb-contact-link--address {
	align-items: flex-start;
}

.olb-contact-link--address svg {
	margin-block-start: 0.2rem;
}

/* ===============================================================
 * Motion preferences
 * =============================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.olb-card:hover,
	.wp-block-button__link:hover,
	.olb-card:hover .olb-card__media img {
		transform: none;
	}
}

/* ===============================================================
 * Section rhythm
 * =============================================================== */

/* Sections alternate paper / surface. Where two paper sections touch, a
   hairline keeps them from reading as one long block. */
.olb-section-divided {
	border-top: 1px solid var(--olb-line);
}

/* Credit line under the section photograph. Sits with the image rather than
   at the end of the copy column, where it read as part of the argument. */
.olb-photo-note {
	max-width: 34rem;
	line-height: 1.5;
}

.olb-photo-note a {
	color: var(--olb-brand-deep);
	text-underline-offset: 0.18em;
}

/* ===============================================================
 * Dark section
 * ===============================================================
 * One dark band mid-page. It breaks a long run of light sections and
 * gives the strongest claim on the page somewhere to land.
 */

.olb-section-dark {
	--olb-on-dark: rgba(252, 252, 253, 0.74);
	isolation: isolate;
}

.olb-section-dark .wp-block-column p,
.olb-section-dark .olb-section-intro p:not(.olb-eyebrow) {
	color: var(--olb-on-dark);
}

.olb-section-dark .wp-block-heading {
	color: var(--wp--preset--color--base);
}

/* The eyebrow rule is drawn in the brand colour, which reads on the dark
   panel; the label itself needs lifting off the near-black. */
.olb-section-dark .olb-eyebrow {
	color: var(--wp--preset--color--base);
}

.olb-section-dark a:where(:not(.wp-element-button)) {
	color: var(--wp--preset--color--base);
	text-decoration-color: rgba(252, 252, 253, 0.45);
}

.olb-section-dark a:where(:not(.wp-element-button)):hover {
	text-decoration-color: currentColor;
}

/* ===============================================================
 * Map embed
 * =============================================================== */

.olb-map {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border: 1px solid var(--olb-line);
	border-radius: var(--olb-radius-lg);
	background: var(--wp--preset--color--surface);
}

.olb-map iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	display: block;
}

@media (max-width: 781px) {
	.olb-map {
		aspect-ratio: 3 / 2;
	}
}

/* Hours list on a light background needs the opposite ink to the footer. */
.olb-hours--light dt {
	color: var(--olb-ink);
}

.olb-hours--light dd {
	color: var(--olb-muted);
}

/* A card's one outgoing link, set apart from the body copy above it. */
.olb-card__link {
	margin-block-start: auto;
	padding-block-start: 0.35rem;
	font-weight: 600;
}

.olb-card__link a {
	color: var(--olb-brand-deep);
	text-underline-offset: 0.18em;
}

/* ===============================================================
 * Focus and fragment targets
 * ===============================================================
 * The masthead is sticky, so an un-offset jump to #what-we-cover or to a
 * field named by the form's error summary puts the target behind it.
 */

html {
	scroll-padding-top: 7rem;
}

@media (max-width: 900px) {
	html {
		scroll-padding-top: 5rem;
	}
}

/* Safari does not move focus on a fragment jump unless the target can hold
   it, which is what made the skip link a no-op there. */
main:focus {
	outline: none;
}

/* ===============================================================
 * Responsive header
 * ===============================================================
 * Core switches the navigation block to its overlay only below 600px. Seven
 * nav items, the phone number, the button and the logo need about 1180px
 * to share one row; narrower than that they wrapped into a tall, ragged
 * header, so the hamburger appears from 1180px down.
 */

@media (max-width: 1180px) {
	.olb-nav .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

	.olb-nav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}

/* Under 760px the phone number keeps its tap target as an icon only, and
   the button gives up its horizontal padding so logo, phone, button and
   hamburger fit one row on a 360px screen. */
@media (max-width: 760px) {
	.olb-header__phone .olb-contact-link__text,
	.olb-header__phone > span:not(.olb-contact-link__icon) {
		position: absolute !important;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}

	.olb-header__phone svg {
		width: 1.5rem;
		height: 1.5rem;
	}

	.olb-cta-button .wp-block-button__link {
		padding-inline: 1rem;
		font-size: var(--wp--preset--font-size--small);
	}
}

/* The phone number is the primary conversion path, so it stays on every
   screen. Below 1180px it sheds the "Speak to our agency" label and the
   number itself keeps its tap target; only under 560px, where the logo and
   hamburger need the room, does it fall back to the icon alone. */
@media (max-width: 1180px) {
	.olb-callbox__label {
		display: none;
	}
}

@media (max-width: 560px) {
	.olb-callbox__text {
		position: absolute !important;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
		border: 0;
	}
}

/* ===============================================================
 * Layout stability
 * =============================================================== */

/* Without this the 185KB photo reserves no height until it has downloaded,
   which shifts everything below it. Matches the 1200x750 source. */
.olb-photo img {
	height: auto;
	aspect-ratio: 8 / 5;
	object-fit: cover;
}

/* WebKit drops the list role when list-style is none, so these need it back.
   Applied here rather than in markup because several are raw HTML blocks. */
.olb-checklist,
.olb-watchlist,
.olb-badges,
.is-style-olb-plain-list {
	list-style: none;
}

/* ===============================================================
 * Breadcrumb
 * ===============================================================
 * Now a nav > ol for screen readers, which without these rules renders as a
 * numbered, stacked list and pushes the hero headline down the page.
 */

.olb-breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.olb-breadcrumb li {
	display: inline;
	margin: 0;
}

/* The separator is generated, so it is never read out as content. */
.olb-breadcrumb li + li::before {
	content: "/";
	margin-inline-end: 0.5rem;
	opacity: 0.6;
}

.olb-breadcrumb [aria-current="page"] {
	color: var(--olb-paper);
}

/* ===============================================================
 * Mobile header and overlay menu
 * =============================================================== */

@media (max-width: 900px) {
	/* The hamburger is the last thing the thumb reaches for, so it sits at
	   the end of the row rather than before the phone number. */
	.olb-header__end {
		justify-content: flex-end;
	}

	.olb-header__end .olb-nav {
		order: 2;
	}

	.olb-header__end .olb-callbox {
		order: 1;
	}
}

/* On a phone the bar holds the logo, the phone icon, the quote button and
   the hamburger. The phone link keeps a 44px target around its icon. */
@media (max-width: 700px) {
	.olb-header__end {
		gap: 0.5rem !important;
	}

	.olb-header__phone,
	a.olb-header__phone {
		padding: 0.625rem;
		margin: -0.625rem 0;
	}

	.olb-cta-button .wp-block-button__link {
		padding: 0.7rem 0.9rem;
		font-size: var(--wp--preset--font-size--x-small);
	}
}

/* --- The overlay itself ------------------------------------------ */

.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close {
	background-color: var(--olb-paper);
	padding: 0;
	max-width: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	margin-block-start: 0;
}

/* Close button: 44px is the minimum comfortable tap target, and the default
   glyph is far smaller than that. */
.wp-block-navigation__responsive-container-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border-radius: var(--olb-radius-pill);
	background: var(--wp--preset--color--surface);
	color: var(--olb-ink);
}

.wp-block-navigation__responsive-container-close svg {
	width: 1.75rem;
	height: 1.75rem;
}

/* Open button matches it, so the two read as the same control. */
.wp-block-navigation__responsive-container-open {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: var(--olb-radius-pill);
	color: var(--olb-ink);
}

.wp-block-navigation__responsive-container-open svg {
	width: 1.6rem;
	height: 1.6rem;
}

/* --- Menu items --------------------------------------------------- */

/* Core leaves the list right-aligned, inset and hugging its content. The
   overlay rows want to run edge to edge so each one is its own band. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	padding: 4.5rem 0 0;
	align-items: stretch;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container {
	width: 100%;
	gap: 0 !important;
	align-items: stretch;
	justify-content: flex-start;
	border-block-start: 1px solid var(--olb-line);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item {
	width: 100%;
	display: block;
	border-block-end: 1px solid var(--olb-line);
}

/* The band sits on the link, not the li: core sets the li to
   `background-color: inherit`, which is not worth fighting when the link
   already fills the row. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content {
	box-sizing: border-box;
	display: block;
	width: 100%;
	padding: 1.15rem 1.5rem;
	font-family: var(--wp--preset--font-family--display);
	font-size: 1.375rem;
	font-weight: 600;
	text-align: center;
	color: var(--olb-ink);
	text-decoration: none;
	background: var(--olb-paper);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item:nth-child(even) .wp-block-navigation-item__content {
	background: var(--wp--preset--color--surface);
}

/* The desktop underline animation has no place in a stacked list. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content::after {
	content: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation-item__content:focus-visible {
	color: var(--olb-brand-deep);
	background: var(--wp--preset--color--brand-tint);
}

/* ===============================================================
 * Testimonials
 * ===============================================================
 * Driven by the Testimonials content type. Nothing renders until the agency
 * enters a real quote with permission on file.
 */

.olb-quote {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--30);
	height: 100%;
	margin: 0;
	padding: var(--wp--preset--spacing--50);
}

.olb-quote blockquote {
	margin: 0;
	padding: 0;
	border: 0;
}

.olb-quote blockquote p {
	margin: 0;
	font-family: var(--wp--preset--font-family--display);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 500;
	line-height: 1.45;
	color: var(--olb-ink);
}

.olb-quote blockquote p::before {
	content: "\201C";
}

.olb-quote blockquote p::after {
	content: "\201D";
}

.olb-quote figcaption {
	margin-top: auto;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	font-size: var(--wp--preset--font-size--small);
}

.olb-quote__name {
	font-weight: 600;
	color: var(--olb-ink);
}

.olb-quote__line {
	color: var(--olb-muted);
}

/* ------------------------------------------------------------------
 * Own Living Benefits sections (1.0.0)
 * ------------------------------------------------------------------ */

/* Hero without a photograph: the ink background carries it. */
.olb-hero--solid { position: relative; overflow: hidden; }
.olb-hero--solid::before {
	content: ""; position: absolute; inset: auto -20% -60% auto; width: 60vw; height: 60vw; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(26,127,90,0.35), transparent 70%); pointer-events: none;
}
.olb-hero--solid > * { position: relative; }

.olb-hero-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.9rem; }
.olb-hero-points li { display: flex; align-items: flex-start; gap: 0.85rem; font-size: var(--wp--preset--font-size--medium); line-height: 1.45; }
.olb-hero-points__n {
	flex: 0 0 auto; width: 1.9rem; height: 1.9rem; border-radius: 50%; display: grid; place-items: center;
	background: var(--wp--preset--color--accent); color: var(--wp--preset--color--contrast); font-weight: 700; font-size: 0.9rem;
}

/* Three risks */
.olb-risks { list-style: none; margin: var(--wp--preset--spacing--40) 0 0; padding: 0; display: grid; gap: 0.9rem; }
.olb-risk { position: relative; padding-left: 1.6rem; line-height: 1.55; }
.olb-risk::before { content: ""; position: absolute; left: 0; top: 0.42em; width: 0.8rem; height: 0.8rem; border-radius: 3px; }
.olb-risk--soon::before { background: #6d4a9e; }
.olb-risk--long::before { background: #4c9a3c; }
.olb-risk--ill::before  { background: #2aa3c9; }

.olb-figure { margin: 0; }
.olb-figure img { width: 100%; height: auto; border-radius: 14px; display: block; }
.olb-figure--framed img { background: #fff; padding: 0.75rem; box-shadow: 0 10px 30px rgba(0,0,0,0.25); }

/* Video facade: an image and a play mark; the real player lives on YouTube. */
.olb-video {
	position: relative; display: block; margin-top: var(--wp--preset--spacing--40); border-radius: 14px; overflow: hidden;
	color: #fff; text-decoration: none; isolation: isolate;
}
.olb-video img { width: 100%; height: auto; display: block; transition: transform 240ms ease; }
.olb-video:hover img, .olb-video:focus-visible img { transform: scale(1.02); }
.olb-video__play {
	position: absolute; inset: 0; margin: auto; width: 4.25rem; height: 4.25rem; border-radius: 50%; display: grid; place-items: center;
	background: rgba(21,26,35,0.82); color: #fff; box-shadow: 0 6px 24px rgba(0,0,0,0.35);
}
.olb-video__play svg { width: 2rem; height: 2rem; margin-left: 0.2rem; }
.olb-video__label {
	position: absolute; left: 0; right: 0; bottom: 0; padding: 0.75rem 1rem; font-size: var(--wp--preset--font-size--small); font-weight: 600;
	background: linear-gradient(to top, rgba(21,26,35,0.85), transparent);
}
.olb-video:focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 3px; }

/* Policy cards: no photograph, a tag pill up top. */
.olb-card--policy { height: 100%; }
.olb-card__tag--inline {
	position: static; display: inline-block; margin-bottom: 0.25rem; padding: 0.3rem 0.7rem; border-radius: 999px;
	background: var(--wp--preset--color--brand-tint); color: var(--wp--preset--color--primary-dark); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.02em;
}

/* Carrier logos: equal boxes, logos scaled inside, neutral by default. */
.olb-carriers {
	list-style: none; margin: 0 auto; padding: 0; display: grid; gap: var(--wp--preset--spacing--40);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (min-width: 782px) { .olb-carriers { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.olb-carrier {
	display: grid; place-items: center; min-height: 7.5rem; padding: 1.25rem 1.5rem; border-radius: 14px;
	background: #fff; border: 1px solid var(--wp--preset--color--hairline);
}
.olb-carrier img { max-width: 100%; max-height: 3.25rem; width: auto; height: auto; object-fit: contain; }

/* Wordmark: the SVG is 420x88; clamp it so the header stays one line on phones. */
.olb-brand__link {
	display: inline-flex;
	align-items: center;
	line-height: 0;
}

.olb-brand__link:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
	border-radius: 6px;
}

@media (max-width: 560px) {
	.olb-brand__logo {
		height: 44px;
	}
}