/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/





/* =========================================================
   PROMPTJEE PROFESSIONAL HOMEPAGE
   GeneratePress Child Theme
========================================================= */


/* =========================================================
   VARIABLES
========================================================= */

.promptjee-homepage {

	--pj-primary: #635bff;
	--pj-primary-dark: #5148f4;

	--pj-dark: #101828;
	--pj-text: #172033;
	--pj-muted: #667085;
	--pj-light: #98a2b3;

	--pj-border: #eaecf0;

	--pj-bg: #f8fafc;

	--pj-radius: 20px;

	width: 100%;

	overflow: hidden;

	background: #ffffff;

	color: var(--pj-text);
}


/* =========================================================
   RESET INSIDE HOMEPAGE
========================================================= */

.promptjee-homepage *,
.promptjee-homepage *::before,
.promptjee-homepage *::after {

	box-sizing: border-box;
}

.promptjee-homepage a {

	text-decoration: none;
}

.promptjee-homepage img {

	max-width: 100%;
}


/* =========================================================
   CONTAINER
========================================================= */

.pj-container {

	width: min(1180px, calc(100% - 40px));

	margin-left: auto;
	margin-right: auto;
}


/* =========================================================
   HERO
========================================================= */

.pj-hero {

	position: relative;

	padding: 92px 0 86px;

	background:

		radial-gradient(
			circle at 82% 15%,
			rgba(99, 91, 255, .11),
			transparent 32%
		),

		radial-gradient(
			circle at 12% 82%,
			rgba(14, 165, 233, .08),
			transparent 32%
		),

		#f7f9fc;
}


.pj-hero-content {

	max-width: 900px;

	margin: 0 auto;

	text-align: center;
}


.pj-eyebrow,
.pj-label {

	display: inline-block;

	color: var(--pj-primary);

	font-size: 12px;

	font-weight: 800;

	letter-spacing: 1.7px;

	line-height: 1.4;

	text-transform: uppercase;
}


/* Hero heading */

.pj-hero h1 {

	max-width: 900px;

	margin: 18px auto 20px;

	color: var(--pj-dark);

	font-size: clamp(40px, 5vw, 64px);

	font-weight: 800;

	line-height: 1.07;

	letter-spacing: -2.3px;
}


.pj-hero-description {

	max-width: 730px;

	margin: 0 auto;

	color: var(--pj-muted);

	font-size: 18px;

	line-height: 1.7;
}


/* =========================================================
   SEARCH
========================================================= */

.pj-search-box {

	width: 100%;

	max-width: 680px;

	margin: 34px auto 0;
}


.pj-custom-search-form {

	width: 100%;

	height: 68px;

	display: flex;

	align-items: center;

	gap: 8px;

	padding: 7px;

	margin: 0;

	border: 1px solid #e4e7ec;

	border-radius: 17px;

	background: #ffffff;

	box-shadow:

		0 10px 30px rgba(16, 24, 40, .06),

		0 2px 6px rgba(16, 24, 40, .03);

	transition:

		border-color .2s ease,

		box-shadow .2s ease;
}


.pj-custom-search-form:focus-within {

	border-color: #b8b3ff;

	box-shadow:

		0 0 0 4px rgba(99, 91, 255, .07),

		0 12px 32px rgba(16, 24, 40, .07);
}


.pj-custom-search-form input[type="search"] {

	flex: 1;

	width: 100%;

	height: 54px;

	min-width: 0;

	margin: 0;

	padding: 0 14px 0 18px;

	border: 0 !important;

	outline: 0 !important;

	background: transparent !important;

	box-shadow: none !important;

	color: var(--pj-dark);

	font-family: inherit;

	font-size: 15px;

	font-weight: 400;

	line-height: 54px;

	-webkit-appearance: none;

	appearance: none;
}


.pj-custom-search-form input[type="search"]::placeholder {

	color: var(--pj-light);

	opacity: 1;
}


.pj-custom-search-form
input[type="search"]::-webkit-search-cancel-button {

	-webkit-appearance: none;

	appearance: none;
}


/* Search Button */

.pj-search-button {

	flex: 0 0 54px;

	width: 54px;

	height: 54px;

	display: flex;

	align-items: center;

	justify-content: center;

	padding: 0;

	margin: 0;

	border: 0 !important;

	border-radius: 13px;

	background: var(--pj-primary) !important;

	color: #ffffff !important;

	box-shadow: none !important;

	cursor: pointer;

	line-height: 1;

	transition:

		background .2s ease,

		transform .2s ease,

		box-shadow .2s ease;
}


.pj-search-button svg {

	display: block;

	width: 20px;

	height: 20px;

	color: #ffffff;
}


.pj-search-button:hover {

	background: var(--pj-primary-dark) !important;

	color: #ffffff !important;

	transform: translateY(-1px);

	box-shadow:

		0 7px 17px rgba(99, 91, 255, .25) !important;
}


.pj-search-button:active {

	transform: translateY(0);
}


.pj-search-button:focus-visible {

	outline: none !important;

	box-shadow:

		0 0 0 4px rgba(99, 91, 255, .18) !important;
}


/* =========================================================
   QUICK LINKS
========================================================= */

