style.css

/*
Theme Name: Unapp
Theme URI: https://colorlib.com/wp/themes/unapp/
Author: Colorlib
Author URI: https://colorlib.com
Description: Unapp is a lightweight, block-based WordPress theme with thirteen one-click starter sites — SaaS, portfolio, church, blog, fitness, restaurant, agency, shop, property, practice, courses, events and finance. Built for the Site Editor with 140+ section patterns, ten colour palettes and five typography presets you can mix, seven section styles and eleven block styles. WooCommerce templates included. Self-hosted variable fonts, no page-builder framework, no jQuery, no icon fonts.
Version: 2.5.3
Update URI: https://updates.colorlib.com/theme/unapp.json
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: unapp
Tags: blog, one-column, rtl-language-support, wide-blocks, block-patterns, block-styles, custom-colors, custom-logo, custom-menu, editor-style, featured-images, full-site-editing, style-variations, template-editing, threaded-comments, translation-ready

Unapp WordPress Theme, (C) 2018-2026 Colorlib
Unapp is distributed under the terms of the GNU GPL.
*/

/*
 * All visual styling lives in theme.json (global styles), styles/*.json (section
 * and color variations) and assets/css/*.css (per-block styles loaded on demand
 * via wp_enqueue_block_style). This file intentionally holds only the theme
 * header plus the few rules that have no theme.json equivalent.
 */

/* Post card thumbnails: clip and gently zoom on hover. */
.wp-block-post-featured-image {
	overflow: hidden;
}

.wp-block-post-featured-image img {
	transition: transform 0.4s ease;
}

@media (prefers-reduced-motion: no-preference) {
	.wp-block-post:hover .wp-block-post-featured-image img {
		transform: scale(1.03);
	}
}

/* Keep phone/app screenshots from stretching in narrow flex columns. */
.wp-block-image img {
	height: auto;
}

/* ==========================================================================
   Header navigation
   Core swaps the menu for the overlay toggle below 600px. With a real menu
   plus a call-to-action button that is far too late: between roughly 600 and
   1000 pixels the items wrap onto two or three lines. Move the swap up so the
   header always stays on one line.
   ========================================================================== */
@media (max-width: 999px) {
	.unapp-header-row .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}

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

/* Never let the header row wrap: the logo stays left, the menu and button stay
   right. Works wherever the header pattern is used — template part or page. */
.unapp-header-row {
	flex-wrap: nowrap;
}

.unapp-header-row > .wp-block-group {
	min-width: 0;
}

.unapp-header-row .wp-block-navigation:not(.is-vertical) > .wp-block-navigation__container {
	flex-wrap: nowrap;
}

.unapp-header-row .wp-block-navigation:not(.is-vertical) .wp-block-navigation-item__content {
	white-space: nowrap;
}

.unapp-header-row .wp-block-site-title {
	white-space: nowrap;
}

/* The mobile overlay is the one place the menu should stack. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	flex-wrap: wrap;
}

/* ==========================================================================
   Focus
   One consistent, high-contrast focus ring everywhere, instead of leaving it to
   each browser's default (which is blue and disappears on dark sections).
   ========================================================================== */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
	border-radius: 2px;
}

/* On dark and gradient sections the primary colour is the background, so the
   ring switches to the section's own text colour. */
:where(.is-style-section-dark, .is-style-section-gradient, .wp-block-cover, .has-dark-background-color)
	:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline-color: currentColor;
}

/* ==========================================================================
   Sticky header
   Users can switch it on per header from the block's Position control. These
   rules only make the result look right once they do.
   ========================================================================== */
.wp-block-template-part > .wp-block-group.is-position-sticky {
	backdrop-filter: saturate(140%) blur(12px);
	-webkit-backdrop-filter: saturate(140%) blur(12px);
	background-color: color-mix(in srgb, var(--wp--preset--color--base) 88%, transparent);
	z-index: 100;
}

/* ==========================================================================
   Accordion (WordPress 7.0)
   ========================================================================== */
