/*
Theme Name: Nextvoid Tech Blog
Theme URI: https://nextvoid.com/
Description: A modern, minimal, tech blog
Author: Nextvoid
Template: generatepress
Version: 1.0
*/

/*--------------------------------------------------------------
  TABLE OF CONTENTS
  1.  CSS Variables & Root
  2.  CSS Reset
  3.  Base Typography
  4.  Headings
  5.  Inline & Block Elements
  6.  Lists
  7.  Tables
  8.  Forms & Inputs
  9.  Buttons
  10. Images & Media
  11. Links & Transitions
  12. Code & Pre
  13. Accessibility
  14. Alignment Utilities
  15. Site Layout & Grid
  16. Site Header
  17. Navigation
  18. Breadcrumbs
  19. Site Footer
  20. Post / Entry
  21. Archive / Blog Grid
  22. Sidebar & Widgets
  23. Comments
  24. Pagination
  25. TOC (EZ TOC Plugin)
  26. Animations
  27. Responsive – Tablet (769px–1024px)
  28. Responsive – Mobile (≤768px)
--------------------------------------------------------------*/


/*--------------------------------------------------------------
  1. CSS Variables & Root
--------------------------------------------------------------*/
:root {
	--font-sans: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}


/*--------------------------------------------------------------
  2. CSS Reset
--------------------------------------------------------------*/
html,
body,
p,
ol,
ul,
li,
dl,
dt,
dd,
blockquote,
figure,
fieldset,
legend,
textarea,
pre,
iframe,
hr,
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	padding: 0;
	border: 0;
}

html {
	box-sizing: border-box;
	font-family: sans-serif;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
}

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

/* Remove all text-shadow globally */
* {
	text-shadow: none !important;
}

main {
	display: block;
}

progress {
	vertical-align: baseline;
}

/* Form element normalization */
button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	margin: 0;
}

[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

:-moz-focusring {
	outline: 1px dotted ButtonText;
}


/*--------------------------------------------------------------
  3. Base Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
	font-family: var(--font-sans);
	font-weight: 400;
	font-size: 16px;
	line-height: 1.75;
	color: #37352f;
	margin: 0 auto;
	background: #f1f5f9;
	background: #ffffff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: auto;
	text-rendering: optimizeSpeed; /* not optimizeLegibility — that causes layout shifts and is slow */

}

p {
	/* font-size: 16px; */
	/* line-height: 1.75; */
	/* color: #37352f; */
	/* margin-bottom: 1.2em; */
}

blockquote {
	font-style: italic;
	color: #333;
	background: #3faaff17;
	border-left: 6px solid var(--primary-color);
	margin: 2.2em 0;
	padding: 1em 1.5em;
	border-radius: 6px;
	position: relative;
	font-weight: 600;
}

blockquote p:last-child {
	margin: 0;
}

blockquote::before {
	content: "''";
	font-size: 4em;
	color: var(--primary-color);
	position: absolute;
	left: 0;
	top: -35px;
	letter-spacing: -5px;
	opacity: 0.4;
}

blockquote cite {
	display: block;
	margin-top: 0.5em;
	font-style: normal;
	font-weight: 700;
	color: #555;
}

hr {
	background-color: #0000001a;
	border: 0;
	height: 1px;
	margin: 40px 0;
}

address {
	margin: 0 0 1.5em;
}

abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

mark,
ins {
	text-decoration: none;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: 0.5ex;
}

small {
	font-size: 75%;
	color: #9b9a97;
}

big {
	font-size: 125%;
}

b,
strong {
	font-weight: 700;
}

dfn,
cite,
em,
i {
	font-style: italic;
}

figure {
	margin: 0;
}


/*--------------------------------------------------------------
  4. Headings
--------------------------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: bold;
	letter-spacing: -0.01em;
	word-spacing: 1px;
	color: #242526;
	margin-top: 1em;
	margin-bottom: 0.6em;
}

h1 {
	font-size: 2.3rem;
	line-height: 1.4;
	font-weight: 800;
}

h2 {
	font-size: 2.2rem;
	line-height: 1.6;
}

h3 {
	font-size: 1.5rem;
	line-height: 1.7;
	font-weight: 700;
}

h4 {
	font-size: 1.8rem;
}

h5 {
	font-size: 1.2rem;
}


/*--------------------------------------------------------------
  5. Inline & Block Elements
--------------------------------------------------------------*/
abbr,
acronym {
	border-bottom: 1px dotted #666;
	cursor: help;
}

code,
kbd,
tt,
var {
	font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
}

dt {
	font-weight: 700;
}

dd {
	margin: 0 1.5em 1.5em;
}


/*--------------------------------------------------------------
  6. Lists
--------------------------------------------------------------*/
ul,
ol {
	margin: 0 0 1.5em 2.4em;
}

ul li,
ol li {
	margin-left: 0;
	margin-bottom: 15px;
}

li::marker {
	font-weight: bold;
	color: var(--primary-color);
}

ul {
	list-style: disc;
}

ol {
	list-style: decimal;
}

li>ul,
li>ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}

p,
ul,
ol {
	margin-bottom: 1.5rem;
}


/*--------------------------------------------------------------
  7. Tables
--------------------------------------------------------------*/
table,
th,
td {
	border: 1px solid #0000001a;
}

table {
	border-collapse: separate;
	border-spacing: 0;
	border-width: 1px 0 0 1px;
	margin: 0 0 1.5em;
	width: 100%;
}

th,
td {
	padding: 8px;
	border-width: 0 1px 1px 0;
}

th {
	font-weight: 700;
}


/*--------------------------------------------------------------
  8. Forms & Inputs
--------------------------------------------------------------*/
input[type="search"],
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
textarea,
select {
	width: 100%;
	padding: 0.35rem 0.75rem;
	border: 1px solid #dbe7f2;
	border-radius: 0.375rem;
	background-color: #f6f9fc;
	font-size: 0.888rem;
	color: #111827;
	transition: border-color 0.2s, box-shadow 0.2s;
	margin-bottom: 1rem;
}

input:focus,
textarea:focus,
select:focus {
	outline: none;
	border-color: #3b82f6;
	box-shadow: 0 0 0 2px #3b82f64d;
}

fieldset {
	padding: 0;
	border: 0;
	min-width: inherit;
}

fieldset legend {
	padding: 0;
	margin-bottom: 1.5em;
}