.pj-quick-links {

	display: flex;

	flex-wrap: wrap;

	align-items: center;

	justify-content: center;

	gap: 9px;

	margin-top: 21px;

	font-size: 14px;
}


.pj-quick-links > span {

	color: var(--pj-light);
}


.pj-quick-links a {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-height: 38px;

	padding: 0 14px;

	border: 1px solid #e4e7ec;

	border-radius: 20px;

	background: rgba(255, 255, 255, .88);

	color: #475467;

	font-size: 13px;

	font-weight: 500;

	transition:

		color .2s ease,

		border-color .2s ease,

		background .2s ease,

		transform .2s ease;
}


.pj-quick-links a:hover {

	border-color: #c9c5ff;

	background: #ffffff;

	color: var(--pj-primary);

	transform: translateY(-1px);
}


/* =========================================================
   GENERAL SECTION
========================================================= */

.pj-section {

	padding: 86px 0;
}


.pj-section-heading {

	max-width: 720px;

	margin-bottom: 42px;
}


.pj-section-heading h2 {

	margin: 10px 0 12px;

	color: var(--pj-dark);

	font-size: clamp(30px, 4vw, 42px);

	font-weight: 750;

	line-height: 1.15;

	letter-spacing: -1.1px;
}


.pj-section-heading p {

	max-width: 680px;

	margin: 0;

	color: var(--pj-muted);

	font-size: 16px;

	line-height: 1.7;
}


/* =========================================================
   AI CREATION
========================================================= */

.pj-creation-section {

	background: #ffffff;
}


.pj-creation-grid {

	display: grid;

	grid-template-columns: repeat(2, 1fr);

	gap: 22px;
}


.pj-creation-card {

	position: relative;

	display: flex;

	align-items: flex-start;

	gap: 23px;

	padding: 34px;

	min-height: 235px;

	overflow: hidden;

	border: 1px solid var(--pj-border);

	border-radius: 23px;

	background: #ffffff;

	box-shadow:

		0 8px 28px rgba(16, 24, 40, .035);

	transition:

		transform .25s ease,

		box-shadow .25s ease,

		border-color .25s ease;
}


.pj-creation-card::after {

	content: "";

	position: absolute;

	width: 150px;

	height: 150px;

	right: -60px;

	top: -60px;

	border-radius: 50%;

	background: rgba(99, 91, 255, .055);

	pointer-events: none;
}


.pj-creation-card:hover {

	transform: translateY(-5px);

	border-color: #d9d6ff;

	box-shadow:

		0 18px 42px rgba(16, 24, 40, .08);
}


.pj-creation-icon {

	flex: 0 0 57px;

	width: 57px;

	height: 57px;

	display: flex;

	align-items: center;

	justify-content: center;

	border-radius: 16px;

	background: #f1efff;

	color: var(--pj-primary);

	font-size: 25px;

	font-weight: 800;
}


.pj-video-card .pj-creation-icon {

	background: #eef8ff;

	color: #0284c7;
}


.pj-creation-content {

	position: relative;

	z-index: 1;
}


.pj-small-label {

	display: block;

	margin-bottom: 7px;

	color: var(--pj-light);

	font-size: 10px;

	font-weight: 800;

	letter-spacing: 1.1px;

	text-transform: uppercase;
}


.pj-creation-card h3 {

	margin: 0 0 10px;

	color: var(--pj-dark);

	font-size: 24px;

	line-height: 1.25;
}


.pj-creation-card p {

	margin: 0 0 19px;

	color: var(--pj-muted);

	font-size: 15px;

	line-height: 1.65;
}


.pj-arrow-link {

	color: var(--pj-primary);

	font-size: 14px;

	font-weight: 700;
}


.pj-arrow-link span {

	margin-left: 4px;

	transition: margin .2s ease;
}


.pj-creation-card:hover
.pj-arrow-link span {

	margin-left: 8px;
}


/* =========================================================
   AI MODELS
========================================================= */

.pj-model-section {

	background: #f8fafc;
}


.pj-model-grid {

	display: grid;

	grid-template-columns: repeat(4, 1fr);

	gap: 18px;
}


.pj-model-card {

	display: block;

	padding: 27px 24px;

	border: 1px solid var(--pj-border);

	border-radius: 19px;

	background: #ffffff;

	transition:

		transform .25s ease,

		border-color .25s ease,

		box-shadow .25s ease;
}


.pj-model-card:hover {

	transform: translateY(-5px);

	border-color: #d9d6ff;

	box-shadow:

		0 15px 35px rgba(16, 24, 40, .07);
}


.pj-model-logo {

	width: 47px;

	height: 47px;

	display: flex;

	align-items: center;

	justify-content: center;

	margin-bottom: 20px;

	border-radius: 13px;

	background: var(--pj-dark);

	color: #ffffff;

	font-size: 20px;

	font-weight: 800;
}


.pj-model-card h3 {

	margin: 0 0 9px;

	color: var(--pj-dark);

	font-size: 18px;

	line-height: 1.35;
}


.pj-model-card p {

	margin: 0 0 19px;

	color: var(--pj-muted);

	font-size: 14px;

	line-height: 1.6;
}