.wp-block-accordion .wp-block-accordion-item {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 14px;
	background: var(--wp--preset--color--base);
}

.wp-block-accordion .wp-block-accordion-item + .wp-block-accordion-item {
	margin-top: 0.75rem;
}

.wp-block-accordion-heading__toggle {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.15rem 1.5rem;
	background: none;
	border: 0;
	cursor: pointer;
	color: inherit;
	font: inherit;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	text-align: start;
}

.wp-block-accordion-heading__toggle-icon {
	flex: 0 0 auto;
	color: var(--wp--preset--color--primary);
	font-size: 1.35em;
	line-height: 1;
}

.wp-block-accordion-panel > * {
	margin-inline: 1.5rem;
}

.wp-block-accordion-panel > *:last-child {
	margin-bottom: 1.35rem;
}

/* ==========================================================================
   Pattern utilities
   Small helpers used by patterns that theme.json cannot express. Each is a
   plain class set on the block, so block markup stays valid.
   ========================================================================== */

/* Social links: core paints each service its brand colour in the logos-only
   style at the same specificity as the block's own colour class, so the winner
   depends on stylesheet order. Make the chosen palette colour win outright. */
.wp-block-social-links.is-style-logos-only .wp-social-link.has-base-color.has-base-color {
	color: var(--wp--preset--color--base);
}

.wp-block-social-links.is-style-logos-only .wp-social-link.has-muted-color.has-muted-color {
	color: var(--wp--preset--color--muted);
}

.wp-block-social-links.is-style-logos-only .wp-social-link.has-contrast-color.has-contrast-color {
	color: var(--wp--preset--color--contrast);
}

.wp-block-social-links.is-style-logos-only .wp-social-link.has-primary-color.has-primary-color {
	color: var(--wp--preset--color--primary);
}

/* Galleries: core drops to two across on small screens, which leaves a third
   image alone on the last row. Go to a single column instead. */