/*--------------------------------------------------------------
  9. Buttons
--------------------------------------------------------------*/
button,
input[type="submit"] {
	background-color: var(--primary-color);
	color: #fff;
	padding: 0.4rem 1.2rem;
	border: none;
	border-radius: 50px;
	cursor: pointer;
	font-size: 1rem;
	transition: background-color 0.2s;
}

button:hover,
input[type="submit"]:hover {
	background-color: #2563eb;
}

button.menu-toggle:hover,
button.menu-toggle:active,
button.menu-toggle:focus {
	background-color: transparent;
}

.button,
.wp-block-button .wp-block-button__link {
	padding: 10px 20px;
	display: inline-block;
}

.wp-block-button .wp-block-button__link {
	font-size: inherit;
	line-height: inherit;
}


/*--------------------------------------------------------------
  10. Images & Media
--------------------------------------------------------------*/
img {
	height: auto;
	max-width: 100%;
	width: 100%;
	border-radius: 5px;
}

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

.size-auto,
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
	max-width: 100%;
	height: auto;
}

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

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

.wp-caption img {
	position: relative;
	vertical-align: bottom;
}

.wp-caption .wp-caption-text {
	font-size: 73%;
	padding-top: 3px;
	opacity: 0.8;
	font-style: italic;
}

.wp-block-image figcaption {
	font-size: 13px;
	text-align: center;
}

.wp-block-gallery,
ul.blocks-gallery-grid {
	margin-left: 0;
}

.wp-block-gallery .blocks-gallery-image figcaption,
.wp-block-gallery .blocks-gallery-item figcaption {
	background: #ffffffb3;
	color: #000;
	padding: 10px;
	box-sizing: border-box;
}

/* Gallery */
.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
}

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

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

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

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

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

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

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

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

.gallery-caption {
	display: block;
}

.gallery-item img {
	vertical-align: bottom;
}

.gallery-icon {
	padding: 5px;
}

/* Post thumb */
.post-thumb a {
	display: block;
	position: relative;
	overflow: hidden;
}

.post-thumb a img,
.post-thumb img {
	display: block;
	border-radius: 5px;
	width: 100%;
	height: auto;
}

.post-thumb.post-thumb68543210 {
	overflow: hidden;
	background: white;
}

.featured-image {
	line-height: 0;
}

.separate-containers .inside-article>.featured-image,
.one-container .inside-article>.featured-image {
	margin-top: 0;
	margin-bottom: 0em;
}

.separate-containers .featured-image {
	margin-top: 20px;
}

.post-image:not(:first-child) {
	margin-top: 2em;
}

.icon-tabler {
	width: 24px;
	height: 24px;
	stroke: #555;
	transition: stroke 0.2s ease;
}

.icon-tabler:hover {
	stroke: #ff6600;
}


/*--------------------------------------------------------------
  11. Links & Transitions
--------------------------------------------------------------*/
a {
	color: #3177e7;
	text-decoration: none;
	font-weight: 500;
	transition: color 0.1s ease-in-out, background-color 0.1s ease-in-out;
}

a:hover {
	text-decoration: underline;
}

/* Zero-duration catch-all for body/inputs (overrides the above only where needed) */
body,
button,
input,
select,
textarea {
	transition: all 0s ease-in-out;
}


/*--------------------------------------------------------------
  12. Code & Pre
--------------------------------------------------------------*/
pre,
code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace;
	font-size: 0.875rem;
	border-radius: 0.375rem;
	margin-bottom: 1.5rem;
}

/* Inline code */
code:not(pre code) {
	background: #f3f4f6;
	color: #111827;
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 0.9em;
}

/* Code block – terminal style */
pre {
	background: #0f172a;
	color: #e5e7eb !important;
	border-radius: 10px;
	padding: 18px 18px 16px;
	overflow-x: auto;
	position: relative;
	font-size: 13.5px;
	line-height: 1.8;
	border: 1px solid #1e293b;
}

pre code {
	background: transparent;
	color: inherit;
	display: block;
	margin-top: 12px;
	line-height: 1.8;
}

/* Terminal dot decorations */
pre::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 14px;
	width: 10px;
	height: 10px;
	background: #ef4444;
	border-radius: 50%;
	box-shadow: 18px 0 #f59e0b, 36px 0 #22c55e;
}

/* Terminal scrollbar */
pre::-webkit-scrollbar {
	height: 6px;
}

pre::-webkit-scrollbar-thumb {
	background: #374151;
	border-radius: 10px;
}


/*--------------------------------------------------------------
  13. Accessibility
--------------------------------------------------------------*/
.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 !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px #0009;
	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;
}

#primary[tabindex="-1"]:focus {
	outline: 0;
}

.using-mouse :focus {
	outline: 0;
}

.using-mouse ::-moz-focus-inner {
	border: 0;
}


/*--------------------------------------------------------------
  14. Alignment Utilities
--------------------------------------------------------------*/
.alignleft {
	float: left;
	margin-right: 1.5em;
}

.alignright {
	float: right;
	margin-left: 1.5em;
}

.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}

.no-sidebar .entry-content .alignfull {
	margin-left: calc(-100vw / 2 + 100% / 2);
	margin-right: calc(-100vw / 2 + 100% / 2);
	max-width: 100vw;
	width: auto;
}

.full-width-content .entry-content .alignwide {
	margin-left: 0;
	width: auto;
	max-width: unset;
}

.sticky {
	display: block;
}

.page-links {
	clear: both;
	margin: 0 0 1.5em;
}


/*--------------------------------------------------------------
  15. Site Layout & Grid
--------------------------------------------------------------*/
.grid-container {
	margin-left: auto;
	margin-right: auto;
	max-width: 1180px;
}

.container.grid-container {
	width: auto;
	margin-bottom: 100px;
}

.full-width-content .container.grid-container {
	max-width: 100%;
}

.sidebar .grid-container {
	max-width: 100%;
	width: 100%;
}

/* Sidebar ordering */
.left-sidebar .sidebar,
.both-left .is-left-sidebar,
.both-sidebars .is-left-sidebar {
	order: -10;
}

.both-left .is-right-sidebar {
	order: -5;
}

.both-right .is-left-sidebar {
	order: 5;
}

.both-right .is-right-sidebar,
.both-sidebars .is-right-sidebar {
	order: 10;
}

/* Sidebar margins */
.both-right .inside-left-sidebar,
.both-left .inside-left-sidebar {
	margin-right: 10px;
}

.both-right .inside-right-sidebar,
.both-left .inside-right-sidebar {
	margin-left: 10px;
}

/* One-container offsets */
.one-container.right-sidebar main,
.one-container.both-right main {
	margin-right: 40px;
}