.pj-model-card > span {

	color: var(--pj-primary);

	font-size: 13px;

	font-weight: 700;
}


/* =========================================================
   PURPOSE
========================================================= */

.pj-purpose-section {

	background: #ffffff;
}


.pj-purpose-grid {

	display: grid;

	grid-template-columns: repeat(5, 1fr);

	gap: 15px;
}


.pj-purpose-card {

	position: relative;

	display: flex;

	flex-direction: column;

	min-height: 210px;

	padding: 23px;

	border: 1px solid var(--pj-border);

	border-radius: 19px;

	background: #ffffff;

	transition:

		transform .25s ease,

		border-color .25s ease,

		box-shadow .25s ease;
}


.pj-purpose-card:hover {

	transform: translateY(-5px);

	border-color: #d9d6ff;

	box-shadow:

		0 15px 35px rgba(16, 24, 40, .07);
}


.pj-purpose-icon {

	width: 45px;

	height: 45px;

	display: flex;

	align-items: center;

	justify-content: center;

	margin-bottom: 20px;

	border-radius: 13px;

	background: #f6f5ff;

	color: var(--pj-primary);

	font-size: 21px;
}


.pj-purpose-body h3 {

	margin: 0 0 8px;

	color: var(--pj-dark);

	font-size: 18px;

	line-height: 1.35;
}


.pj-purpose-body p {

	margin: 0;

	color: var(--pj-muted);

	font-size: 13px;

	line-height: 1.6;
}


.pj-purpose-arrow {

	margin-top: auto;

	padding-top: 17px;

	color: var(--pj-primary);

	font-size: 18px;

	font-weight: 700;
}


/* =========================================================
   LATEST PROMPTS
========================================================= */

.pj-latest-section {

	background: #f8fafc;
}


.pj-post-grid {

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	gap: 23px;
}


.pj-post-card {

	overflow: hidden;

	border: 1px solid var(--pj-border);

	border-radius: 19px;

	background: #ffffff;

	transition:

		transform .25s ease,

		box-shadow .25s ease;
}


.pj-post-card:hover {

	transform: translateY(-5px);

	box-shadow:

		0 15px 35px rgba(16, 24, 40, .08);
}


.pj-post-image {

	display: block;

	aspect-ratio: 16 / 9;

	overflow: hidden;

	background: #f2f4f7;
}


.pj-post-image img {

	display: block;

	width: 100%;

	height: 100%;

	object-fit: cover;

	transition: transform .35s ease;
}


.pj-post-card:hover
.pj-post-image img {

	transform: scale(1.04);
}


.pj-no-image {

	width: 100%;

	height: 100%;

	display: flex;

	align-items: center;

	justify-content: center;

	background:

		linear-gradient(
			135deg,
			#f3f1ff,
			#f8fafc
		);

	color: #98a2b3;

	font-size: 11px;

	font-weight: 800;

	letter-spacing: 1px;
}


.pj-post-content {

	padding: 22px;
}


.pj-post-category {

	display: inline-block;

	margin-bottom: 10px;

	color: var(--pj-primary);

	font-size: 11px;

	font-weight: 800;

	letter-spacing: .7px;

	line-height: 1.4;

	text-transform: uppercase;
}


.pj-post-content h3 {

	margin: 0 0 10px;

	font-size: 19px;

	line-height: 1.4;
}


.pj-post-content h3 a {

	color: var(--pj-dark);
}


.pj-post-content h3 a:hover {

	color: var(--pj-primary);
}


.pj-post-content p {

	margin: 0 0 17px;

	color: var(--pj-muted);

	font-size: 14px;

	line-height: 1.65;
}


.pj-read-more {

	color: var(--pj-primary);

	font-size: 13px;

	font-weight: 700;
}


.pj-read-more:hover {

	color: var(--pj-primary-dark);
}


.pj-empty-posts {

	grid-column: 1 / -1;

	padding: 45px;

	border: 1px solid var(--pj-border);

	border-radius: 18px;

	background: #ffffff;

	text-align: center;
}


.pj-empty-posts h3 {

	margin: 0 0 8px;

	color: var(--pj-dark);
}


.pj-empty-posts p {

	margin: 0;

	color: var(--pj-muted);
}


/* =========================================================
   HOW IT WORKS
========================================================= */

.pj-how-section {

	background: #ffffff;
}


.pj-how-wrapper {

	display: grid;

	grid-template-columns: .85fr 1.15fr;

	gap: 80px;

	align-items: center;
}


.pj-how-intro h2 {

	margin: 12px 0 15px;

	color: var(--pj-dark);

	font-size: clamp(30px, 4vw, 42px);

	line-height: 1.15;

	letter-spacing: -1px;
}


.pj-how-intro p {

	max-width: 540px;

	margin: 0;

	color: var(--pj-muted);

	font-size: 16px;

	line-height: 1.7;
}


.pj-steps {

	display: grid;

	gap: 0;
}


.pj-step {

	display: grid;

	grid-template-columns: 60px 1fr;

	gap: 20px;

	padding: 23px 0;

	border-bottom: 1px solid var(--pj-border);
}


.pj-step:first-child {

	padding-top: 0;
}


