/*
Theme Name: CTRSpace Lite
Theme URI: https://www.ctrspace.com/
Author: TechAbout, LLC
Author URI: https://www.techabout.com/
Description: CTRSpace Lite is a fast, minimal blogging theme built for readability and speed. It ships no bundled frameworks or icon fonts and makes no requests to outside services — just clean, semantic markup and a small stylesheet. Show your posts as a card grid or a classic list, set your accent color and typography in the Customizer, offer readers an optional dark mode with a light/dark toggle, and build pages from eight ready-made block patterns. Fully responsive, translation-ready and made for the block editor. Want more? CTRSpace Lite pairs with CTRSpace (https://www.ctrspace.com/) for magazine and news layouts, ad management, analytics and AI-assisted publishing tools.
Requires at least: 6.3
Tested up to: 7.1
Requires PHP: 7.0
Version: 3.5.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ctrspace-lite
Tags: blog, one-column, two-columns, right-sidebar, custom-background, custom-colors, custom-header, custom-logo, custom-menu, featured-images, footer-widgets, sticky-post, threaded-comments, translation-ready, block-patterns, block-styles, wide-blocks

CTRSpace Lite WordPress Theme, Copyright (C) 2026 TechAbout, LLC
CTRSpace Lite is distributed under the terms of the GNU GPL v2 or later.

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

CTRSpace Lite v2.0.0 is a full rewrite of the original CTRSpace Lite (v1.5).
It contains no third-party bundled frameworks; see readme.txt for full
credits and license information for the small number of bundled assets
(fonts, if any) and third-party code references.
*/

/* =============================================================
   Table of Contents
   -------------------------------------------------------------
   1.0  CSS Custom Properties (Customizer-controlled)
   1.1  Dark Mode (opt-in, Customizer-controlled)
   2.0  Reset & Base
   3.0  Typography
   4.0  Layout & Containers
   5.0  Header & Navigation
   6.0  Content: Posts & Pages
   7.0  Comments
   8.0  Sidebar & Widgets
   9.0  Footer
   10.0 Forms
   11.0 Blocks & Alignment
   12.0 Accessibility Helpers
   13.0 Upgrade-to-Pro Admin Notice
   14.0 Media Queries
   ============================================================= */

/* =============================================================
   1.0 CSS Custom Properties
   Defaults here are overridden inline by inc/customizer.php output
   (see ctrspace_lite_customizer_css in inc/customizer.php) so that
   Customizer changes need no page rebuild — just an inline <style>
   block with updated variable values.
   ============================================================= */
:root {
	--ctrspace-lite-accent: #1a5fb4;
	--ctrspace-lite-text: #1c1c1c;
	--ctrspace-lite-text-muted: #5f6368;
	--ctrspace-lite-bg: #ffffff;
	--ctrspace-lite-bg-alt: #f7f7f8;
	--ctrspace-lite-border: #e2e2e5;
	--ctrspace-lite-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--ctrspace-lite-font-heading: var(--ctrspace-lite-font-body);
	--ctrspace-lite-max-width: 780px;
	--ctrspace-lite-max-width-wide: 1100px;
}

/* =============================================================
   1.1 Dark Mode
   Opt-in via the "Enable dark mode" Customizer checkbox
   (inc/customizer.php), which adds the .ctrspace-lite-dark-mode-enabled
   body class and, when present, shows a toggle button in the header
   (assets/js/dark-mode-toggle.js) letting a visitor override the
   system setting for their own visit (remembered via localStorage).
   The accent color is left untouched in every case.

   Three states, in increasing specificity:
   - No visitor override: the media query below follows the system
     setting. Works with JavaScript disabled.
   - html.ctrspace-lite-force-light: visitor picked light while their
     system is dark — the :not() guard stops the media query rule
     from matching, so it falls back to the normal light variables.
   - html.ctrspace-lite-force-dark: visitor picked dark while their
     system is light — applies unconditionally, no media query needed.
   ============================================================= */