.one-container.left-sidebar main,
.one-container.both-left main {
	margin-left: 40px;
}

.one-container.both-sidebars main {
	margin: 0 40px;
}

.one-container .site-content {
	padding: 20px;
}

/* Separate containers */
.separate-containers.no-sidebar main {
	margin: 0;
}

.separate-containers.right-sidebar main,
.separate-containers.both-right main {
	margin-left: 0;
}

.separate-containers.left-sidebar main,
.separate-containers.both-left main {
	margin-right: 0;
}

.separate-containers .inside-right-sidebar,
.separate-containers .inside-left-sidebar {
	margin-top: 20px;
	margin-bottom: 20px;
}

.inside-page-header {
	padding: 40px;
}

.separate-containers main> :last-child,
.one-container main> :last-child {
	margin-bottom: 0;
}

/* Full / contained width overrides */
.full-width-content.no-sidebar.separate-containers main {
	margin: 0;
}

.full-width-content.separate-containers .inside-article,
.full-width-content.one-container .site-content,
.contained-content.separate-containers .inside-article,
.contained-content.one-container .site-content {
	padding: 0;
}

/* Spacing between main children */
.sidebar .widget,
.page-header,
main>* {
	margin-bottom: 30px;
}

.site-content,
.entry-header {
	word-wrap: break-word;
	margin-top: 30px;
}

.site-content>div {
	margin: 5px;
}

/* Single-post grid layout */
.page,
.single {
	background-color: white;
}

.single .site-content {
	display: grid;
	grid-template-columns: 260px 1fr 200px;
	align-items: start;
	gap: 10px;
}

.page .main-content,
.single .main-content {
	min-width: 0;
}

/* Page article header */
.page .inside-article .entry-header {
	margin: 40px 0 10px;
	padding: 15px 0;
}


/*--------------------------------------------------------------
  16. Site Header
--------------------------------------------------------------*/
.site-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background-color: #fff;
	box-shadow: 0 16px 40px 0 rgba(10, 37, 64, 0.07);
}

.sticky-header-wrap {
	position: sticky;
	top: 0;
	z-index: 999;
	background: #fff;
}

.inside-header {
	display: flex;
	align-items: center;
	padding: 5px 10px;
}

.main-title {
	margin: 0;
	font-size: 25px;
	line-height: 1.2em;
	word-wrap: break-word;
	font-weight: 700;
	text-transform: none;
}

.site-description {
	margin: 0;
	line-height: 1.5;
	font-weight: 400;
	text-transform: none;
	font-size: 15px;
}

.site-logo {
	display: inline-block;
	max-width: 160px;
}

.site-header .header-image {
	vertical-align: middle;
	margin: 0;
}

.site-branding {
	display: inline-block;
}

.site-branding-container {
	display: inline-flex;
	align-items: center;
	text-align: left;
	flex-shrink: 0;
}

.site-branding-container .site-logo {
	margin-right: 1em;
}

/* Header widget */
.header-widget {
	margin-left: auto;
}

.header-widget p:last-child {
	margin-bottom: 0;
}

.nav-float-right .header-widget {
	margin-left: 20px;
}

.nav-float-right #site-navigation {
	margin-left: auto;
}

.nav-float-left #site-navigation {
	margin-right: auto;
	order: -10;
}

.nav-float-left .header-widget {
	margin-left: 0;
	margin-right: 20px;
	order: -15;
}

.header-aligned-center:not([class*="nav-float-"]) .inside-header {
	justify-content: center;
	flex-direction: column;
	text-align: center;
}

.header-aligned-center:not([class*="nav-float-"]) .header-widget {
	margin-left: auto;
	margin-right: auto;
}

.header-aligned-center:not([class*="nav-float-"]) .inside-header> :not(:first-child) {
	margin-top: 1em;
}

.header-aligned-right:not([class*="nav-float-"]) .inside-header {
	justify-content: flex-end;
}

.header-aligned-right:not([class*="nav-float-"]) .header-widget {
	margin-right: auto;
	margin-left: 0;
	order: -10;
}