@media (max-width: 600px) {
	.wp-block-gallery.has-nested-images.columns-3 > figure.wp-block-image:not(#individual-image),
	.wp-block-gallery.has-nested-images.columns-default > figure.wp-block-image:not(#individual-image) {
		width: 100%;
	}
}

/* Even grids. WP's grid layout keeps a fixed column count at every width, which
   strands the last item on its own row on smaller screens. These classes step
   the columns down through counts that always divide the item count evenly. */
.wp-block-group.unapp-grid-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.wp-block-group.unapp-grid-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1000px) {
	.wp-block-group.unapp-grid-4,
	.wp-block-group.unapp-grid-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 560px) {
	.wp-block-group.unapp-grid-4,
	.wp-block-group.unapp-grid-3 {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Logo cloud: an even grid so no logo is left stranded on its own row —
   six across, then three, then two. */
.wp-block-group.unapp-logo-cloud {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	align-items: center;
	justify-items: center;
}

@media (max-width: 900px) {
	.wp-block-group.unapp-logo-cloud {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 480px) {
	.wp-block-group.unapp-logo-cloud {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.unapp-logo-cloud img {
	max-width: 100%;
}

/* Logo cloud: quiet, monochrome marks that pick up the palette on hover. */
.unapp-logo-cloud img {
	opacity: 0.55;
	filter: grayscale(1);
	transition: opacity 0.2s ease, filter 0.2s ease;
}

.unapp-logo-cloud:hover img {
	opacity: 0.75;
}

/* ==========================================================================
   Post grids (Query Loop)
   Cards in a row share one height, so meta, titles and "Read more" line up
   whether or not a post has a featured image.
   ========================================================================== */
.wp-block-post-template.is-layout-grid > li {
	display: flex;
}

.wp-block-post-template.is-layout-grid > li > .wp-block-group {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.wp-block-post-template.is-layout-grid .wp-block-post-excerpt {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
}

.wp-block-post-template.is-layout-grid .wp-block-post-excerpt__more-text {
	margin-top: auto;
	padding-top: 0.75em;
}

/* Query pagination reads as one control group. */
.wp-block-query-pagination {
	gap: 0.4rem;
}

.wp-block-query-pagination-numbers {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem;
}

.wp-block-query-pagination :is(.page-numbers, .wp-block-query-pagination-previous, .wp-block-query-pagination-next) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5em;
	padding: 0.45em 0.85em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	text-decoration: none;
	line-height: 1;
}

.wp-block-query-pagination .page-numbers.dots {
	min-width: 0;
	padding-inline: 0.35em;
	border-color: transparent;
}

.wp-block-query-pagination .page-numbers.current {
	background-color: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

.wp-block-query-pagination :is(a.page-numbers, a.wp-block-query-pagination-previous, a.wp-block-query-pagination-next):hover {
	background-color: var(--wp--preset--color--surface);
	border-color: var(--wp--preset--color--muted);
}

/* ==========================================================================
   Content alignment
   Post content is a full-width constrained container so wide/full blocks can
   bleed. Core floats legacy left/right aligned direct children to the edge of
   that container (= the viewport); pull them back to the content column so
   left, right, center, wide and full stay predictable.
   ========================================================================== */
.wp-block-post-content.wp-block-post-content.is-layout-constrained > .alignleft {
	margin-inline-start: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2));
}

.wp-block-post-content.wp-block-post-content.is-layout-constrained > .alignright {
	margin-inline-end: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2));
}

/* Full-width text containers without their own padding must not touch the viewport edge. */
.wp-block-post-content > .alignfull.wp-block-columns:not([style*="padding"]),
.wp-block-post-content > .alignfull.wp-block-group:not(.has-global-padding):not([style*="padding"]),
.wp-block-post-content > .alignfull.wp-block-gallery > figcaption,
.wp-block-post-content > .alignfull.wp-block-image > figcaption {
	padding-inline: var(--wp--style--root--padding-left, 1.5rem) var(--wp--style--root--padding-right, 1.5rem);
}

/* Legacy paginated posts (<!--nextpage-->). */
.post-nav-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
	margin-top: var(--wp--preset--spacing--50);
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.post-nav-links .post-page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25em;
	padding: 0.35em 0.6em;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 999px;
	text-decoration: none;
}

.post-nav-links .post-page-numbers.current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--base);
}

/* Classic (freeform) markup has no block gap, so give it the same vertical
   rhythm as block content. Elements rendered by blocks carry a wp-block-*
   class and keep using blockGap. */
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) :is(h1, h2, h3, h4, h5, h6):not([class*="wp-block-"]) {
	margin-top: 1.8em;
	margin-bottom: 0.6em;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) :is(p, ul, ol, dl, table, pre, blockquote, address, figure, form):not([class*="wp-block-"]) {
	margin-top: 0;
	margin-bottom: 1.5em;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) li > :is(ul, ol) {
	margin-top: 0.35em;
	margin-bottom: 0.35em;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) li {
	margin-bottom: 0.35em;
}

/* Consecutive headings stay tight together. */
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) :is(h1, h2, h3, h4, h5, h6):not([class*="wp-block-"]) + :is(h1, h2, h3, h4, h5, h6):not([class*="wp-block-"]) {
	margin-top: 0.8em;
}

:is(.wp-block-post-content, .wp-block-comment-content) > :first-child {
	margin-top: 0;
}

:is(.wp-block-post-content, .wp-block-comment-content) > :last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   Classic (non-block) content: shortcodes, captions, HTML tags
   Scoped to post/comment content and the editor canvas.
   ========================================================================== */
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) img {
	max-width: 100%;
	height: auto;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) :where(figure) {
	margin-inline: 0;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) .aligncenter {
	display: block;
	margin-inline: auto;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) img.alignleft,
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) .wp-caption.alignleft {
	float: inline-start;
	margin: 0.5em 1.5em 1em 0;
	margin-inline: 0 1.5em;
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) img.alignright,
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) .wp-caption.alignright {
	float: inline-end;
	margin: 0.5em 0 1em 1.5em;
	margin-inline: 1.5em 0;
}