@media (prefers-color-scheme: dark) {
	html:not(.ctrspace-lite-force-light) body.ctrspace-lite-dark-mode-enabled {
		--ctrspace-lite-text: #e8e8ea;
		--ctrspace-lite-text-muted: #9a9da3;
		--ctrspace-lite-bg: #121212;
		--ctrspace-lite-bg-alt: #1c1e22;
		--ctrspace-lite-border: #2c2f34;
	}
}

html.ctrspace-lite-force-dark body.ctrspace-lite-dark-mode-enabled {
	--ctrspace-lite-text: #e8e8ea;
	--ctrspace-lite-text-muted: #9a9da3;
	--ctrspace-lite-bg: #121212;
	--ctrspace-lite-bg-alt: #1c1e22;
	--ctrspace-lite-border: #2c2f34;
}

.ctrspace-lite-dark-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	margin-left: auto;
	padding: 0;
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 50%;
	background: transparent;
	color: var(--ctrspace-lite-text);
	cursor: pointer;
	flex-shrink: 0;
}

.ctrspace-lite-dark-toggle:hover,
.ctrspace-lite-dark-toggle:focus-visible {
	background: var(--ctrspace-lite-bg-alt);
}

.ctrspace-lite-dark-toggle svg {
	width: 1.15rem;
	height: 1.15rem;
}

.ctrspace-lite-dark-toggle-sun {
	display: none;
}

.ctrspace-lite-dark-toggle.is-dark .ctrspace-lite-dark-toggle-sun {
	display: block;
}

.ctrspace-lite-dark-toggle.is-dark .ctrspace-lite-dark-toggle-moon {
	display: none;
}

/* =============================================================
   2.0 Reset & Base
   ============================================================= */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--ctrspace-lite-bg);
	color: var(--ctrspace-lite-text);
	font-family: var(--ctrspace-lite-font-body);
	font-size: 17px;
	line-height: 1.7;
}

img {
	max-width: 100%;
	height: auto;
}

img,
embed,
iframe,
object,
video {
	max-width: 100%;
}

figure {
	margin: 0 0 1.5em;
}

a {
	color: var(--ctrspace-lite-accent);
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

a:hover,
a:focus {
	text-decoration-thickness: 2px;
}

ul,
ol {
	padding-left: 1.3em;
}

/* =============================================================
   3.0 Typography
   ============================================================= */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--ctrspace-lite-font-heading);
	font-weight: 700;
	line-height: 1.25;
	margin: 1.6em 0 0.6em;
	color: var(--ctrspace-lite-text);
}

h1 {
	font-size: clamp(1.75rem, 4vw, 2.4rem);
}

h2 {
	font-size: clamp(1.4rem, 3vw, 1.9rem);
}

h3 {
	font-size: 1.35rem;
}

p {
	margin: 0 0 1.4em;
}

blockquote {
	margin: 1.6em 0;
	padding: 0.2em 0 0.2em 1.2em;
	border-left: 3px solid var(--ctrspace-lite-accent);
	color: var(--ctrspace-lite-text-muted);
	font-style: italic;
}

code,
kbd,
pre,
samp {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.9em;
}

pre {
	padding: 1em;
	overflow-x: auto;
	background: var(--ctrspace-lite-bg-alt);
	border-radius: 6px;
}

hr {
	border: 0;
	border-top: 1px solid var(--ctrspace-lite-border);
	margin: 2.5em 0;
}

/* =============================================================
   4.0 Layout & Containers
   ============================================================= */
.site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.site-content {
	flex: 1 0 auto;
}

.ctrspace-lite-container {
	max-width: var(--ctrspace-lite-max-width-wide);
	margin: 0 auto;
	padding: 0 1.25rem;
}

.content-area {
	max-width: var(--ctrspace-lite-max-width);
}

.ctrspace-lite-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 3rem;
	padding: 2.5rem 0 4rem;
}

.ctrspace-lite-layout.has-sidebar {
	grid-template-columns: minmax(0, 1fr);
}

.ctrspace-lite-layout-full-width .content-area {
	max-width: none;
}

/* =============================================================
   5.0 Header & Navigation
   ============================================================= */