.pj-step:last-child {

	border-bottom: 0;
}


.pj-step-number {

	width: 48px;

	height: 48px;

	display: flex;

	align-items: center;

	justify-content: center;

	border-radius: 13px;

	background: #f1efff;

	color: var(--pj-primary);

	font-size: 12px;

	font-weight: 800;
}


.pj-step h3 {

	margin: 0 0 7px;

	color: var(--pj-dark);

	font-size: 18px;
}


.pj-step p {

	margin: 0;

	color: var(--pj-muted);

	font-size: 14px;

	line-height: 1.6;
}


/* =========================================================
   WHY
========================================================= */

.pj-why-section {

	background: #f8fafc;
}


.pj-benefit-grid {

	display: grid;

	grid-template-columns: repeat(4, 1fr);

	gap: 0;
}


.pj-benefit {

	padding: 0 25px;

	border-right: 1px solid var(--pj-border);
}


.pj-benefit:first-child {

	padding-left: 0;
}


.pj-benefit:last-child {

	padding-right: 0;

	border-right: 0;
}


.pj-benefit-number {

	margin-bottom: 15px;

	color: var(--pj-primary);

	font-size: 12px;

	font-weight: 800;

	letter-spacing: .5px;
}


.pj-benefit h3 {

	margin: 0 0 9px;

	color: var(--pj-dark);

	font-size: 19px;

	line-height: 1.35;
}


.pj-benefit p {

	margin: 0;

	color: var(--pj-muted);

	font-size: 14px;

	line-height: 1.65;
}


/* =========================================================
   SEO SUPPORTING CONTENT
========================================================= */

.pj-about-section {

	padding-top: 72px;

	padding-bottom: 72px;

	background: #ffffff;
}


.pj-about-content {

	max-width: 850px;
}


.pj-about-content h2 {

	margin: 11px 0 18px;

	color: var(--pj-dark);

	font-size: clamp(27px, 3.5vw, 38px);

	line-height: 1.2;

	letter-spacing: -.8px;
}


.pj-about-content p {

	margin: 0 0 15px;

	color: var(--pj-muted);

	font-size: 15px;

	line-height: 1.8;
}


.pj-about-content p:last-child {

	margin-bottom: 0;
}


.pj-about-content a {

	color: var(--pj-primary);

	font-weight: 600;

	text-decoration: underline;

	text-decoration-color: rgba(99,91,255,.25);

	text-underline-offset: 3px;
}


.pj-about-content a:hover {

	color: var(--pj-primary-dark);
}


/* =========================================================
   PRIMARY BUTTON
========================================================= */

.pj-primary-button {

	display: inline-flex;

	align-items: center;

	justify-content: center;

	min-height: 48px;

	padding: 0 22px;

	border-radius: 11px;

	background: var(--pj-primary);

	color: #ffffff !important;

	font-size: 14px;

	font-weight: 700;

	line-height: 1.3;

	transition:

		background .2s ease,

		transform .2s ease,

		box-shadow .2s ease;
}


.pj-primary-button:hover {

	background: var(--pj-primary-dark);

	color: #ffffff !important;

	transform: translateY(-2px);

	box-shadow:

		0 8px 18px rgba(99,91,255,.22);
}


/* =========================================================
   FINAL CTA
========================================================= */

.pj-final-cta {

	padding: 90px 0;

	background:

		radial-gradient(
			circle at 50% 0%,
			rgba(99,91,255,.17),
			transparent 43%
		),

		#f7f8ff;
}


.pj-final-cta-inner {

	max-width: 760px;

	margin: 0 auto;

	text-align: center;
}


.pj-final-cta h2 {

	margin: 12px 0;

	color: var(--pj-dark);

	font-size: clamp(32px, 4vw, 48px);

	line-height: 1.15;

	letter-spacing: -1px;
}