/* Gradient header background decoration */
.header-gradient-bg {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 300px;
	z-index: -1;
	background: linear-gradient(180deg, #e2e7ff, #fbfbfd00) !important;
	pointer-events: none;
}

/* Animated below-header bar */
.custom-below-header {
	background: linear-gradient(135deg, #69a322 0%, #18b893 50%, #0c51ce 100%);
	background-size: 200% 200%;
	animation: gradientShift 5s ease infinite;
	color: #fff;
	box-shadow: 0 1px 3px #0000001a;
	font-weight: 600;
	padding: 6px 0;
}

/* Custom gradient header variant */
.cl86549393539 {
	background: linear-gradient(-45deg, #002d51, #4315cc, #002d51, #5d27ff);
	background-size: 400% 400%;
	animation: gradientMove 20s ease infinite;
	color: #fff;
}

.cl86549393539 .inside-header {
	padding: 10px;
}

.cl86549393539 a {
	text-decoration: none;
	color: #fff;
}

.cl86549393539 .hash786543929924 {
	margin: 0 10px;
	font-size: 25px;
	color: #ffea35;
	line-height: 1;
}


/*--------------------------------------------------------------
  17. Navigation
--------------------------------------------------------------*/
.main-navigation {
	z-index: 100;
	clear: both;
	display: block;
}

.main-navigation a {
	display: block;
	text-decoration: none;
	font-weight: 400;
	text-transform: none;
	font-size: 16px;
}

.main-navigation ul {
	display: flex;
	gap: 0.1rem;
	list-style: none;
	margin: 0;
	padding: 0;
	background: #fff;
	justify-content: center;
}

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

.main-navigation ul li a {
	text-decoration: none;
	color: #191a1c;
	font-weight: 600;
	padding: 0.3rem 0;
	font-size: 15px;
	transition: color 0.2s;
}

.main-navigation ul li a:hover,
.main-navigation ul li.current-menu-item a {
	color: #3b82f6;
	background: #f1f5f9;
}

.main-navigation .main-nav ul li a {
	padding-left: 15px;
	padding-right: 15px;
}

.inside-navigation {
	position: relative;
}

.main-navigation .inside-navigation {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: space-between;
}

.main-navigation .main-nav>ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.main-navigation li {
	position: relative;
}

.main-navigation .menu-bar-items {
	display: flex;
	align-items: center;
	font-size: 15px;
}

.main-navigation .menu-bar-items a {
	color: inherit;
}

.main-navigation .menu-bar-item {
	position: relative;
}

.main-navigation .menu-bar-item.search-item {
	z-index: 20;
}

.main-navigation .menu-bar-item>a {
	padding-left: 20px;
	padding-right: 20px;
	line-height: 60px;
}

/* Sidebar nav */
.sidebar .main-navigation .main-nav {
	flex-basis: 100%;
}

.sidebar .main-navigation .main-nav>ul {
	flex-direction: column;
}

.sidebar .main-navigation .menu-bar-items {
	margin: 0 auto;
}

.sidebar .main-navigation .menu-bar-items .search-item {
	order: 10;
}

/* Alignment variants */
.nav-align-center .inside-navigation {
	justify-content: center;
}

.nav-align-center .main-nav>ul {
	justify-content: center;
}

.nav-align-right .inside-navigation {
	justify-content: flex-end;
}

/* Dropdown menus */
.main-navigation ul ul {
	display: block;
	box-shadow: 3px 3px 5px #0000001a;
	float: left;
	position: absolute;
	left: -99999px;
	opacity: 0;
	z-index: 99999;
	width: 200px;
	text-align: left;
	top: auto;
	transition: opacity 80ms linear;
	transition-delay: 0s;
	pointer-events: none;
	height: 0;
	overflow: hidden;
}

.main-navigation ul ul a {
	display: block;
}

.main-navigation ul ul li {
	width: 100%;
}

.main-navigation .main-nav ul ul li a {
	line-height: normal;
	padding: 10px 20px;
	font-size: 14px;
	margin: 8px 0;
}

.main-navigation .main-nav ul li.menu-item-has-children>a {
	padding-right: 0;
	position: relative;
}

.main-navigation.sub-menu-left ul ul {
	box-shadow: -1px 1px 0 #0000001a;
}

.main-navigation.sub-menu-left .sub-menu {
	right: 0;
}

/* Hover open */
.main-navigation:not(.toggled) ul li:hover>ul,
.main-navigation:not(.toggled) ul li.sfHover>ul {
	left: auto;
	opacity: 1;
	transition-delay: 150ms;
	pointer-events: auto;
	height: auto;
	overflow: visible;
}

.main-navigation:not(.toggled) ul ul li:hover>ul,
.main-navigation:not(.toggled) ul ul li.sfHover>ul {
	left: 100%;
	top: 0;
}

.main-navigation.sub-menu-left:not(.toggled) ul ul li:hover>ul,
.main-navigation.sub-menu-left:not(.toggled) ul ul li.sfHover>ul {
	right: 100%;
	left: auto;
}

.nav-float-right .main-navigation ul ul ul {
	top: 0;
}

/* Dropdown toggle */
.menu-item-has-children .dropdown-menu-toggle {
	display: inline-block;
	height: 100%;
	clear: both;
	padding-right: 25px;
	padding-left: 10px;
}

.menu-item-has-children ul .dropdown-menu-toggle {
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: -10px;
}

nav ul ul .menu-item-has-children .dropdown-menu-toggle,
.sidebar .menu-item-has-children .dropdown-menu-toggle {
	float: right;
}

/* Sidebar nav hover */
.sidebar .main-navigation.sub-menu-right ul li:hover ul,
.sidebar .main-navigation.sub-menu-right ul li.sfHover ul {
	top: 0;
	left: 100%;
}

.sidebar .main-navigation.sub-menu-left ul li:hover ul,
.sidebar .main-navigation.sub-menu-left ul li.sfHover ul {
	top: 0;
	right: 100%;
}

/* Mobile toggle */
.menu-toggle,
.mobile-bar-items,
.sidebar-nav-mobile {
	display: none;
}

.menu-toggle {
	padding: 0 20px;
	line-height: 60px;
	margin: 0;
	font-weight: 400;
	text-transform: none;
	font-size: 20px;
	cursor: pointer;
}

.menu-toggle .mobile-menu {
	padding-left: 3px;
}

.menu-toggle .gp-icon+.mobile-menu {
	padding-left: 9px;
}

.menu-toggle .mobile-menu:empty {
	display: none;
}

.has-menu-bar-items button.menu-toggle {
	flex-grow: 0;
}

/* Toggled state */
nav.toggled ul ul.sub-menu {
	width: 100%;
}

.toggled .menu-item-has-children .dropdown-menu-toggle {
	padding-left: 25px;
}

.main-navigation.toggled .main-nav {
	flex-basis: 100%;
	order: 3;
}

.main-navigation.toggled .main-nav>ul {
	display: block;
}

.main-navigation.toggled .main-nav li {
	width: 100%;
	text-align: left;
}

.main-navigation.toggled .main-nav ul ul {
	transition: 0s;
	visibility: hidden;
	box-shadow: none;
	border-bottom: 1px solid #0000000d;
}

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

.main-navigation.toggled .main-nav ul ul.toggled-on {
	position: relative;
	top: 0;
	left: auto !important;
	right: auto !important;
	width: 100%;
	pointer-events: auto;
	height: auto;
	opacity: 1;
	display: block;
	visibility: visible;
	float: none;
}

.main-navigation.toggled .menu-item-has-children .dropdown-menu-toggle {
	float: right;
}

/* Mobile menu wrapper */
.mobile-menu-control-wrapper {
	margin-left: auto;
	align-items: center;
	text-align: right;
	float: right;
	display: flex;
}

.nav-float-left .mobile-menu-control-wrapper {
	order: -10;
	margin-left: 0;
	margin-right: auto;
	flex-direction: row-reverse;
}

.has-inline-mobile-toggle #site-navigation.toggled,
.has-inline-mobile-toggle #site-navigation.has-active-search {
	margin-top: 1.5em;
}

.has-inline-mobile-toggle #site-navigation.has-active-search .nav-search-active {
	position: relative;
}

.has-inline-mobile-toggle #site-navigation.has-active-search .navigation-search input {
	outline: auto;
}

/* GP Icons */
.gp-icon {
	display: inline-flex;
	align-self: center;
}

.gp-icon svg {
	height: 1em;
	width: 1em;
	top: 0.125em;
	position: relative;
	fill: currentColor;
}

.icon-menu-bars svg:nth-child(2),
.toggled .icon-menu-bars svg:nth-child(1),
.icon-search svg:nth-child(2),
.close-search .icon-search svg:nth-child(1) {
	display: none;
}

.toggled .icon-menu-bars svg:nth-child(2),
.close-search .icon-search svg:nth-child(2) {
	display: block;
}

.entry-meta .gp-icon {
	margin-right: 0.6em;
	opacity: 0.7;
}

nav.toggled .icon-arrow-left svg {
	transform: rotate(-90deg);
}

