/*
Theme Name: Novo Lite Photography
Theme URI: https://promo-theme.com/product/novo-lite-photography-wordpress-theme
Author: Promo Theme
Author URI: https://promo-theme.com/
Description: Novo Lite Photography is a clean, dark-styled photography and portfolio theme for showcasing galleries and blog stories, with Customizer color options, a portfolio grid template, and optional WooCommerce and Jetpack support.
Requires at least: 6.4
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.0.5
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: novo-lite-photography
Tags: photography, portfolio, blog, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, threaded-comments, translation-ready

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.

Novo Lite Photography WordPress Theme, Copyright 2026 Promo Theme
Novo Lite Photography is distributed under the terms of the GNU General Public License v2 or later.

Novo Lite Photography is based on underlying WordPress APIs and coding practices demonstrated in the
default WordPress themes (Twenty Twenty-Four, etc.), which are (C) WordPress.org and
licensed under the GNU General Public License v2 or later.
*/

/*--------------------------------------------------------------
# Base
--------------------------------------------------------------*/

*,
*::before,
*::after {
	box-sizing: border-box;
}

:root {
	--novolite-accent: #c48f56;
	--novolite-font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--novolite-bg: #000;
	--novolite-surface: #111111;
	--novolite-text: #fff;
	--novolite-muted: #9a9a9a;
	--novolite-border: #565656;
	color-scheme: dark;
}

body {
	margin: 0;
	color: var(--novolite-text);
	background: var(--novolite-bg);
	font-family: var(--novolite-font);
	font-size: 16px;
	line-height: 1.5;
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

/* Sticky footer: .site fills the viewport height and .site-main absorbs
   the extra space, so the footer sits at the bottom of the viewport on
   short pages instead of floating right under the content. */
.site {
	display: flex;
	flex-direction: column;
	flex: 1;
	width: 100%;
}

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

input[type="text"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="password"],
textarea,
select {
	background: var(--novolite-surface);
	color: var(--novolite-text);
	border: 1px solid var(--novolite-border);
	font-family: inherit;
	transition: all 0.3s ease;
}

input::placeholder,
textarea::placeholder {
	color: inherit;
	opacity: 0.6;
}

a {
	color: inherit;
	transition: color 0.3s ease;
}

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus,
.menu a:focus,
.custom-logo-link:focus {
	outline: 2px solid #005fcc;
	outline-offset: 2px;
}

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

.container {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 20px;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
	line-height: 1.2;
	font-weight: 700;
}

/* Heading margins scale in em (relative to each level's own font-size) so
   bigger headings get proportionally more breathing room instead of every
   level sharing one flat pixel value. */
h1, .h1, h2, .h2 { margin: 0.8em 0 0.5em; }
h3, .h3, h4, .h4 { margin: 0.7em 0 0.45em; }
h5, .h5, h6, .h6 { margin: 0.6em 0 0.4em; }

.entry-content > :is(h1, h2, h3, h4, h5, h6):first-child,
.widget > :is(h1, h2, h3, h4, h5, h6):first-child {
	margin-top: 0;
}

h1 a, .h1 a,
h2 a, .h2 a,
h3 a, .h3 a,
h4 a, .h4 a,
h5 a, .h5 a,
h6 a, .h6 a {
	text-decoration: none;
}

h1, .h1 { font-size: 3.75rem; }
h2, .h2 { font-size: 3rem; }
h3, .h3 { font-size: 2.25rem; }
h4, .h4 { font-size: 1.875rem; }
h5, .h5 { font-size: 1.5rem; }
h6, .h6 { font-size: 1.125rem; }

@media (max-width: 767.98px) {
	h1, .h1 { font-size: 3rem; }
	h2, .h2 { font-size: 2.25rem; }
	h3, .h3 { font-size: 1.875rem; }
	h4, .h4 { font-size: 1.5rem; }
	h5, .h5 { font-size: 1.125rem; }
	h6, .h6 { font-size: 1rem; }
}

/* Signature underline dash below page/section/widget titles. */
.page-title,
.widget-title,
.comments-title,
.comment-reply-title {
	position: relative;
}

.comments-title,
.comment-reply-title {
	font-size: 2.25rem; /* section-level heading, not a page title, even though comments-title renders as an h2 */
}

body.single .entry-title,
body.page .entry-title {
	position: relative;
	font-size: 3rem; /* single/page titles render as h1 markup but are visually sized like h2 */
}

.page-title::after,
.widget-title::after,
.comments-title::after,
.comment-reply-title::after,
body.single .entry-title::after,
body.page .entry-title::after {
	content: "";
	display: block;
	width: 20px;
	height: 1px;
	margin-top: 20px;
	background: var(--novolite-accent);
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/

.skip-link {
	position: absolute;
	top: -100px;
	left: 0;
	background: var(--novolite-surface);
	color: var(--novolite-text);
	padding: 12px 20px;
	z-index: 100000;
	text-decoration: none;
}

.skip-link:focus {
	top: 0;
}

.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;
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/

.site-header {
	position: relative;
	z-index: 50;
	padding: 24px 0;
}

/* Float the header over a full-height banner instead of pushing it down; the banner has its own dark overlay so a transparent header stays readable. */
body.has-transparent-header .site-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	background: transparent;
}

.site-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 20px;
}