.pj-final-cta p {

	max-width: 620px;

	margin: 0 auto 28px;

	color: var(--pj-muted);

	font-size: 16px;

	line-height: 1.7;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

	.pj-model-grid {

		grid-template-columns: repeat(2, 1fr);
	}

	.pj-purpose-grid {

		grid-template-columns: repeat(3, 1fr);
	}

	.pj-post-grid {

		grid-template-columns: repeat(2, 1fr);
	}

	.pj-how-wrapper {

		grid-template-columns: 1fr;

		gap: 45px;
	}

	.pj-benefit-grid {

		grid-template-columns: repeat(2, 1fr);

		row-gap: 35px;
	}

	.pj-benefit {

		padding: 0 20px;

		border-right: 0;
	}

	.pj-benefit:nth-child(odd) {

		padding-left: 0;
	}

	.pj-benefit:nth-child(even) {

		padding-right: 0;
	}

}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 760px) {

	.pj-creation-grid {

		grid-template-columns: 1fr;
	}

	.pj-purpose-grid {

		grid-template-columns: repeat(2, 1fr);
	}

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

	.pj-container {

		width: min(100% - 28px, 1180px);
	}


	/* Hero */

	.pj-hero {

		padding: 62px 0;
	}


	.pj-hero h1 {

		margin-top: 16px;

		font-size: 38px;

		line-height: 1.08;

		letter-spacing: -1.4px;
	}


	.pj-hero-description {

		font-size: 16px;

		line-height: 1.65;
	}


	/* Search */

	.pj-search-box {

		margin-top: 28px;
	}


	.pj-custom-search-form {

		height: 62px;

		padding: 6px;

		border-radius: 15px;
	}


	.pj-custom-search-form input[type="search"] {

		height: 50px;

		padding: 0 10px 0 14px;

		font-size: 14px;

		line-height: 50px;
	}


	.pj-search-button {

		flex: 0 0 50px;

		width: 50px;

		height: 50px;

		border-radius: 12px;
	}


	.pj-search-button svg {

		width: 19px;

		height: 19px;
	}


	/* Popular */

	.pj-quick-links {

		margin-top: 17px;

		gap: 7px;
	}


	.pj-quick-links > span {

		width: 100%;

		margin-bottom: 2px;
	}


	.pj-quick-links a {

		min-height: 35px;

		padding: 0 11px;

		font-size: 12px;
	}


	/* Sections */

	.pj-section {

		padding: 60px 0;
	}


	.pj-section-heading {

		margin-bottom: 30px;
	}


	.pj-section-heading h2 {

		font-size: 30px;

		letter-spacing: -.7px;
	}


	.pj-section-heading p {

		font-size: 15px;
	}


	/* Creation */

	.pj-creation-grid {

		grid-template-columns: 1fr;
	}


	.pj-creation-card {

		min-height: auto;

		padding: 25px;

		gap: 17px;
	}


	.pj-creation-icon {

		flex: 0 0 48px;

		width: 48px;

		height: 48px;

		font-size: 20px;
	}


	.pj-creation-card h3 {

		font-size: 21px;
	}


	/* Models */

	.pj-model-grid {

		grid-template-columns: 1fr;
	}


	/* Purpose */

	.pj-purpose-grid {

		grid-template-columns: 1fr;
	}


	.pj-purpose-card {

		min-height: auto;

		padding: 21px;
	}


	/* Posts */

	.pj-post-grid {

		grid-template-columns: 1fr;
	}


	/* How */

	.pj-how-wrapper {

		gap: 35px;
	}


	.pj-step {

		grid-template-columns: 52px 1fr;

		gap: 15px;
	}


	.pj-step-number {

		width: 44px;

		height: 44px;
	}


	/* Benefits */

	.pj-benefit-grid {

		grid-template-columns: 1fr;

		gap: 0;
	}


	.pj-benefit,
	.pj-benefit:first-child,
	.pj-benefit:nth-child(odd),
	.pj-benefit:nth-child(even),
	.pj-benefit:last-child {

		padding: 0 0 23px;

		margin-bottom: 23px;

		border-right: 0;

		border-bottom: 1px solid var(--pj-border);
	}


	.pj-benefit:last-child {

		margin-bottom: 0;

		border-bottom: 0;
	}


	/* About */

	.pj-about-section {

		padding: 55px 0;
	}


	/* CTA */

	.pj-final-cta {

		padding: 65px 0;
	}


	.pj-final-cta h2 {

		font-size: 32px;
	}

}










































/* =========================================================
   PROMPTJEE SINGLE POST - UPDATED
========================================================= */

.promptjee-single-page {

	--pj-primary: #635bff;
	--pj-primary-dark: #5148f4;
	--pj-dark: #101828;
	--pj-text: #172033;
	--pj-muted: #667085;
	--pj-light: #98a2b3;
	--pj-border: #eaecf0;

	width: 100%;
	background: #fff;
	color: var(--pj-text);
}

.promptjee-single-page *,
.promptjee-single-page *::before,
.promptjee-single-page *::after {
	box-sizing: border-box;
}

.promptjee-single-page a {
	text-decoration: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.pj-single-container {
	width: min(1200px, calc(100% - 40px));
	margin: 0 auto;
}


/* =========================================================
   LAYOUT
========================================================= */

.pj-single-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 310px;
	gap: 42px;
	align-items: start;
	padding: 42px 0 70px;
}

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


/* =========================================================
   BREADCRUMB
========================================================= */

.pj-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin-bottom: 23px;
	color: var(--pj-light);
	font-size: 12px;
}

.pj-breadcrumb a {
	color: #667085;
}

.pj-breadcrumb a:hover {
	color: var(--pj-primary);
}

.pj-breadcrumb-current {
	max-width: 350px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}


/* =========================================================
   HEADER
========================================================= */

.pj-post-header {
	margin-bottom: 27px;
}

.pj-post-category-label {
	display: inline-flex;
	align-items: center;
	padding: 7px 11px;
	border-radius: 20px;
	background: #f1efff;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .7px;
	text-transform: uppercase;
}

.pj-post-title {
	max-width: 950px;
	margin: 16px 0 19px;
	color: var(--pj-dark);
	font-size: clamp(34px, 4.5vw, 52px);
	font-weight: 800;
	line-height: 1.1;
	letter-spacing: -1.7px;
}


/* =========================================================
   AUTHOR + SHARE
========================================================= */

.pj-post-author-share {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 17px;
}

.pj-author-box {
	display: flex;
	align-items: center;
	gap: 11px;
}