nav.toggled .icon-arrow-right svg {
	transform: rotate(90deg);
}

nav.toggled .sfHover>a>.dropdown-menu-toggle .gp-icon svg {
	transform: rotate(180deg);
}

nav.toggled .sfHover>a>.dropdown-menu-toggle .gp-icon.icon-arrow-left svg {
	transform: rotate(-270deg);
}

nav.toggled .sfHover>a>.dropdown-menu-toggle .gp-icon.icon-arrow-right svg {
	transform: rotate(270deg);
}

/* Widget nav */
.widget-area .main-navigation {
	margin-bottom: 20px;
}

.widget-area .main-navigation li {
	float: none;
	display: block;
	width: 100%;
	padding: 0;
	margin: 0;
}

/* Post navigation */
main .comment-navigation,
main .posts-navigation,
main .post-navigation {
	margin: 0 0 2em;
	overflow: hidden;
}

main .post-navigation {
	margin-bottom: 0;
}


/*--------------------------------------------------------------
  18. Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs-wrapper {
	font-size: 13px;
	margin-bottom: 15px;
	color: #246ca5;
	background: #f1f5f978;
	padding: 5px 10px;
	border-radius: 5px;
}

.yoast-breadcrumbs {
	font-size: 16px;
	font-weight: 500;
	color: #6b7280;
	margin-bottom: 1rem;
}

.yoast-breadcrumbs a {
	color: #144274;
	text-decoration: none;
}

.yoast-breadcrumbs a:hover {
	text-decoration: underline;
}

.yoast-breadcrumbs .breadcrumb_last {
	color: #3c63b5;
	font-weight: 600;
}

.yoast-breadcrumbs span {
	display: inline-block;
	margin: 0 5px;
}

.yoast-breadcrumbs span:first-child {
	margin-left: 0;
}


/*--------------------------------------------------------------
  19. Site Footer
--------------------------------------------------------------*/
.site-footer {
	background: #000;
	color: #fff;
	font-weight: 700;
}

.inside-site-info {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px 40px;
}

.site-info {
	text-align: center;
	font-size: 15px;
}


/*--------------------------------------------------------------
  20. Post / Entry
--------------------------------------------------------------*/
.single .entry-header {
	margin-bottom: 20px;
	margin-top: 0;
}

.entry-title {
	margin: 0;
}

.single .entry-title {
	margin-top: 0;
	font-size: 1.45rem;
}

.entry-meta {
	font-size: 13px;
	margin-top: 0.5em;
	font-weight: 500;
	color: #1465b7;
}

footer.entry-meta {
	margin-top: 2em;
}

.cat-links,
.tags-links,
.comments-link {
	display: block;
}

.byline,
.single .byline,
.group-blog .byline,
.entry-header .cat-links,
.entry-header .tags-links,
.entry-header .comments-link {
	display: inline;
}

footer.entry-meta .byline,
footer.entry-meta .posted-on {
	display: block;
}

.posted-on .updated,
.entry-header .gp-icon {
	display: none;
}

.taxonomy-description p:last-child,
.read-more-container,
.page-content>p:last-child,
.entry-content>p:last-child,
.entry-summary>p:last-child {
	margin-bottom: 0;
}

.taxonomy-description {
	font-size: 16px;
}

.entry-content {
	overflow-x: auto;
}

.author .page-header .page-title {
	display: flex;
	align-items: center;
}

.author .page-header .avatar {
	margin-right: 20px;
}

.page-header> :last-child,
.page-header .author-info> :last-child {
	margin-bottom: 0;
}

/* Archive / blog visibility helpers */
.blog .format-status .entry-title,
.archive .format-status .entry-title,
.blog .format-aside .entry-header,
.archive .format-aside .entry-header,
.blog .format-status .entry-header,
.archive .format-status .entry-header,
.blog .format-status .entry-meta,
.archive .format-status .entry-meta {
	display: none;
}

.blog .format-aside .entry-content,
.archive .format-aside .entry-content,
.blog .format-status .entry-content,
.archive .format-status .entry-content {
	margin-top: 0;
}

.blog .format-status .entry-content p:last-child,
.archive .format-status .entry-content p:last-child {
	margin-bottom: 0;
}

/* Page / archive headers */
main .page-header {
	display: block;
	width: 100%;
	text-transform: capitalize;
	font-size: 17px;
	padding: 0 !important;
}

main .page-header h1 {
	font-size: 30px;
	font-weight: 600;
	margin: 0 0 20px;
}

/* Post meta bar */
.post-meta {
	font-size: 0.875rem;
	color: #6b7280;
}

.post-meta span {
	margin-right: 1rem;
	display: inline-block;
}

/* Post tags */
.post-categories {
	position: absolute;
	top: 5px;
	left: 10px;
}

.post-categories a {
	text-decoration: none;
	border-radius: 50px;
	font-size: 11px;
	font-weight: bold;
	text-transform: capitalize;
	display: inline-block;
	background: #f1f5f9;
	padding: 1px 10px;
	margin-right: 5px;
	margin-bottom: 5px;
}

.single #main .post-categories {
	position: relative;
	padding: 0;
	left: unset;
	top: unset;
	margin: 26px 0;
}

/* Post excerpt */
.post-excerpt {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Single article images */
.page main article img,
.page main article .wp-caption,
.single main article img,
.single main article .wp-caption {
	max-width: 100% !important;
	width: 100% !important;
}

/* Single sidebar headings */
.single .inside-left-sidebar .wp-block-heading,
.single .inside-right-sidebar .wp-block-heading {
	margin-top: 0;
	font-size: 1.2rem;
}

.inside-right-sidebar .wp-block-heading {
	margin-top: 0;
}

.single #main html, 
.single #main body, 
.single #main p, 
.single #main ol, 
.single #main ul, 
.single #main li, 
.single #main dl, 
.single #main dt, 
.single #main dd, 
.single #main blockquote, 
.single #main figure, 
.single #main fieldset, 
.single #main legend, 
.single #main textarea, 
.single #main pre, 
.single #main iframe, 
.single #main hr,
.single #main p { 
	font-size: 18px;
	line-height: 1.8;
	color: #202b35;
}


/*--------------------------------------------------------------
  21. Archive / Blog Grid
--------------------------------------------------------------*/
.archive main,
.blog main,
.related-posts-grid {
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
	margin-right: -10px;
}

.related-posts-grid {
	margin-left: unset;
	margin-right: unset;
}