/* Classic captions ([caption]) match block captions. */
.wp-caption {
	max-width: 100%;
	margin-bottom: 1.5em;
}

.wp-caption img {
	display: block;
}

.wp-caption-text,
.gallery-caption {
	margin-top: 0.5em;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.5;
}

/* Classic [gallery] shortcode → responsive grid. */
.gallery {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	margin: 1.5em 0;
}

.gallery-columns-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.gallery-columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.gallery-columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gallery-columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.gallery-columns-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.gallery-columns-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.gallery-columns-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.gallery-columns-9 { grid-template-columns: repeat(9, minmax(0, 1fr)); }

.gallery-item {
	margin: 0;
	text-align: center;
}

.gallery-icon img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 8px;
}

/* A single-column classic gallery keeps the image's own proportions. */
.gallery-columns-1 .gallery-icon img {
	aspect-ratio: auto;
}

@media (max-width: 600px) {
	.gallery-columns-4,
	.gallery-columns-5,
	.gallery-columns-6,
	.gallery-columns-7,
	.gallery-columns-8,
	.gallery-columns-9 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Classic blockquote (block quotes are styled by theme.json). */
:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) blockquote:not([class*="wp-block-"]):not(.wp-block-pullquote *) {
	margin: 1.5em 0;
	padding-inline-start: var(--wp--preset--spacing--40);
	border-inline-start: 4px solid var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--large);
}

:is(.wp-block-post-content, .wp-block-comment-content, .editor-styles-wrapper) blockquote:not([class*="wp-block-"]) cite {
	display: block;
	margin-top: 0.5em;
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	font-style: normal;
}

/* Tables — classic and block share the same rhythm. */
:is(.wp-block-post-content, .wp-block-comment-content) table {
	width: 100%;
	margin: 1.5em 0;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}

:is(.wp-block-post-content, .wp-block-comment-content) :is(td, th) {
	padding: 0.75rem;
	border: 1px solid var(--wp--preset--color--border);
	text-align: start;
	vertical-align: top;
}

:is(.wp-block-post-content, .wp-block-comment-content) th {
	font-weight: 600;
}

/* Preformatted / code — classic tags match the Code block. */
:is(.wp-block-post-content, .wp-block-comment-content) pre:not([class*="wp-block-"]) {
	margin: 1.5em 0;
	padding: var(--wp--preset--spacing--40);
	overflow-x: auto;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 8px;
	background: var(--wp--preset--color--surface);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.6;
}

:is(.wp-block-post-content, .wp-block-comment-content) :is(:not(pre) > code, kbd, samp) {
	padding: 0.15em 0.4em;
	border-radius: 4px;
	background: var(--wp--preset--color--surface);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9em;
}

/* Definition lists, rules, addresses. */
:is(.wp-block-post-content, .wp-block-comment-content) dt {
	font-weight: 600;
}

:is(.wp-block-post-content, .wp-block-comment-content) dd {
	margin: 0 0 1em;
	margin-inline-start: var(--wp--preset--spacing--40);
}

:is(.wp-block-post-content, .wp-block-comment-content) hr:not([class*="wp-block-"]) {
	margin: 2em 0;
	border: 0;
	border-top: 1px solid var(--wp--preset--color--border);
}

:is(.wp-block-post-content, .wp-block-comment-content) address {
	margin-bottom: 1.5em;
	font-style: normal;
}

/* Media embeds never overflow the column. */
:is(.wp-block-post-content, .wp-block-comment-content) :is(iframe, embed, object, video) {
	max-width: 100%;
}

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

/* Core's "Square" style targets the wrapper, but the radius is set on the link
   by global styles, so it needs re-applying here. */
.wp-block-button.is-style-squared > .wp-block-button__link,
.wp-block-button.is-style-squared .wp-element-button {
	border-radius: 0;
}