.site-branding .site-title {
	margin: 0;
	font-family: var(--novolite-logo-font, var(--novolite-font));
	font-size: var(--novolite-logo-font-size, 18px);
	font-weight: var(--novolite-logo-font-weight, 700);
}

.site-branding .site-title a {
	color: inherit;
	text-decoration: none;
}

.site-branding .site-description {
	margin: 4px 0 0;
	font-size: 0.9rem;
	color: var(--novolite-muted);
}

.custom-logo-link {
	display: inline-block;
}

.custom-logo-link img {
	display: block;
	width: min( 100%, var( --novolite-logo-width, 240px ) );
	height: auto;
}

.main-navigation ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	margin: 0;
	padding: 0;
}

.main-navigation ul li {
	position: relative;
}

.main-navigation a {
	position: relative;
	display: inline-block;
	color: inherit;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 0.8125rem;
	letter-spacing: 0.03em;
	padding-bottom: 4px;
}

.main-navigation a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 2px;
	background: var(--novolite-accent);
	transition: width 0.3s ease;
}

.main-navigation li.focus > a,
.main-navigation a:hover,
.main-navigation :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_ancestor, .current_page_parent) > a {
	color: var(--novolite-accent);
}

/* Underline marks the active item only; hover just recolors the text. */
.main-navigation li.focus > a::after,
.main-navigation :is(.current-menu-item, .current-menu-ancestor, .current-menu-parent, .current_page_item, .current_page_ancestor, .current_page_parent) > a::after {
	width: 100%;
}

/* Chevron: down at the top level, right on nested flyouts. */
.main-navigation .menu-item-has-children > a {
	padding-right: 16px;
}

.main-navigation .menu-item-has-children > a::before {
	content: "";
	position: absolute;
	right: 1px;
	top: 50%;
	width: 5px;
	height: 5px;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: translateY(-75%) rotate(45deg);
}

/* Nested items need more right padding so the flyout chevron sits as far
   from the panel's edge as the text does on the left (20px). */
.main-navigation ul ul .menu-item-has-children > a {
	padding-right: 34px;
}

.main-navigation ul ul .menu-item-has-children > a::before {
	right: 20px;
	transform: translateY(-75%) rotate(-45deg);
}

/* Dropdown panel: hidden until hovered, keyboard-focused (.focus) or tapped
   open on touch (.submenu-open) — both classes toggled by navigation.js. */