.ngrid-item {
	width: calc(25% - 10px);
	margin: 0 10px 40px 0;
	/* overflow-x: auto; */
	position: relative;
	border-radius: 3px;
	/* background: #ced5e126; */
	padding: 3px;
	/* box-shadow: 2px 3px 2px rgb(0 0 0 / 4%); */
	transition: box-shadow 0.15s ease, transform 0.15s ease;
}

.ngrid-item:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.ngrid-item h2 {
	font-size: 16px;
	/* line-height: 1.5; */
	color: #2f3437;
	margin: 5px 0px 0px;
}

.ngrid-item h2 a {
	color: #081727;
	text-decoration: none;
	font-weight: 700;
}

.ngrid-item .post-info {
	padding: 5px;
}

.ngrid-item .post-excerpt {
	display: none;
}

/* Related posts grid */
.related-posts-grid .ngrid-item {
	width: calc(49% - 13px);
	padding: 3px !important;
	background: #f1f5f99c !important;
	margin: 0 10px 10px 0;
}

.related-posts-grid .post-thumb.post-thumb68543210 {
	border-radius: 14px;
	overflow: hidden;
	background: white;
}

/* Archive / blog text */
.home .hentry p,
.archive .hentry p,
.blog .hentry p {
	text-align: left;
	font-size: 14px;
	letter-spacing: -0.1px;
}


/*--------------------------------------------------------------
  22. Sidebar & Widgets
--------------------------------------------------------------*/
.sidebar .widget:last-child,
.footer-widgets .widget:last-child {
	margin-bottom: 0;
}

.sidebar .widget :last-child,
.footer-widgets .widget :last-child {
	margin-bottom: 0;
}

.footer-widgets .widget {
	margin-bottom: 30px;
}

.widget-title,
.widget .widgettitle {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 1rem;
	margin-top: 0;
	line-height: 1.3;
	color: #1f2937;
	border-bottom: 1px solid #e5e7eb;
	padding-bottom: 0.5rem;
}

.widget .wp-block-heading {
	margin-bottom: 19px;
	border-bottom: 4px solid #edf7ff;
	padding-bottom: 0;
}

.widget ul,
.widget ol {
	margin: 0;
}

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

.widget .search-field {
	width: 100%;
}

.widget .search-form {
	display: flex;
}

.widget .search-form button.search-submit {
	font-size: 15px;
}

.widget ul li {
	list-style-type: none;
	position: relative;
	margin-bottom: 13px;
}

.widget ul li ul {
	margin-left: 1em;
	margin-top: 0.5em;
}

.widget li a {
	text-decoration: none;
	color: #1b1b1b;
	transition: color 0.2s;
	font-size: 15px;
}

.widget li a:hover {
	color: #2563eb;
}

/* Top tags widget */
.widget .top-tags {
	font-size: 15px;
	text-transform: capitalize;
}

.widget .top-tags li {
	border-bottom: 1px solid #e6e6e6;
}

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

.widget .top-tags li a {
	margin: 2px 0 !important;
	padding: 2px 0 !important;
	font-weight: 500;
	text-transform: uppercase;
	word-spacing: 1px;
	display: block;
}

/* Latest posts widget – custom counter */
.widget .wp-block-latest-posts {
	counter-reset: my-counter;
	list-style: none;
	padding-left: 8px;
}

.widget .wp-block-latest-posts li {
	counter-increment: my-counter;
	position: relative;
	padding-left: 15px;
}

.widget .wp-block-latest-posts li::before {
	content: counter(my-counter);
	position: absolute;
	left: -5px;
	top: -7px;
	font-weight: bold;
	text-align: right;
	color: var(--primary-color);
	font-size: 25px;
	opacity: 0.2;
}

.widget .wp-block-latest-posts li:last-child {
	border: none;
}

/* WP calendar */
.wp-calendar-table {
	table-layout: fixed;
}

/* Widget select */
.widget select {
	max-width: 100%;
}

/* WP block post template */
.wp-block-post-template {
	margin-left: 0;
}


/*--------------------------------------------------------------
  23. Comments
--------------------------------------------------------------*/
.comments-area {
	max-width: 600px;
	margin: 70px 0;
}

.comments-area p,
.comments-area textarea {
	margin-bottom: 5px;
}


.comment-list {
	margin-top: 2rem;
	padding-left: 0;
	list-style: none;
}

ol.comment-list {
	margin: 0;
}

.comment {
	border-bottom: 1px solid #e5e7eb;
	padding: 1rem 0;
	margin-bottom: 1rem;
	list-style: none;
}

.comment .comment-author {
	font-weight: 600;
	color: #1f2937;
}

.comment .comment-meta {
	font-size: 0.875rem;
	color: #6b7280;
	margin-bottom: 0.5rem;
}

.comment .comment-meta img {
	max-width: 60px;
	border-radius: 5px;
}

.comment .comment-content {
	font-size: 1rem;
	line-height: 1.6;
	color: #374151;
}

.comment .reply a {
	font-size: 0.875rem;
	color: #3b82f6;
	text-decoration: none;
}

.comment .reply a:hover {
	text-decoration: underline;
}

.children {
	margin-left: 1.5rem;
	border-left: 2px solid #e5e7eb;
	padding-left: 1rem;
}


/*--------------------------------------------------------------
  24. Pagination
--------------------------------------------------------------*/
.paging-navigation {
	display: block;
	width: 100%;
	margin: 30px 10px;
}

.paging-navigation .nav-previous,
.paging-navigation .nav-next {
	display: none;
}

.paging-navigation .nav-links>* {
	padding: 0 5px;
}

.paging-navigation .nav-links .current {
	font-weight: 700;
}

.nav-links> :first-child {
	padding-left: 0;
}

.nav-links .page-numbers {
	display: inline-block;
	padding: 7px 15px;
	background-color: #e5e7eb;
	color: #000;
	border-radius: 6px;
	min-width: 40px;
	text-align: center;
	font-weight: 500;
	text-decoration: none;
	transition: background 0.2s ease-in-out;
}

.nav-links .page-numbers:hover {
	background-color: #cbd5e1;
}

.nav-links .page-numbers.current {
	background-color: #3c83f6;
	color: #fff;
	font-weight: 700;
}


/*--------------------------------------------------------------
  25. TOC (EZ TOC Plugin)
--------------------------------------------------------------*/
div.ez-toc-widget-sticky-container ul.ez-toc-widget-sticky-list {
	padding: 0 !important;
	font-size: 15px;
}

div.ez-toc-widget-sticky-container ul.ez-toc-widget-sticky-list a {
	padding: 0;
}