.site-header {
	border-bottom: 1px solid var(--ctrspace-lite-border);
	padding: 1.5rem 0;
}

.site-branding {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
}

.custom-logo-link img {
	display: block;
	max-height: 60px;
	width: auto;
}

.site-title {
	font-size: 1.5rem;
	font-weight: 800;
	margin: 0;
	line-height: 1.2;
}

.site-title a {
	color: var(--ctrspace-lite-text);
	text-decoration: none;
}

.site-description {
	margin: 0.15rem 0 0;
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.92rem;
}

.main-navigation {
	margin-top: 1rem;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem 1.5rem;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: inline-block;
	padding: 0.35rem 0;
	color: var(--ctrspace-lite-text);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.95rem;
}

.main-navigation a:hover,
.main-navigation a:focus,
.main-navigation .current-menu-item > a {
	color: var(--ctrspace-lite-accent);
}

.main-navigation ul ul {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 20;
	min-width: 200px;
	background: var(--ctrspace-lite-bg);
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 6px;
	padding: 0.5rem 0;
	flex-direction: column;
	gap: 0;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.main-navigation li:hover > ul,
.main-navigation li.focus-within > ul {
	display: flex;
}

.main-navigation ul ul a {
	display: block;
	padding: 0.5rem 1rem;
}

.menu-toggle {
	display: none;
	background: none;
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 6px;
	padding: 0.5rem 0.75rem;
	font-size: 0.95rem;
	font-weight: 600;
	cursor: pointer;
	color: var(--ctrspace-lite-text);
}

/* =============================================================
   6.0 Content: Posts & Pages
   ============================================================= */
.entry-header {
	margin-bottom: 1.25rem;
}

.entry-title {
	margin-top: 0;
}

.entry-title a {
	color: var(--ctrspace-lite-text);
	text-decoration: none;
}

.entry-title a:hover {
	color: var(--ctrspace-lite-accent);
}

.entry-meta {
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.88rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 0.6rem;
	margin-bottom: 0.5rem;
}

.entry-meta a {
	color: inherit;
	text-decoration: none;
}

.entry-meta a:hover {
	color: var(--ctrspace-lite-accent);
}

.post-thumbnail {
	display: block;
	margin: 0 0 1.5rem;
	border-radius: 8px;
	overflow: hidden;
}

.post-thumbnail img {
	display: block;
	width: 100%;
	height: auto;
}

.entry-content > *:last-child {
	margin-bottom: 0;
}

.entry-footer {
	margin-top: 2rem;
	padding-top: 1rem;
	border-top: 1px solid var(--ctrspace-lite-border);
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.88rem;
}

.entry-footer a {
	color: inherit;
}

/* Each footer item (categories, tags, comments, edit) on its own line, so
   "Writing" and "Leave a Comment" never read as one phrase. */
.entry-footer > span {
	display: block;
}

.entry-footer > span + span {
	margin-top: 0.35rem;
}

/* A post that has been edited prints both its published and its updated
   date; only the published one is shown. */
.updated:not(.published) {
	display: none;
}

.link-more,
.more-link {
	font-weight: 600;
}

article.post,
article.page {
	margin-bottom: 3.5rem;
}

/* Blog Layout: Grid (cards) — the default. */
.archive-list--grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 2rem;
}

.archive-list--grid article {
	margin-bottom: 0;
	display: flex;
	flex-direction: column;
}

.archive-list--grid article .entry-content {
	flex: 1;
}

.archive-list--grid article .post-thumbnail {
	margin: -1.75rem -1.75rem 1.25rem;
	border-radius: 10px 10px 0 0;
}

.archive-list--grid .entry-title {
	font-size: 1.25rem;
}

/* Blog Layout: List (compact) — the pre-2.3.0 stacked layout. */
.archive-list--list article {
	padding-bottom: 2.5rem;
	margin-bottom: 2.5rem;
	border-bottom: 1px solid var(--ctrspace-lite-border);
}

.archive-list--list article:last-child {
	border-bottom: none;
}