.main-navigation ul ul {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 90;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 0;
	width: max-content;
	min-width: 220px;
	max-width: 320px;
	margin: 0;
	padding: 0;
	background: var(--novolite-bg);
	border: 1px solid var(--novolite-border);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

/* Flyouts open to the right, 2px into the parent panel so the shared
   borders overlap into a single line instead of doubling up. */
.main-navigation ul ul ul {
	top: -1px;
	left: calc(100% - 2px);
}

.main-navigation ul li:is(:hover, .focus, .submenu-open) > ul {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Row dividers between dropdown items, at every level but the last item. */
.main-navigation ul ul li:not(:last-child) {
	border-bottom: 1px solid var(--novolite-border);
}

.main-navigation ul ul a {
	display: block;
	padding: 10px 20px;
	white-space: normal;
	overflow-wrap: break-word;
}

.main-navigation ul ul a::after {
	display: none;
}

/* Toggle button navigation.js inserts after each parent link, for opening
   dropdowns by tap where :hover doesn't apply. */
.submenu-toggle {
	display: none;
	position: absolute;
	top: 0;
	right: 0;
	width: 32px;
	height: 32px;
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.menu-toggle:hover,
.menu-toggle:focus,
.submenu-toggle:hover,
.submenu-toggle:focus {
	background: none;
}

.submenu-toggle::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 7px;
	height: 7px;
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
	transform: translate(-50%, -70%) rotate(45deg);
	transition: transform 0.2s ease;
}

.submenu-open > .submenu-toggle::before {
	transform: translate(-50%, -30%) rotate(-135deg);
}

/* Hamburger: 3 bars morph into an X; label stays for screen readers. */
.menu-toggle {
	display: none;
	position: relative;
	background: none;
	border: 0;
	width: 26px;
	height: 18px;
	padding: 0;
	cursor: pointer;
	color: inherit;
	-webkit-tap-highlight-color: transparent;
}

.menu-toggle-bars,
.menu-toggle-bars::before,
.menu-toggle-bars::after {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: currentColor;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.menu-toggle-bars {
	top: 8px;
}

.menu-toggle-bars::before,
.menu-toggle-bars::after {
	content: "";
}

.menu-toggle-bars::before {
	top: -8px;
}

.menu-toggle-bars::after {
	top: 8px;
}

.main-navigation.toggled .menu-toggle-bars {
	background: transparent;
}

.main-navigation.toggled .menu-toggle-bars::before {
	transform: translateY(8px) rotate(45deg);
}

.main-navigation.toggled .menu-toggle-bars::after {
	transform: translateY(-8px) rotate(-45deg);
}

@media (max-width: 782px) {
	.menu-toggle {
		display: inline-block;
	}

	.main-navigation > ul {
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		z-index: 95;
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 0;
		width: auto;
		max-height: 80vh;
		margin: 0;
		padding: 8px 24px 24px;
		background: var(--novolite-bg);
		border-top: 1px solid var(--novolite-border);
		overflow-y: auto;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
	}

	.main-navigation.toggled > ul {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.main-navigation > ul > li {
		width: 100%;
		padding: 14px 0;
		border-bottom: 1px solid var(--novolite-border);
	}

	.main-navigation > ul > li:last-child {
		border-bottom: 0;
	}

	/* Dropdowns become inline accordions on mobile: no hover, so items with
	   children expand in place via the .submenu-toggle button (navigation.js). */
	.main-navigation ul ul {
		position: static;
		width: 100%;
		max-height: 0;
		margin: 0;
		padding: 0 0 0 16px;
		background: transparent;
		border: 0;
		opacity: 1;
		visibility: visible;
		transform: none;
		overflow: hidden;
		transition: max-height 0.3s ease;
	}

	.main-navigation ul li:is(.submenu-open, .focus) > ul {
		max-height: 1000px;
	}

	.main-navigation .menu-item-has-children > a::before {
		display: none;
	}

	.submenu-toggle {
		display: block;
		top: 14px;
	}

	.main-navigation ul ul .submenu-toggle {
		top: 4px;
	}
}

/* Header layout: logo centered, menu below */
.header-layout-centered .site-header-inner {
	flex-direction: column;
	text-align: center;
}

.header-layout-centered .main-navigation ul {
	justify-content: center;
}

/*--------------------------------------------------------------
# Content layout
--------------------------------------------------------------*/

.site-content-wrap {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	padding: 40px 0;
}

.site-content-wrap.has-sidebar {
	grid-template-columns: 2fr 1fr;
}

@media (max-width: 782px) {
	.site-content-wrap.has-sidebar {
		grid-template-columns: 1fr;
	}
}

/* Prevents wide unbreakable content (e.g. a <pre> block) from forcing this grid track past its ratio. */
.content-area,
.widget-area {
	min-width: 0;
}

.post-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 32px;
	align-items: start;
}

.widget-area .widget,
.footer-widget-area .widget {
	margin-bottom: 32px;
}

/* Constrain widget headings (classic .widget-title and block .wp-block-heading) to below the page-content h1-h6 scale. */
.widget-area h1,
.widget-area h2,
.widget-area h3,
.widget-area h4,
.widget-area h5,
.widget-area h6,
.widget-area .wp-block-heading,
.footer-widget-area h1,
.footer-widget-area h2,
.footer-widget-area h3,
.footer-widget-area h4,
.footer-widget-area h5,
.footer-widget-area h6,
.footer-widget-area .wp-block-heading {
	font-size: 1.125rem;
	margin: 0 0 20px;
}

/* Whole-line widget links: underline only on hover, unlike inline links in running body copy. */
.widget-area a,
.footer-widget-area a {
	text-decoration: none;
}

.widget-area a:hover,
.footer-widget-area a:hover {
	text-decoration: underline;
}

/* Bring the plain "Recent Posts" link list and the core "Recent Comments"
   block (which ships its own 1em gap) to a matching, deliberate rhythm. */
.widget-area .wp-block-latest-posts__list li {
	margin-bottom: 10px;
}

.widget-area .wp-block-latest-comments__comment {
	margin-bottom: 14px;
}

/*--------------------------------------------------------------
# Post / page cards
--------------------------------------------------------------*/

.post-card {
	background: var(--novolite-surface);
	overflow: hidden;
}

/* Cap thumbnail height so a photo-heavy card doesn't tower over a
   text-only neighbor in the same grid row. */
.post-card .post-thumbnail img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.post-card .entry-header {
	padding: 20px 24px 0;
}

.post-card .entry-title {
	font-size: 1.375rem;
}

.post-card .entry-content {
	padding: 0 24px;
}

.post-card .entry-footer {
	padding: 0 24px 20px;
}

.post-card .entry-footer:empty {
	padding: 0;
}

.entry-footer {
	color: var(--novolite-muted);
}

.entry-footer a {
	color: var(--novolite-accent);
	text-decoration: none;
}

.entry-footer a:hover {
	text-decoration: underline;
}

/* Tags read as a quiet, secondary label (matching the date/byline size),
   not as a second accent-colored call to action next to the comment link. */
.entry-footer .tags-links {
	font-size: 0.85rem;
}

.entry-footer .tags-links a {
	color: inherit;
}

.entry-meta {
	color: var(--novolite-accent);
	font-size: 0.85rem;
}

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

.entry-meta a:hover {
	text-decoration: underline;
}

/*--------------------------------------------------------------
# Portfolio grid
--------------------------------------------------------------*/

.portfolio-grid {
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 4px;
}

.portfolio-item {
	position: relative;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--novolite-surface);
}

.portfolio-item-link {
	display: block;
	width: 100%;
	height: 100%;
}

.portfolio-item-link img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.portfolio-item-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--novolite-surface);
	border: 1px solid var(--novolite-border);
}