.pj-author-avatar {
	width: 46px;
	height: 46px;
	flex: 0 0 46px;
	overflow: hidden;
	border-radius: 50%;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #e4e7ec;
}

.pj-author-avatar img,
.pj-author-avatar-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.pj-author-label {
	margin-bottom: 2px;
	color: var(--pj-light);
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .6px;
}

.pj-author-name {
	display: flex;
	align-items: center;
	gap: 5px;
}

.pj-author-name a {
	color: var(--pj-dark);
	font-size: 14px;
	font-weight: 750;
}

.pj-author-name a:hover {
	color: var(--pj-primary);
}

.pj-verified-badge {
	width: 17px;
	height: 17px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #1877f2;
}

.pj-verified-badge svg {
	display: block;
}


/* POST SHARE */

.pj-post-share-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 42px;
	padding: 0 15px;
	border: 1px solid #e1defe;
	border-radius: 10px;
	background: #f8f7ff;
	color: var(--pj-primary);
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: .2s ease;
}

.pj-post-share-button:hover {
	background: #efedff;
	border-color: #cbc7ff;
	transform: translateY(-1px);
}

.pj-post-share-button.is-shared {
	background: #effaf2;
	border-color: #b8e2c6;
	color: #18743a;
}


/* =========================================================
   POST META
========================================================= */

.pj-post-meta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	color: var(--pj-light);
	font-size: 12px;
	line-height: 1.5;
}

.pj-post-meta-row strong {
	color: #667085;
	font-weight: 600;
}

.pj-meta-dot {
	color: #d0d5dd;
}


/* =========================================================
   FEATURED IMAGE
========================================================= */

.pj-featured-image {
	margin: 0 0 30px;
	overflow: hidden;
	border-radius: 20px;
	background: #f2f4f7;
}

.pj-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 620px;
	object-fit: cover;
}


/* =========================================================
   INTRO
========================================================= */

.pj-intro-section {
	margin-bottom: 17px;
	padding: 27px 29px;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	background: linear-gradient(135deg, #fbfbff, #fff);
}

.pj-intro-label {
	margin-bottom: 10px;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.pj-intro-text {
	color: #475467;
	font-size: 17px;
	line-height: 1.75;
}

.pj-intro-text p {
	margin: 0;
}


/* =========================================================
   READ FULL
========================================================= */

.pj-read-full-wrapper {
	margin-bottom: 30px;
}

.pj-read-full-button {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 42px;
	padding: 0 16px;
	border: 1px solid #ddd9ff;
	border-radius: 10px;
	background: #fff;
	color: var(--pj-primary);
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: .2s ease;
}

.pj-read-full-button:hover {
	background: #f7f6ff;
	border-color: #c9c5ff;
	transform: translateY(-1px);
}

.pj-read-full-icon {
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 6px;
	background: #f1efff;
	font-size: 16px;
}

.pj-full-article {
	margin-bottom: 38px;
	border: 1px solid var(--pj-border);
	border-radius: 18px;
	overflow: hidden;
}

.pj-full-article-inner {
	padding: 30px;
	color: #475467;
	font-size: 16px;
	line-height: 1.8;
}

.pj-full-article-inner h2,
.pj-full-article-inner h3,
.pj-full-article-inner h4 {
	color: var(--pj-dark);
	line-height: 1.35;
}

.pj-full-article-inner a {
	color: var(--pj-primary);
	font-weight: 600;
}


/* =========================================================
   PROMPT HEADING
========================================================= */

.pj-prompts-heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 25px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--pj-border);
}

.pj-prompts-heading h2 {
	margin: 7px 0 6px;
	color: var(--pj-dark);
	font-size: 32px;
	line-height: 1.2;
	letter-spacing: -.7px;
}

.pj-prompts-heading p {
	margin: 0;
	color: var(--pj-muted);
	font-size: 14px;
	line-height: 1.6;
}

.pj-label {
	display: inline-block;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.3px;
	text-transform: uppercase;
}

.pj-prompt-count {
	min-width: 78px;
	padding: 10px 13px;
	border: 1px solid #e1defe;
	border-radius: 11px;
	background: #f7f6ff;
	color: var(--pj-primary);
	font-size: 18px;
	font-weight: 800;
	text-align: center;
}

.pj-prompt-count span {
	display: block;
	margin-top: 2px;
	color: #8b87b9;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
}


/* =========================================================
   PROMPT CARD
========================================================= */

.pj-prompt-list {
	display: grid;
	gap: 22px;
}

.pj-prompt-card {
	overflow: hidden;
	border: 1px solid #e4e7ec;
	border-radius: 20px;
	background: #fff;
	box-shadow: 0 5px 20px rgba(16,24,40,.035);
	transition: .2s ease;
}

.pj-prompt-card:hover {
	border-color: #d8d4ff;
	box-shadow: 0 12px 32px rgba(16,24,40,.07);
}

.pj-prompt-card-header {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 19px 21px;
	border-bottom: 1px solid #f0f1f3;
	background: #fbfbfd;
}


/* PROMPT NUMBER */

.pj-prompt-number {
	flex: 0 0 auto;
	min-height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 11px;
	border-radius: 9px;
	background: #f1efff;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .3px;
}