/* Aligned single buttons should still line up with the text column. */
.wp-block-button.aligncenter {
	text-align: center;
}

/* Buttons placed in a flex row (e.g. the header) must not get squeezed by long menus. */
.is-layout-flex > .wp-block-buttons {
	flex-shrink: 0;
}

/* Section seams
   ------------------------------------------------------------------------
   Sections are separated by their ground: explanation on the page ground,
   proof and prices on the tinted one. Where two sections share a ground they
   would otherwise read as one long column, so the second takes a hairline. */
:is(.wp-block-post-content, .editor-styles-wrapper) > .wp-block-group.alignfull:not(.is-style-section-soft):not(.has-background):not(.wp-block-cover)
	+ .wp-block-group.alignfull:not(.is-style-section-soft):not(.has-background):not(.wp-block-cover),
:is(.wp-block-post-content, .editor-styles-wrapper) > .wp-block-group.alignfull.is-style-section-soft
	+ .wp-block-group.alignfull.is-style-section-soft {
	border-top: 1px solid var(--wp--preset--color--border);
}

/* Header on small screens
   ------------------------------------------------------------------------
   The header row is nowrap by contract, so its children have to be allowed to
   shrink or they push past the viewport. With a long call-to-action label — or
   with WooCommerce adding account and cart icons to the row — the button was
   overflowing by about 36px at 390px. */
@media (max-width: 599px) {
	.unapp-header-row > .wp-block-group {
		min-width: 0;
	}

	/* The row's gaps come from block spacing presets; at this width they are
	   most of the overflow. */
	.unapp-header-row,
	.unapp-header-row > .wp-block-group {
		gap: 0.6rem !important;
	}

	.unapp-header-row .wp-block-site-title {
		min-width: 0;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	/* The header pattern sets this padding inline, so only !important reaches it. */
	.unapp-header-row .wp-block-button__link {
		padding-inline: 0.9rem !important;
		font-size: 0.8125rem;
	}
}

/* Composition patterns
   ------------------------------------------------------------------------
   Behaviour the block editor cannot express: a sticky explanation column, a
   logo marquee, and the monthly/yearly price switch. All three degrade to a
   sensible static layout with no JavaScript and no motion. */

.unapp-sticky {
	position: sticky;
	top: var(--wp--preset--spacing--50);
}

@media (max-width: 781px) {
	.unapp-sticky {
		position: static;
	}
}

.unapp-marquee {
	overflow: hidden;
	mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.unapp-marquee__track {
	width: max-content;
	animation: unapp-marquee 46s linear infinite;
}

.unapp-marquee__track figure {
	margin: 0;
	flex: 0 0 auto;
	opacity: 0.55;
	filter: grayscale(1);
}

.unapp-marquee:hover .unapp-marquee__track {
	animation-play-state: paused;
}

@keyframes unapp-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.unapp-marquee__track {
		animation: none;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
	}
}

/* Price switch: monthly is what renders without JavaScript. */
.unapp-price__yearly {
	display: none;
}

.unapp-period__to-monthly {
	display: none;
}

[data-unapp-period="yearly"] .unapp-price__yearly {
	display: inline;
}

[data-unapp-period="yearly"] .unapp-price__monthly {
	display: none;
}

[data-unapp-period="yearly"] .unapp-period__to-yearly {
	display: none;
}

[data-unapp-period="yearly"] .unapp-period__to-monthly {
	display: inline;
}

/* --------------------------------------------------------------------------
   Site Tagline in a footer brand column

   The footers show the site's own tagline when one is set, and fall back to
   the pattern's written blurb when it is not. Site Tagline is a dynamic block,
   and the style engine drops rgba() from a dynamic block's colour attribute,
   so the muted tone the blurb carries inline is applied here instead — the two
   branches then look the same.
   -------------------------------------------------------------------------- */

.wp-block-site-tagline.unapp-footer-note {
	color: rgba(255, 255, 255, 0.75);
}