/* Quiet image-icon glyph so an empty portfolio slot reads as an
   intentional placeholder rather than a missing/broken image. */
.portfolio-item-placeholder::before {
	content: "";
	width: 34px;
	height: 34px;
	background-color: var(--novolite-border);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.3'%3E%3Crect x='3' y='5' width='18' height='14' rx='1'/%3E%3Ccircle cx='9' cy='11' r='2'/%3E%3Cpath d='M21 16l-5-5-4 4-3-3-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.3'%3E%3Crect x='3' y='5' width='18' height='14' rx='1'/%3E%3Ccircle cx='9' cy='11' r='2'/%3E%3Cpath d='M21 16l-5-5-4 4-3-3-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.portfolio-item-overlay {
	position: absolute;
	inset: auto 0 0 0;
	display: flex;
	align-items: flex-end;
	padding: 16px;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.65), transparent);
	opacity: 0;
	transition: opacity 0.2s ease;
}

.portfolio-item-link:hover .portfolio-item-overlay,
.portfolio-item-link:focus .portfolio-item-overlay {
	opacity: 1;
}

.portfolio-item-title {
	color: var(--novolite-text);
	font-weight: 600;
}

/*--------------------------------------------------------------
# Password protected content
--------------------------------------------------------------*/

.post-password-form p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.post-password-form input[type="password"] {
	padding: 10px 12px;
}