.pj-prompt-title-wrap {
	min-width: 0;
}

.pj-prompt-title-wrap h3 {
	margin: 0;
	color: var(--pj-dark);
	font-size: 18px;
	line-height: 1.35;
}


/* =========================================================
   PROMPT IMAGE + SHARE
========================================================= */

.pj-prompt-image-wrap {
	padding: 18px 21px 0;
}

.pj-prompt-image {
	overflow: hidden;
	border-radius: 13px;
	background: #f8fafc;
}

.pj-prompt-image img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 650px;
	object-fit: contain;
}


/* IMAGE SHARE BUTTON */

.pj-image-share-button {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 10px;
	min-height: 36px;
	padding: 0 13px;
	border: 1px solid #e1defe;
	border-radius: 9px;
	background: #f8f7ff;
	color: var(--pj-primary);
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	transition: .2s ease;
}

.pj-image-share-button:hover {
	background: #efedff;
	border-color: #c9c5ff;
	transform: translateY(-1px);
}

.pj-image-share-button.is-shared {
	background: #effaf2;
	border-color: #b8e2c6;
	color: #18743a;
}


/* AFTER SHARE */

.pj-image-share-result {
	margin-top: 10px;
	padding: 14px 15px;
	border: 1px solid #e5e7eb;
	border-radius: 11px;
	background: #fafbfc;
}

.pj-shared-title {
	margin-bottom: 5px;
	color: var(--pj-dark);
	font-size: 13px;
	font-weight: 750;
	line-height: 1.45;
}

.pj-shared-url {
	margin-bottom: 7px;
	overflow-wrap: anywhere;
}

.pj-shared-url a {
	color: #667085;
	font-size: 11px;
	line-height: 1.5;
}

.pj-shared-url a:hover {
	color: var(--pj-primary);
}

.pj-shared-home-link {
	display: inline-flex;
	align-items: center;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
}


/* =========================================================
   BEST FOR
========================================================= */

.pj-best-for {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 7px;
	margin: 18px 21px 0;
	padding: 13px 15px;
	border-left: 3px solid var(--pj-primary);
	border-radius: 0 10px 10px 0;
	background: #f8f7ff;
	color: #667085;
	font-size: 13px;
	line-height: 1.6;
}

.pj-best-for strong {
	color: var(--pj-dark);
	font-weight: 750;
}


/* =========================================================
   PROMPT BOX
========================================================= */

.pj-prompt-box {
	margin: 18px 21px 21px;
	overflow: hidden;
	border: 1px solid #e2e4e8;
	border-radius: 14px;
	background: #f8fafc;
}

.pj-prompt-box-top,
.pj-negative-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 11px 14px;
	border-bottom: 1px solid #e2e4e8;
	background: #f1f3f6;
}

.pj-prompt-box-top > span {
	color: #667085;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 1px;
}

.pj-copy-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 32px;
	padding: 0 10px;
	border: 1px solid #d9dce1;
	border-radius: 8px;
	background: #fff;
	color: #475467;
	font-family: inherit;
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
}

.pj-copy-button:hover {
	border-color: #c9c5ff;
	background: #f7f6ff;
	color: var(--pj-primary);
}

.pj-copy-button.is-copied {
	border-color: #b8e2c6;
	background: #effaf2;
	color: #18743a;
}

.pj-prompt-text {
	padding: 20px;
	color: #263043;
	font-size: 14px;
	line-height: 1.75;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}


/* =========================================================
   NEGATIVE PROMPT
========================================================= */

.pj-negative-box {
	margin: 0 21px 21px;
	overflow: hidden;
	border: 1px solid #eadfe2;
	border-radius: 14px;
	background: #fffafb;
}

.pj-negative-top {
	border-bottom-color: #eadfe2;
	background: #fdf5f7;
}

.pj-negative-top h4 {
	margin: 0;
	color: #6f4651;
	font-size: 12px;
}

.pj-negative-text {
	padding: 17px 20px;
	color: #715660;
	font-size: 13px;
	line-height: 1.7;
	white-space: pre-wrap;
	overflow-wrap: anywhere;
}


/* =========================================================
   SIDEBAR
========================================================= */

.pj-single-sidebar {
	position: sticky;
	top: 25px;
	display: grid;
	gap: 20px;
}

.pj-sidebar-card {
	padding: 20px;
	border: 1px solid var(--pj-border);
	border-radius: 17px;
	background: #fff;
	box-shadow: 0 5px 20px rgba(16,24,40,.035);
}

.pj-sidebar-title {
	margin-bottom: 17px;
	color: var(--pj-dark);
	font-size: 17px;
	font-weight: 750;
}

.pj-sidebar-search-form {
	display: flex;
	align-items: center;
	height: 45px;
	padding: 4px;
	border: 1px solid #e4e7ec;
	border-radius: 10px;
}

.pj-sidebar-search-form input[type="search"] {
	flex: 1;
	width: 100%;
	height: 35px;
	min-width: 0;
	padding: 0 8px;
	border: 0 !important;
	outline: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	font-family: inherit;
	font-size: 13px;
}