/* Author bio card, shown at the end of single posts. */
.ctrspace-lite-author-bio {
	margin-top: 2.5rem;
	display: flex;
	gap: 1.25rem;
	align-items: flex-start;
}

.ctrspace-lite-author-bio-avatar {
	border-radius: 50%;
	flex-shrink: 0;
}

.ctrspace-lite-author-bio-name {
	margin: 0 0 0.4rem;
	font-weight: 700;
}

.ctrspace-lite-author-bio-name a {
	color: var(--ctrspace-lite-text);
	text-decoration: none;
}

.ctrspace-lite-author-bio-name a:hover {
	color: var(--ctrspace-lite-accent);
}

.ctrspace-lite-author-bio-description {
	margin: 0;
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.92rem;
}

/* Related posts grid, shown at the end of single posts. */
.ctrspace-lite-related-posts {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--ctrspace-lite-border);
}

.ctrspace-lite-related-posts-title {
	font-size: 1.3rem;
	margin: 0 0 1.25rem;
}

.ctrspace-lite-related-posts-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1.5rem;
}

.ctrspace-lite-related-post-thumb {
	display: block;
	margin: -1.75rem -1.75rem 1rem;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}

.ctrspace-lite-related-post-thumb img {
	display: block;
	width: 100%;
	height: auto;
}

.ctrspace-lite-related-post-title {
	font-size: 1.05rem;
	margin: 0 0 0.35rem;
}

.ctrspace-lite-related-post-title a {
	color: var(--ctrspace-lite-text);
	text-decoration: none;
}

.ctrspace-lite-related-post-title a:hover {
	color: var(--ctrspace-lite-accent);
}

.ctrspace-lite-related-post-date {
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.8rem;
}

.page-header {
	margin-bottom: 2rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--ctrspace-lite-border);
}

.page-header .archive-title,
.page-header .page-title {
	margin: 0 0 0.4rem;
}

.page-header .archive-description {
	color: var(--ctrspace-lite-text-muted);
	margin: 0;
}

/* Pagination */
.pagination,
.post-navigation,
.comment-navigation {
	margin-top: 2.5rem;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.25rem;
	height: 2.25rem;
	padding: 0 0.5rem;
	margin-right: 0.35rem;
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 6px;
	text-decoration: none;
	color: var(--ctrspace-lite-text);
	font-size: 0.88rem;
}

.pagination .page-numbers.current {
	background: var(--ctrspace-lite-accent);
	border-color: var(--ctrspace-lite-accent);
	color: #fff;
}

.pagination .page-numbers.dots {
	border: none;
}

/* =============================================================
   7.0 Comments
   ============================================================= */
.comments-area {
	margin-top: 3rem;
	padding-top: 2rem;
	border-top: 1px solid var(--ctrspace-lite-border);
}

.comments-title,
.comment-reply-title {
	font-size: 1.3rem;
}

.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment-list .children {
	list-style: none;
	margin: 0 0 0 1.5rem;
	padding: 0;
}

.comment-body {
	padding: 1.25rem 0;
	border-bottom: 1px solid var(--ctrspace-lite-border);
}

.comment-author {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-weight: 700;
	font-size: 0.95rem;
}

.comment-author .avatar {
	border-radius: 50%;
}

.comment-metadata {
	font-size: 0.8rem;
	color: var(--ctrspace-lite-text-muted);
	margin: 0.15rem 0 0.5rem;
}

.comment-metadata a {
	color: inherit;
}

.comment-content p {
	margin-bottom: 0.8em;
}

.comment-reply-link {
	font-size: 0.82rem;
	font-weight: 600;
}

.bypostauthor > .comment-body {
	background: var(--ctrspace-lite-bg-alt);
	padding-left: 1rem;
	padding-right: 1rem;
	border-radius: 6px;
}

/* =============================================================
   8.0 Sidebar & Widgets
   ============================================================= */
.widget-area {
	min-width: 0;
}

.widget {
	margin-bottom: 2.5rem;
}

.widget-title {
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0 0 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid var(--ctrspace-lite-text);
}

.widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.widget li {
	padding: 0.4rem 0;
	border-bottom: 1px solid var(--ctrspace-lite-border);
}

.widget li:last-child {
	border-bottom: none;
}

.widget a {
	text-decoration: none;
}

.widget select,
.widget input[type="search"],
.widget input[type="text"] {
	max-width: 100%;
}

/* =============================================================
   9.0 Footer
   ============================================================= */
.site-footer {
	border-top: 1px solid var(--ctrspace-lite-border);
	margin-top: auto;
	padding: 2.5rem 0;
	background: var(--ctrspace-lite-bg-alt);
}

.footer-widgets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 2rem;
	margin-bottom: 2rem;
}

.footer-widgets .widget-title {
	border-bottom-color: var(--ctrspace-lite-border);
}

.site-info {
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.85rem;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.site-info a {
	color: inherit;
}

/* =============================================================
   10.0 Forms
   ============================================================= */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="password"],
textarea,
select {
	width: 100%;
	padding: 0.6rem 0.8rem;
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 6px;
	font-family: inherit;
	font-size: 0.95rem;
	color: var(--ctrspace-lite-text);
	background: var(--ctrspace-lite-bg);
}

input:focus,
textarea:focus,
select:focus {
	outline: 2px solid var(--ctrspace-lite-accent);
	outline-offset: 1px;
}

button,
input[type="submit"],
.wp-block-button__link {
	display: inline-block;
	padding: 0.6rem 1.3rem;
	background: var(--ctrspace-lite-accent);
	color: #fff;
	border: none;
	border-radius: 6px;
	font-weight: 600;
	font-size: 0.95rem;
	cursor: pointer;
	text-decoration: none;
}

button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover {
	filter: brightness(0.92);
}

.search-form {
	display: flex;
	gap: 0.5rem;
}

.search-form .search-field {
	flex: 1;
}

/* =============================================================
   11.0 Blocks & Alignment
   ============================================================= */
.alignwide {
	max-width: var(--ctrspace-lite-max-width-wide);
}