.post-password-form input[type="submit"] {
	width: auto;
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/

.site-footer {
	border-top: 1px solid var(--novolite-border);
	padding: 24px 0;
}

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

.site-info {
	font-size: 0.9rem;
	color: var(--novolite-muted);
}

.site-info a {
	color: inherit;
}

/*--------------------------------------------------------------
# Buttons (outline by default, fills with the accent color on hover)
--------------------------------------------------------------*/

button,
input[type="submit"],
.search-submit {
	display: inline-block;
	background: transparent;
	color: inherit;
	border: 1px solid var(--novolite-accent);
	border-radius: 0;
	padding: 10px 20px;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: all 0.3s ease;
}

button:hover,
input[type="submit"]:hover,
.search-submit:hover {
	background: var(--novolite-accent);
	color: var(--novolite-text);
}

/*--------------------------------------------------------------
# Pagination
--------------------------------------------------------------*/

.pagination,
.comments-pagination {
	margin: 40px 0;
	font-size: 0.875rem;
}

.pagination .nav-links,
.comments-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pagination .page-numbers,
.comments-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 10px;
	border: 1px solid var(--novolite-border);
	color: inherit;
	text-decoration: none;
	transition: all 0.3s ease;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover,
.comments-pagination .page-numbers.current,
.comments-pagination .page-numbers:hover {
	background: var(--novolite-surface);
	color: var(--novolite-accent);
	border-color: var(--novolite-accent);
}

/*--------------------------------------------------------------
# Comments
--------------------------------------------------------------*/

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

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

.comment-body {
	position: relative;
	padding-bottom: 25px;
}

.comment-body::after {
	content: "";
	display: table;
	clear: both;
}

.comment-author .avatar {
	float: left;
	width: 80px;
	height: 80px;
}

.comment-author .says {
	display: none;
}

.comment-author .fn {
	display: block;
	margin-left: 105px;
	padding-bottom: 5px;
	border-bottom: 1px solid var(--novolite-border);
	font-style: normal;
	font-size: 1.125rem;
	font-weight: 700;
}

.comment-author .fn a {
	color: inherit;
	text-decoration: none;
}

.comment-metadata {
	margin: 10px 0 0 105px;
	font-size: 0.625rem;
	font-weight: 700;
	color: var(--novolite-accent);
}

.comment-metadata a {
	color: inherit;
	text-decoration: none;
}

.comment-metadata .edit-link {
	margin-left: 8px;
	text-transform: uppercase;
}

.comment-content {
	margin: 10px 0 0 105px;
	font-size: 0.875rem;
	font-weight: 300;
	line-height: 1.875;
}

.comment-content p {
	margin: 0 0 1em;
}

.comment-content p:last-child {
	margin-bottom: 0;
}

.comment-awaiting-moderation {
	display: block;
	margin-left: 105px;
	font-size: 0.8125rem;
	font-style: italic;
	color: var(--novolite-muted);
}

.reply {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
}

.comment-reply-link {
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: underline;
}

.comment-list #respond {
	margin-left: 105px;
	padding: 20px;
	background: var(--novolite-surface);
	border: 1px solid var(--novolite-border);
}

/*--------------------------------------------------------------
# Single post navigation (previous/next post)
--------------------------------------------------------------*/

.post-navigation {
	margin: 40px 0;
	padding: 20px 0;
	border-top: 1px solid var(--novolite-border);
}