.pj-sidebar-search-form button {
	width: 36px;
	height: 36px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 36px;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: var(--pj-primary);
	color: #fff;
	cursor: pointer;
}

.pj-sidebar-group-title {
	margin: 18px 0 7px;
	color: var(--pj-light);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.pj-sidebar-links {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pj-sidebar-links li {
	margin: 0;
	padding: 0;
	border-bottom: 1px solid #f0f1f3;
}

.pj-sidebar-links li:last-child {
	border-bottom: 0;
}

.pj-sidebar-links a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 11px 2px;
	color: #475467;
	font-size: 13px;
	font-weight: 500;
}

.pj-sidebar-links a:hover {
	color: var(--pj-primary);
}


/* SIDEBAR POSTS */

.pj-sidebar-posts {
	display: grid;
	gap: 14px;
}

.pj-sidebar-post {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 11px;
	align-items: center;
}

.pj-sidebar-post-image {
	width: 72px;
	height: 54px;
	overflow: hidden;
	border-radius: 8px;
	background: #f2f4f7;
}

.pj-sidebar-post-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pj-sidebar-post-content {
	min-width: 0;
}

.pj-sidebar-post-content h3 {
	display: -webkit-box;
	margin: 0 0 4px;
	overflow: hidden;
	color: var(--pj-dark);
	font-size: 12px;
	line-height: 1.4;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.pj-sidebar-post:hover h3 {
	color: var(--pj-primary);
}

.pj-sidebar-post-content span {
	color: var(--pj-light);
	font-size: 10px;
}


/* =========================================================
   RELATED POSTS
========================================================= */

.pj-related-section {
	padding: 10px 0 80px;
}

.pj-related-heading {
	margin-bottom: 30px;
}

.pj-related-heading h2 {
	margin: 8px 0 7px;
	color: var(--pj-dark);
	font-size: 32px;
	line-height: 1.2;
}

.pj-related-heading p {
	margin: 0;
	color: var(--pj-muted);
	font-size: 14px;
}

.pj-related-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 22px;
}

.pj-related-card {
	overflow: hidden;
	border: 1px solid var(--pj-border);
	border-radius: 17px;
	background: #fff;
	transition: .25s ease;
}

.pj-related-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 14px 32px rgba(16,24,40,.08);
}

.pj-related-image {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #f2f4f7;
}

.pj-related-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .35s ease;
}

.pj-related-card:hover .pj-related-image img {
	transform: scale(1.04);
}

.pj-related-no-image {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f5f4ff;
	color: var(--pj-primary);
	font-size: 11px;
	font-weight: 800;
}

.pj-related-content {
	padding: 18px;
}

.pj-related-category {
	display: block;
	margin-bottom: 7px;
	color: var(--pj-primary);
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .7px;
	text-transform: uppercase;
}

.pj-related-content h3 {
	margin: 0 0 13px;
	font-size: 17px;
	line-height: 1.4;
}

.pj-related-content h3 a {
	color: var(--pj-dark);
}

.pj-related-content h3 a:hover {
	color: var(--pj-primary);
}

.pj-related-link {
	color: var(--pj-primary);
	font-size: 12px;
	font-weight: 700;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

	.pj-single-layout {
		grid-template-columns: minmax(0, 1fr) 280px;
		gap: 28px;
	}

	.pj-related-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 800px) {

	.pj-single-container {
		width: min(100% - 28px, 1200px);
	}

	.pj-single-layout {
		grid-template-columns: 1fr;
		padding-top: 28px;
	}

	.pj-single-sidebar {
		position: static;
		order: 2;
	}

	.pj-single-main {
		order: 1;
	}
}


@media (max-width: 600px) {

	.pj-single-container {
		width: min(100% - 24px, 1200px);
	}

	.pj-post-title {
		font-size: 33px;
		letter-spacing: -1px;
	}

	.pj-post-author-share {
		align-items: flex-start;
		flex-direction: column;
	}

	.pj-post-share-button {
		width: 100%;
	}

	.pj-post-meta-row {
		font-size: 10.5px;
		gap: 5px;
	}

	.pj-intro-section {
		padding: 21px;
	}

	.pj-intro-text {
		font-size: 15px;
	}

	.pj-full-article-inner {
		padding: 21px;
		font-size: 15px;
	}

	.pj-prompts-heading {
		align-items: flex-start;
		flex-direction: column;
	}

	.pj-prompt-count {
		display: none;
	}

	.pj-prompt-card-header {
		padding: 16px;
	}

	.pj-prompt-number {
		font-size: 10px;
	}

	.pj-prompt-title-wrap h3 {
		font-size: 16px;
	}

	.pj-prompt-image-wrap {
		padding: 14px 15px 0;
	}

	.pj-image-share-button {
		width: 100%;
		justify-content: center;
	}

	.pj-best-for {
		margin-left: 15px;
		margin-right: 15px;
	}

	.pj-prompt-box {
		margin-left: 15px;
		margin-right: 15px;
		margin-bottom: 15px;
	}

	.pj-negative-box {
		margin-left: 15px;
		margin-right: 15px;
	}

	.pj-prompt-text {
		padding: 17px;
		font-size: 13px;
	}

	.pj-related-grid {
		grid-template-columns: 1fr;
	}
}