div.ez-toc-widget-sticky-container ul.ez-toc-widget-sticky-list li {
	margin-bottom: 7px;
}

span.ez-toc-widget-sticky-title-container {
	font-size: 16px;
}

a.ez-toc-widget-sticky-pull-right.ez-toc-widget-sticky-btn.ez-toc-widget-sticky-btn-xs.ez-toc-widget-sticky-btn-default.ez-toc-widget-sticky-toggle {
	display: none;
}

/* GitBook-style sticky TOC */
#ez_toc_widget_sticky-2 {
	background: none;
	border: none;
	padding: 0;
	max-width: 300px;
	font-family: "Arial", sans-serif;
	position: sticky;
	top: 100px;
	z-index: 99;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-title {
	font-size: 1.1em;
	font-weight: 600;
	color: #111;
	margin-bottom: 12px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-list li {
	list-style: none;
	margin: 4px 0;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-list li a {
	display: block;
	font-size: 0.95em;
	font-weight: 400;
	color: #555;
	text-decoration: none;
	padding: 2px 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100%;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-list li.active>a {
	font-weight: 600;
	color: #000;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-list-level-3 {
	margin-left: 0;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-title-toggle svg {
	transition: transform 0.3s ease;
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-list.collapsed+.ez-toc-widget-sticky-title-toggle svg {
	transform: rotate(-90deg);
}

#ez_toc_widget_sticky-2 .ez-toc-widget-sticky-container nav ul li a::before {
	content: none !important;
	margin: 0 !important;
	float: none !important;
}


/*--------------------------------------------------------------
  26. Animations
--------------------------------------------------------------*/
@keyframes gradientShift {
	0% {
		background-position: 0 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0 50%;
	}
}

@keyframes gradientMove {
	0% {
		background-position: 0 50%;
	}

	50% {
		background-position: 50% 50%;
	}

	100% {
		background-position: 0 50%;
	}
}


/*--------------------------------------------------------------
  27. Responsive – Tablet (769px–1024px)
--------------------------------------------------------------*/
@media (min-width: 769px) and (max-width: 1024px) {
	.hide-on-tablet {
		display: none !important;
	}
}

@media (min-width: 1025px) {
	.hide-on-desktop {
		display: none !important;
	}
}


/*--------------------------------------------------------------
  28. Responsive – Mobile (≤768px)
--------------------------------------------------------------*/
@media (max-width: 768px) {

	html,
	body,
	p {
		font-size: 15px;
	}

	h1 {
		font-size: 2.2rem;
	}

	h2 {
		font-size: 1.8rem;
	}

	h3 {
		font-size: 1.5rem;
	}

	h4 {
		font-size: 1.2rem;
	}

	.hide-on-mobile {
		display: none !important;
	}

	.menu-item-has-children .dropdown-menu-toggle {
		background: #f6f9fc;
	}

	.site-header .header-widget {
		margin-top: 1.5em;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}

	.site-content {
		flex-direction: column;
	}

	.container .site-content .content-area {
		width: auto;
	}

	.is-left-sidebar.sidebar,
	.is-right-sidebar.sidebar {
		width: auto;
		order: initial;
	}

	.is-left-sidebar+.is-right-sidebar .inside-right-sidebar {
		margin-top: 0;
	}

	.both-right .inside-left-sidebar,
	.both-left .inside-left-sidebar,
	.both-right .inside-right-sidebar,
	.both-left .inside-right-sidebar {
		margin-right: 0;
		margin-left: 0;
	}

	body:not(.no-sidebar) #main {
		margin: 0;
	}

	.alignleft,
	.alignright {
		float: none;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.comment .children {
		padding-left: 10px;
		margin-left: 0;
	}

	.entry-meta {
		/* font-size: inherit; */
	}

	.entry-meta a {
		/* line-height: 1.8em; */
	}

	.is-right-sidebar {
		display: none;
	}

	/* Grid cards */
	.ngrid-item {
		width: 47%;
		margin: 20px 5px 5px;
		box-shadow: unset;
		background: no-repeat;
		padding: 0;
		overflow: unset;
	}

	.post-thumb a img, .post-thumb img{
		border-radius: 5px;
	}

	.ngrid-item h2 {
		font-size: 14px;
		margin: 0 !important;
	}

	.ngrid-item .post-info {
		padding: 2px;
	}

	/* Single post */
	.single .site-content {
		display: block;
	}

	.single .main-content {
		min-width: 0;
	}

	.single .inside-left-sidebar .wp-block-heading,
	.single .inside-right-sidebar .wp-block-heading {
		margin-top: 0;
		font-size: 1.2rem;
	}

	/* Header */
	.inside-header {
		display: block;
		padding: 20px;
	}

	.site-header .inside-header {
		padding: 10px;
	}

	.main-navigation .inside-navigation .menu-toggle {
		display: none;
	}

	button.menu-toggle {
		display: block;
		background: none;
		color: #000;
		line-height: unset;
	}

	.site-logo {
		max-width: 150px;
	}

	nav#site-navigation:not(.toggled) ul {
		display: none;
	}

	nav#site-navigation.toggled ul {
		display: block;
	}

	.main-navigation .main-nav ul li a {
		padding: 10px 0;
	}

	/* Content spacing */
	.site-content>div {
		margin: 10px;
	}

}



/* Search icon in nav */
.search-menu-item button {
	background: none;
	border: none;
	cursor: pointer;
	padding: 4px 8px;
	color: #191a1c;
	display: flex;
	align-items: center;
	border-radius: 6px;
	transition: background 0.15s;
}

.search-menu-item button:hover {
	background: #f1f5f9;
}

/* Modal overlay */
.search-modal {
	position: fixed;
	inset: 0;
	background: rgba(255,255,255,0.97);
	z-index: 9999;
	display: flex;
	align-items: flex-start;
	justify-content: center;
	padding-top: 15vh;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s, visibility 0.2s;
	backdrop-filter: blur(4px);
}

.search-modal.active {
	opacity: 1;
	visibility: visible;
}

.search-modal-close {
	position: absolute;
	top: 20px;
	right: 24px;
	background: none;
	border: none;
	font-size: 22px;
	cursor: pointer;
	color: #666;
	padding: 8px;
	border-radius: 6px;
	line-height: 1;
}

.search-modal-close:hover {
	background: #f1f5f9;
	color: #000;
}

.search-modal-inner {
	width: 100%;
	max-width: 600px;
	padding: 0 20px;
}

.search-modal-inner input[type="search"] {
	width: 100%;
	font-size: 1.5rem;
	border: none;
	border-bottom: 2px solid #000;
	border-radius: 0;
	background: transparent;
	padding: 12px 0;
	outline: none;
	color: #1a1a1a;
	margin-bottom: 1.5rem;
	box-shadow: none;
}

.search-modal-inner input[type="search"]:focus {
	border-color: var(--primary-color);
	box-shadow: none;
}

.search-popular {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 14px;
}

.search-popular span {
	color: #999;
	font-weight: 500;
}

.search-popular a {
	background: #f1f5f9;
	color: #333;
	padding: 4px 12px;
	border-radius: 50px;
	font-size: 13px;
	text-decoration: none;
	font-weight: 500;
	transition: background 0.15s;
}

.search-popular a:hover {
	background: var(--primary-color);
	color: #fff;
	text-decoration: none;
}



.search-icon-mobile {
	background: none;
	border: none;
	cursor: pointer;
	padding: 8px;
	color: #191a1c;
	display: flex;
	align-items: center;
	border-radius: 6px;
}

.search-icon-mobile:hover {
	background: #f1f5f9;
}

@media (min-width: 769px) {
	.search-icon-mobile { display: none; }
}

.search-icon-btn {
	background: none;
	border: none;
	cursor: pointer;
	padding: 8px;
	color: #191a1c;
	display: flex;
	align-items: center;
	border-radius: 6px;
	transition: background 0.15s;
}

.search-icon-btn:hover {
	background: #f1f5f9;
}



/* ===== ENTRY FOOTER CLEAN ===== */
/* .entry-meta {
	margin-top: 40px;
	padding-top: 20px;
	border-top: 1px solid #eee;
	font-size: 14px;
 } */
 
 /* remove ugly icons */
 .entry-meta .gp-icon {
	/* display: none; */
	color: #29689b;
	font-size: 15px;
	}
 
 /* ===== CATEGORIES ===== */
 .cat-links {
	display: block;
	margin-bottom: 15px;
	color: #777;
 }
 
 .cat-links a {
	display: inline-block;
	margin-right: 8px;
	padding: 4px 10px;
	font-size: 12px;
	background: #f5f5f5;
	border-radius: 6px;
	text-decoration: none;
	color: #444;
 }
 
 .cat-links a:hover {
	background: #eaeaea;
 }
 
 /* ===== TAGS ===== */
 .tags-links {
	display: block;
	margin-bottom: 25px;
 }
 
 .tags-links a {
	display: inline-block;
	margin: 7px 10px 0 0;
	padding: 2px 5px;
	font-size: 12px;
	/* background: #111; */
	/* color: #fff; */
	/* border-radius: 20px; */
	text-decoration: none;
	border-bottom: 2px solid #e5e5ec;
	text-transform: capitalize;
	}
 
 .tags-links a:hover {
	opacity: 0.8;
 }
 
 /* ===== NAVIGATION ===== */
 .post-navigation {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	border-top: 1px solid #eee;
	padding-top: 20px;
 }
 
 /* make both equal */
 .post-navigation > div {
	flex: 1;
 }
 
 /* card style */
 .post-navigation a {
	display: block;
	padding: 15px;
	border: 1px solid #dbe7f2;
	border-radius: 8px;
	text-decoration: none;
	transition: 0.2s;
	}
 
 .post-navigation a:hover {
	border-color: #ccc;
	background: #fafafa;
 }
 
 /* text styles */
 .post-navigation .prev a::before {
	content: "<< Previous";
	display: block;
	font-size: 11px;
	color: #777;
	margin-bottom: 5px;
 }
 
 .post-navigation .next a::before {
	content: "Next >>";
	display: block;
	font-size: 11px;
	color: #777;
	margin-bottom: 5px;
 }
 
 .post-navigation .prev {
	text-align: left;
 }
 
 .post-navigation .next {
	text-align: right;
 }
 
 .post-navigation a {
	font-size: 14px;
	color: #111;
	font-weight: 500;
 }
 
 /* remove duplicate arrow icons */
 .post-navigation .gp-icon {
	display: none;
 }





/* Example custom styling for your author box */
.custom-author-box {
	display: flex;
	padding: 20px;
	margin-top: 30px;
	background-color: #edf5ff4d;
	border-radius: 0px;
	border: 1px solid #dbefff;
}

.custom-author-box .author-avatar img {
	border-radius: 50%;
}

.custom-author-box .author-link {
	color: #007cba;
	text-decoration: none;
	font-weight: 500;
}

.custom-author-box .author-link:hover {
	text-decoration: underline;
}
.author-bio p{
	font-size: 16px !important;
}





/* Single Post Categories */
.cat658439_container {
    margin-bottom: 10px;
}

.cat6854320 {
    background: #d7eafa;
    border-radius: 5px;
    font-size: 12px;
    margin: 0px 10px 10px 0px;
    padding: 2px 10px;
    display: inline-block;
    text-decoration: none;
}

.cat6854320:hover {
    background: #c0d8f0;
}







/* Categories */
.post-categories-top {
	margin-bottom: 10px;
}

.post-category-link {
	background: #d7eafa;
	border-radius: 5px;
	font-size: 12px;
	margin: 0 10px 10px 0;
	padding: 2px 10px;
	display: inline-block;
	text-decoration: none;
}

.post-category-link:hover {
	background: #c0d8f0;
}

/* Author Box */
.custom-author-box {
	display: flex;
	padding: 30px;
	margin-top: 40px;
	background: #f6f9fc;
	border-radius: 8px;
	border: 1px solid #dbe7f2;
	gap: 20px;
}

.custom-author-box .author-avatar {
	flex-shrink: 0;
}

.custom-author-box .author-avatar img {
	border-radius: 50%;
	width: 100px;
	height: 100px;
	object-fit: cover;
}

.custom-author-box .author-info {
	flex: 1;
}

@media (max-width: 768px) {
	.custom-author-box {
		 flex-direction: column;
		 text-align: center;
	}
	.custom-author-box .author-avatar {
		 margin: 0 auto;
	}
}











/* Using CSS Grid - Most reliable */
/* Fallback for older browsers - always use grid */
.single .inside-article {
	display: grid;
	grid-template-areas: 
		 "header"
		 "content";
}

.single .inside-article > .entry-header {
	grid-area: header;
}

.single .inside-article > .entry-content {
	grid-area: content;
}

/* When image exists, add it to grid */
.single .inside-article:has(.featured-image) {
	grid-template-areas: 
		 "header"
		 "image"
		 "content";
}

.single .inside-article > .featured-image {
	grid-area: image;
}