.post-navigation .nav-links {
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.post-navigation .nav-next {
	margin-left: 20px;
	padding-left: 20px;
	border-left: 1px solid var(--novolite-border);
}

.post-navigation a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 500;
	color: var(--novolite-muted);
}

.post-navigation a span {
	text-decoration: underline;
}

.post-navigation .nav-arrow {
	flex-shrink: 0;
}

.post-navigation a:hover {
	color: var(--novolite-accent);
}

/*--------------------------------------------------------------
# Galleries (core [gallery] shortcode)
--------------------------------------------------------------*/

.gallery {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 1.5em -12px;
}

.gallery-item {
	box-sizing: border-box;
	padding: 0 0 12px 12px;
	text-align: center;
}

.gallery-columns-1 .gallery-item {
	width: 100%;
}

.gallery-columns-2 .gallery-item {
	width: 50%;
}

.gallery-columns-3 .gallery-item {
	width: 33.333%;
}

.gallery-columns-4 .gallery-item {
	width: 25%;
}

.gallery-columns-5 .gallery-item {
	width: 20%;
}

.gallery-columns-6 .gallery-item {
	width: 16.666%;
}

.gallery-columns-7 .gallery-item {
	width: 14.285%;
}

.gallery-columns-8 .gallery-item {
	width: 12.5%;
}

.gallery-columns-9 .gallery-item {
	width: 11.111%;
}

.gallery-item img {
	display: block;
	width: 100%;
	height: auto;
}

.gallery-caption {
	display: block;
	margin-top: 4px;
	font-size: 0.85rem;
	color: var(--novolite-muted);
}

.comment-respond input[type="text"],
.comment-respond input[type="email"],
.comment-respond input[type="url"],
.comment-respond textarea {
	width: 100%;
	padding: 10px 12px;
}

/*--------------------------------------------------------------
# Core alignment, caption and sticky-post classes
--------------------------------------------------------------*/

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

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

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

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

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

.wp-caption .wp-caption-text {
	margin: 0.8075em 0;
	font-size: 0.85rem;
	color: var(--novolite-muted);
}

.bypostauthor {
	display: block;
}

.sticky {
	display: block;
}

/*--------------------------------------------------------------
# Content typography (blockquote, table, code, lists)
--------------------------------------------------------------*/

.entry-content blockquote {
	position: relative;
	margin: 1.75em 0;
	padding: 0.2em 1.5em 0.2em 1.75em;
	border-left: 2px solid var(--novolite-accent);
	font-size: 1.125rem;
	font-style: italic;
	line-height: 1.65;
}

.entry-content blockquote::before {
	content: "\201C";
	position: absolute;
	top: -0.1em;
	left: 0.4em;
	font-family: Georgia, "Times New Roman", serif;
	font-style: normal;
	font-size: 2.5em;
	line-height: 1;
	color: var(--novolite-accent);
	opacity: 0.45;
}

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

.entry-content cite {
	display: inline-block;
	font-style: normal;
	font-size: 0.85rem;
	letter-spacing: 0.02em;
	color: var(--novolite-muted);
}

.entry-content ul,
.entry-content ol {
	padding-left: 1.5em;
}

.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
	margin: 0;
}

.entry-content dl {
	margin: 1.5em 0;
}

.entry-content dt {
	margin-top: 1em;
	font-weight: 700;
}

.entry-content dt:first-child {
	margin-top: 0;
}

.entry-content dd {
	margin: 0.25em 0 0;
	color: var(--novolite-muted);
}

.entry-content address {
	font-style: normal;
	line-height: 1.6;
	color: var(--novolite-muted);
}

.entry-content hr {
	margin: 2em 0;
	border: none;
	border-top: 1px solid var(--novolite-border);
}

.entry-content code,
.entry-content kbd,
.entry-content pre {
	font-family: "Courier New", Courier, monospace;
}

.entry-content code,
.entry-content kbd {
	padding: 0.15em 0.4em;
	font-size: 0.9em;
	background: var(--novolite-surface);
	border: 1px solid var(--novolite-border);
	border-radius: 3px;
}