.alignfull {
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

.alignleft {
	float: left;
	margin: 0.4em 1.5em 1em 0;
}

.alignright {
	float: right;
	margin: 0.4em 0 1em 1.5em;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-block-quote {
	border-left: 3px solid var(--ctrspace-lite-accent);
	padding-left: 1.2em;
	font-style: italic;
}

/* =============================================================
   12.0 Accessibility Helpers
   ============================================================= */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 0.875rem;
	font-weight: 700;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

:focus-visible {
	outline: 2px solid var(--ctrspace-lite-accent);
	outline-offset: 2px;
}

/* =============================================================
   13.0 Upgrade-to-Pro Admin Notice
   Purely informational admin-area styling; never loaded on the
   public-facing site. See inc/upgrade-to-pro.php.
   ============================================================= */
.ctrspace-lite-upgrade-notice {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex-wrap: wrap;
	padding: 14px 16px;
}

.ctrspace-lite-upgrade-notice p {
	margin: 0;
	flex: 1 1 260px;
}

.ctrspace-lite-upgrade-notice .button {
	flex-shrink: 0;
}

/* =============================================================
   14.0 Media Queries
   ============================================================= */
@media (max-width: 700px) {
	.menu-toggle {
		display: inline-flex;
		align-items: center;
		gap: 0.4rem;
	}

	.main-navigation ul {
		display: none;
		flex-direction: column;
		gap: 0;
		margin-top: 0.75rem;
	}

	.main-navigation.is-open ul {
		display: flex;
	}

	.main-navigation ul ul {
		position: static;
		border: none;
		box-shadow: none;
		padding-left: 1rem;
		display: flex;
	}

	.main-navigation li {
		border-bottom: 1px solid var(--ctrspace-lite-border);
	}

	.footer-widgets {
		grid-template-columns: 1fr;
	}

	.ctrspace-lite-latest-posts .wp-block-post-template {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 900px) and (min-width: 701px) {
	.ctrspace-lite-latest-posts .wp-block-post-template {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 782px) {
	.ctrspace-lite-layout.has-sidebar {
		grid-template-columns: minmax(0, 1fr) 300px;
	}
}

/* =============================================================
   WordPress Core Classes (captions, galleries, sticky posts)
   ============================================================= */

.wp-caption {
	max-width: 100%;
	margin-bottom: 1.5em;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.wp-caption .wp-caption-text {
	margin: 0.5em 0 0;
}

.wp-caption-text {
	font-size: 0.85em;
	color: var(--ctrspace-lite-muted, #6b6b6b);
	text-align: center;
}

.gallery-caption {
	display: block;
	font-size: 0.85em;
	color: var(--ctrspace-lite-muted, #6b6b6b);
}

.sticky {
	border: 1px solid var(--ctrspace-lite-accent, #1a5fb4);
	border-left-width: 4px;
	padding: 1.25em;
	border-radius: 6px;
}

.sticky .entry-title::after {
	content: " ★";
	color: var(--ctrspace-lite-accent, #1a5fb4);
	font-size: 0.7em;
	vertical-align: super;
}

/* =============================================================
   Custom Header Image
   ============================================================= */

.site-header-image img {
	display: block;
	width: 100%;
	height: auto;
}

/* =============================================================
   Block Styles
   ============================================================= */

.wp-block-quote.is-style-accent-border {
	border-left: 4px solid var(--ctrspace-lite-accent, #1a5fb4);
	padding-left: 1.25em;
	font-style: normal;
}

.wp-block-separator.is-style-accent-thick {
	border: none;
	border-top: 4px solid var(--ctrspace-lite-accent, #1a5fb4);
	width: 80px;
}

.wp-block-group.is-style-card,
.archive-list--grid article,
.ctrspace-lite-card {
	padding: 1.75rem;
	background: var(--ctrspace-lite-bg);
	border: 1px solid var(--ctrspace-lite-border);
	border-radius: 10px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* =============================================================
   Pattern helpers
   Small, reusable classes referenced by the block patterns
   registered in functions.php (ctrspace_lite_register_block_patterns).
   ============================================================= */
.ctrspace-lite-cta-banner {
	padding: 3rem 2rem;
	border-radius: 10px;
	text-align: center;
}

.ctrspace-lite-cta-banner .wp-block-heading,
.ctrspace-lite-cta-banner p {
	color: inherit;
}

.ctrspace-lite-stat-number {
	font-size: clamp(2.5rem, 6vw, 3.5rem);
	font-weight: 800;
	line-height: 1.1;
	color: var(--ctrspace-lite-accent);
	margin: 0;
}

.ctrspace-lite-stat-label {
	color: var(--ctrspace-lite-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.8rem;
	font-weight: 600;
	margin: 0.35rem 0 0;
}

.ctrspace-lite-price {
	font-size: 1.75rem;
	font-weight: 800;
	margin: 0.25rem 0 1.25rem;
}

.ctrspace-lite-latest-posts .wp-block-post-template {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.ctrspace-lite-post-card {
	display: flex;
	flex-direction: column;
}

.ctrspace-lite-post-card .wp-block-post-featured-image {
	margin: -1.75rem -1.75rem 1.25rem;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}

.ctrspace-lite-post-card .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
}

.ctrspace-lite-post-card .wp-block-post-title {
	font-size: 1.2rem;
	margin: 0 0 0.4rem;
}

.ctrspace-lite-post-card .wp-block-post-title a {
	color: var(--ctrspace-lite-text);
	text-decoration: none;
}

.ctrspace-lite-post-card .wp-block-post-title a:hover {
	color: var(--ctrspace-lite-accent);
}

.ctrspace-lite-post-card .wp-block-post-date {
	color: var(--ctrspace-lite-text-muted);
	font-size: 0.85rem;
	margin: 0 0 0.75rem;
}

.ctrspace-lite-post-card .wp-block-post-excerpt {
	margin-top: auto;
}

.ctrspace-lite-post-card .wp-block-post-excerpt p {
	margin: 0;
	color: var(--ctrspace-lite-text-muted);
}