.entry-content pre {
	overflow-x: auto;
	padding: 16px;
	background: var(--novolite-surface);
	border: 1px solid var(--novolite-border);
}

.entry-content pre code,
.entry-content pre kbd {
	padding: 0;
	background: none;
	border: none;
}

.entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.5em 0;
}

.entry-content th,
.entry-content td {
	border: 1px solid var(--novolite-border);
	padding: 8px 12px;
	text-align: left;
}

.entry-content th {
	font-weight: 700;
	background: var(--novolite-surface);
	border-bottom: 2px solid var(--novolite-accent);
}

/*--------------------------------------------------------------
# Contact form 7 - minimal underline style
--------------------------------------------------------------*/

.novolite-contact-form {
	max-width: 350px;
	margin: 0 auto;
	text-align: center;
}

.novolite-contact-form .wpcf7-form p {
	text-align: center;
}

.novolite-contact-form .wpcf7-form-control-wrap {
	display: block;
	margin-bottom: 15px;
}

.novolite-contact-form input[type="text"],
.novolite-contact-form input[type="email"],
.novolite-contact-form textarea {
	display: block;
	width: 100%;
	padding: 10px 15px;
	background: transparent;
	border: none;
	border-bottom: 1px solid #fff;
	border-radius: 0;
	color: #fff;
	font-family: var(--novolite-font, inherit);
	font-style: italic;
	font-weight: 300;
	text-align: center;
	font-size: 14px;
}

.novolite-contact-form textarea {
	padding: 15px 20px;
	height: 110px;
	resize: vertical;
}

.novolite-contact-form input::placeholder,
.novolite-contact-form textarea::placeholder {
	color: #fff;
	font-style: italic;
	font-weight: 300;
}

.novolite-contact-form input:focus,
.novolite-contact-form textarea:focus {
	outline: none;
	border-bottom-color: var(--novolite-accent);
}

.novolite-contact-form .wpcf7-submit {
	display: inline-block;
	margin: 8px auto 0;
	padding: 10px 20px;
	background: transparent;
	border: 1px solid var(--novolite-accent);
	color: #fff;
	font-family: var(--novolite-font, inherit);
	font-weight: 400;
	text-transform: uppercase;
	font-size: 12px;
	border-radius: 0;
	cursor: pointer;
	transition: background 0.3s ease, color 0.3s ease;
}

.novolite-contact-form .wpcf7-submit:hover {
	background: var(--novolite-accent);
	color: #14100c;
}

.novolite-contact-form .wpcf7-spinner {
	display: block;
	margin: 12px auto 0;
}

.novolite-contact-form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	font-style: normal;
	text-align: center;
}

.novolite-contact-form .wpcf7-response-output {
	margin: 20px 0 0;
	text-align: center;
	font-size: 14px;
}

.novolite-contact-icon .elementor-icon-box-icon i,
.novolite-contact-icon .elementor-icon-box-icon svg {
	color: #fff;
	fill: #fff;
}

/*--------------------------------------------------------------
# About Me page helpers
--------------------------------------------------------------*/

.novolite-fill-image,
.novolite-fill-image .elementor-widget-container {
	height: 100%;
}

.novolite-fill-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.elementor-widget-progress .elementor-progress-wrapper {
	overflow: visible;
}

.elementor-widget-progress .elementor-progress-percentage {
	position: absolute;
	top: -22px;
	right: 0;
	height: auto;
	line-height: 1;
}

.novolite-skill-cell,
.elementor-element.elementor-element-9e3c4c1,
.elementor-element.elementor-element-93d4c4b,
.elementor-element.elementor-element-12cd53c,
.elementor-element.elementor-element-80ed40c {
	flex: 0 1 calc(50% - 20px) !important;
	min-width: 220px;
}

.novolite-why-cell {
	flex: 0 1 280px;
}

.elementor-element.elementor-element-079e2f6,
.elementor-element.elementor-element-742708e {
	flex: 1 1 0 !important;
}

.novolite-why-box .elementor-icon-box-description {
	font-style: italic;
}