:root {
	--orange: #ff6a1a;
	--orange2: #ff8a2a;
	--purple: #7c3aed;
	--purple2: #6d28d9;
	--pink: #ec4899;
	--text: #14183a;
	--muted: #6b7090;
	--line: #ececf4;
	--bg: #ffffff;
	--soft: #f6f5fb;
	--card: #ffffff;
	--shadow: 0 6px 24px rgba(30, 24, 80, .07);
	--radius: 14px;
	--btn-radius: 12px;
	--grad: linear-gradient(90deg, #ff7a1a 0%, #f0508a 55%, #7c3aed 100%);
	--peach: linear-gradient(180deg, #fff3ea 0%, #fff9f4 100%);
}

:root[data-theme="dark"] {
	--text: #eceefc;
	--muted: #9aa0c6;
	--line: #262b52;
	--bg: #0b0f2b;
	--soft: #141939;
	--card: #12163a;
	--shadow: 0 6px 24px rgba(0, 0, 0, .35);
	--peach: linear-gradient(180deg, #1a1840 0%, #141939 100%);
}

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

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

body {
	margin: 0;
	font-family: 'Poppins', system-ui, -apple-system, 'Segoe UI', sans-serif;
	font-size: 15px;
	line-height: 1.65;
	color: var(--text);
	background: var(--bg);
	-webkit-font-smoothing: antialiased;
}

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

a {
	color: inherit;
	text-decoration: none;
	transition: color .2s;
}

ul,
ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

h1,
h2,
h3,
h4,
h5 {
	margin: 0;
	line-height: 1.25;
	font-weight: 700;
}

button,
input,
textarea {
	font-family: inherit;
	font-size: inherit;
}

button {
	cursor: pointer;
}

.screen-reader-text {
	position: absolute;
	left: -9999px;
}

.pn-container {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
}

.pn-main {
	min-height: 60vh;
}

/* Buttons */
.pn-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	border: 0;
	border-radius: var(--btn-radius);
	padding: 10px 20px;
	font-weight: 600;
	font-size: 14px;
	color: #fff;
	cursor: pointer;
	transition: transform .2s, box-shadow .2s;
	white-space: nowrap;
}

.pn-btn:hover {
	transform: translateY(-2px);
	color: #fff;
}

.pn-btn-orange {
	background: linear-gradient(90deg, var(--orange2), var(--orange));
	box-shadow: 0 6px 16px color-mix(in srgb, var(--orange) 32%, transparent);
}

.pn-btn-purple {
	background: linear-gradient(90deg, var(--purple), var(--purple2));
	box-shadow: 0 6px 16px 
color-mix(in srgb, var(--purple) 32%, transparent);
}

.pn-btn-grad {
	background: linear-gradient(90deg, var(--orange), var(--pink) 60%, var(--purple));
	box-shadow: 0 6px 16px color-mix(in srgb, var(--pink) 28%, transparent);
	padding: 9px 18px;
}

.pn-btn-lg {
	padding: 13px 24px;
	font-size: 14.5px;
}

/* ---------- Header ---------- */
.pn-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: var(--bg);
	border-bottom: 1px solid var(--line);
	box-shadow: 0 2px 14px rgba(20, 20, 60, .04);
}

.pn-header-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 68px;
	gap: 20px;
}

/* Logo image: size is controlled from Customizer > PromptNest Options > Header */
.pn-header-inner > .custom-logo-link,
.pn-header-inner > .pn-logo {
	flex: none;
}

.custom-logo-link {
	display: inline-flex;
	align-items: center;
	line-height: 0;
	max-width: 100%;
}

.custom-logo-link img.custom-logo,
.pn-header img.custom-logo {
	display: block;
	height: var(--pn-logo-h, 44px);
	width: auto;
	max-width: 100%;
	max-height: none;
	object-fit: contain;
	object-position: left center;
}

.pn-logo {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 23px;
	font-weight: 700;
	letter-spacing: -.4px;
	color: #241b6b;
}

:root[data-theme="dark"] .pn-logo {
	color: #fff;
}

.pn-logo-light {
	color: #fff;
}

.pn-flogo-img {
	display: inline-block;
	line-height: 0;
}

.pn-flogo-img img {
	display: block;
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 48px;
}

.pn-logo-mark {
	flex: none;
}

.pn-nav {
	flex: 1;
	display: flex;
	justify-content: center;
}

.pn-menu {
	display: flex;
	align-items: center;
	gap: 30px;
}

.pn-menu > li {
	position: relative;
}

.pn-menu a {
	font-size: 13px;
	font-weight: 500;
	color: var(--text);
	padding: 24px 0;
	display: block;
	position: relative;
}

.pn-menu a:hover,
.pn-menu .current-menu-item > a,
.pn-menu .current_page_item > a,
.pn-menu > .current-menu-ancestor > a,
.pn-menu > .current-menu-parent > a,
.pn-menu > .current_page_ancestor > a,
.pn-menu > .current_page_parent > a {
	color: var(--orange);
}

.pn-menu > .current-menu-item > a::after,
.pn-menu > .current_page_item > a::after,
.pn-menu > .current-menu-ancestor > a::after,
.pn-menu > .current-menu-parent > a::after,
.pn-menu > .current_page_ancestor > a::after,
.pn-menu > .current_page_parent > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 14px;
	height: 2px;
	border-radius: 2px;
	background: var(--orange);
}

.pn-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: -12px;
	min-width: 190px;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: var(--shadow);
	padding: 8px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: .2s;
}

.pn-menu li:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}

.pn-menu .sub-menu a {
	padding: 8px 12px;
	border-radius: 8px;
}

.pn-menu .sub-menu a:hover {
	background: var(--soft);
}

/* Arrow icon on menu items that have a submenu */
.pn-menu > .menu-item-has-children > a {
	display: flex;
	align-items: center;
	gap: 7px;
}

.pn-menu > .menu-item-has-children > a::before {
	content: "";
	order: 1;
	flex: none;
	width: 6px;
	height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-2px) rotate(45deg);
	transition: transform .2s;
}

@media (min-width: 961px) {
	.pn-menu > .menu-item-has-children:hover > a::before {
		transform: translateY(2px) rotate(-135deg);
	}
}

.pn-header-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

.pn-icon-btn {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 0;
	background: transparent;
	color: var(--text);
	display: grid;
	place-items: center;
	transition: background .2s;
}

.pn-icon-btn:hover {
	background: var(--soft);
}

.pn-dark-btn {
	background: var(--soft);
	color: var(--purple2);
}

.pn-sun {
	display: none;
}

:root[data-theme="dark"] .pn-sun {
	display: block;
}

:root[data-theme="dark"] .pn-moon {
	display: none;
}

.pn-sub-btn {
	font-size: 13px;
}

.pn-burger {
	display: none;
	width: 40px;
	height: 40px;
	padding: 0 9px;
	border: 0;
	background: transparent;
	flex-direction: column;
	gap: 5px;
	align-items: flex-start;
	justify-content: center;
}

.pn-burger span {
	width: 22px;
	height: 2px;
	background: var(--text);
	border-radius: 3px;
}

.pn-burger span:last-child {
	width: 12px;
	align-self: flex-end;
}

.pn-nav-head,
.pn-nav-overlay {
	display: none;
}

.pn-search-drop {
	display: none;
	border-top: 1px solid var(--line);
	padding: 14px 0;
	background: var(--bg);
}

.pn-search-drop.is-open {
	display: block;
}

/* Search form */
.pn-searchform {
	display: flex;
	border: 1px solid var(--line);
	border-radius: var(--btn-radius);
	overflow: hidden;
	background: var(--card);
}

.pn-searchform input {
	flex: 1;
	min-width: 0;
	border: 0;
	outline: 0;
	padding: 11px 14px;
	background: transparent;
	color: var(--text);
	font-size: 13px;
}

.pn-searchform button {
	width: 50px;
	border: 0;
	background: linear-gradient(135deg, var(--purple), var(--purple2));
	color: #fff;
	display: grid;
	place-items: center;
}

/* ---------- Hero ---------- */
.pn-hero {
	position: relative;
	display: flex;
	align-items: center;
	aspect-ratio: 2200/650;
	background: radial-gradient(60% 90% at 88% 40%, #efe3ff 0%, rgba(239, 227, 255, 0) 70%), radial-gradient(45% 80% at 0% 0%, #ffe9d6 0%, rgba(255, 233, 214, 0) 70%), linear-gradient(180deg, #fff6ef 0%, #fff 100%);
	overflow: hidden;
}

:root[data-theme="dark"] .pn-hero {
	background: radial-gradient(60% 90% at 88% 40%, #2b1f5e 0%, rgba(43, 31, 94, 0) 70%), linear-gradient(180deg, #151a42, #0b0f2b);
}

.pn-hero-inner {
	display: grid;
	grid-template-columns: 1.1fr .9fr;
	align-items: center;
	gap: 20px;
	padding-top: 44px;
	padding-bottom: 36px;
}

.pn-hero h1 {
	font-size: clamp(34px, 4.4vw, 52px);
	font-weight: 700;
	letter-spacing: -1.2px;
	line-height: 1.12;
	color: #182355;
}

:root[data-theme="dark"] .pn-hero h1 {
	color: #fff;
}

.pn-hero h1 .pn-grad-text {
	background: linear-gradient(90deg, var(--orange), var(--pink));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-weight: 800;
}

.pn-hero-copy > p {
	margin: 16px 0 22px;
	max-width: 520px;
	color: #3d4266;
	font-size: 14px;
	line-height: 1.7;
}

:root[data-theme="dark"] .pn-hero-copy > p {
	color: var(--muted);
}

.pn-hero-search {
	display: flex;
	align-items: center;
	gap: 10px;
	background: #fff;
	border: 1px solid #f0e6ff;
	border-radius: var(--btn-radius);
	padding: 5px 5px 5px 16px;
	max-width: 600px;
	box-shadow: 0 8px 28px rgba(124, 58, 237, .1);
}

:root[data-theme="dark"] .pn-hero-search {
	background: var(--card);
	border-color: var(--line);
}

.pn-hero-search input {
	flex: 1;
	min-width: 0;
	border: 0;
	outline: 0;
	background: transparent;
	font-size: 13px;
	color: var(--text);
	padding: 10px 0;
}

.pn-hero-search .pn-btn {
	padding: 12px 30px;
	border-radius: var(--btn-radius);
}

.pn-hero-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin: 18px 0 20px;
}

.pn-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 13px;
}

.pn-chips strong {
	margin-right: 6px;
	font-weight: 600;
}

.pn-chips a {
	padding: 4px 14px;
	border: 1px solid #e6e2f3;
	border-radius: 20px;
	background: rgba(255, 255, 255, .8);
	color: #4a4f74;
	font-size: 11px;
	transition: .2s;
}

:root[data-theme="dark"] .pn-chips a {
	background: var(--card);
	border-color: var(--line);
	color: var(--muted);
}

.pn-chips a:hover {
	background: var(--orange);
	color: #fff;
	border-color: var(--orange);
}

.pn-hero-bg {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
}

.pn-hero-bg img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: right center;
	-webkit-mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
	mask-image: linear-gradient(to bottom, #000 82%, transparent 100%);
}

:root[data-theme="dark"] .pn-hero-bg img {
	opacity: .85;
}

.pn-hero-inner {
	position: relative;
	z-index: 1;
	width: 100%;
}

/* Latest bar */
.pn-latest-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 20px 0 27px;
	padding: 10px 18px;
	border-radius: 14px;
	background: linear-gradient(90deg, var(--orange2) 0%, var(--pink) 55%, var(--purple) 100%);
	color: #fff;
	box-shadow: 0 8px 22px rgba(240, 80, 138, .22);
}

.pn-latest-title {
	flex: 1;
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 18px;
	font-weight: 600;
}

.pn-viewall {
	padding: 6px 16px;
	border: 1px solid rgba(255, 255, 255, .7);
	border-radius: var(--btn-radius);
	font-size: 12px;
	font-weight: 500;
	background: rgba(255, 255, 255, .12);
	color: #fff;
}

.pn-viewall:hover {
	background: #fff;
	color: var(--purple);
}

.pn-page-top .pn-latest-title {
	justify-content: flex-start;
	padding-left: 0;
}

/* Cards */
.pn-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}

.pn-card {
	position: relative;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 8px;
	box-shadow: rgb(149 157 165 / 15%) 0px 8px 30px;
	transition: transform .25s, box-shadow .25s;
}

.pn-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow);
}

.pn-card-img {
	display: block;
	border-radius: 10px;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	background: #e9e6f7;
}

.pn-card-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .5s;
}

.pn-card:hover .pn-card-img img {
	transform: scale(1.05);
}

.pn-noimg {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 120px;
	background: linear-gradient(135deg, #ffd9bd, #d9c7ff);
}

.pn-badge {
	position: absolute;
	top: 18px;
	left: 18px;
	background: var(--orange);
	color: #fff;
	font-size: 10.5px;
	font-weight: 600;
	padding: 3px 12px;
	border-radius: 20px;
	line-height: 1.6;
	box-shadow: 0 3px 10px rgba(0, 0, 0, .18);
	z-index: 2;
}

.pn-badge:hover {
	color: #fff;
	filter: brightness(1.08);
}

.pn-card-body {
	padding: 12px 8px 10px;
}

.pn-card-title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	color: var(--text);
}

.pn-card-title a:hover {
	color: var(--orange);
}

.pn-card-excerpt {
	margin: 8px 0 12px;
	font-size: 11.5px;
	line-height: 1.6;
	color: var(--muted);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.pn-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	font-size: 10px;
	color: var(--muted);
}

.pn-meta-item {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

.pn-avatar,
.pn-meta img.avatar,
.pn-meta-item img {
	border-radius: 50%;
	object-fit: cover;
	object-position: center;
	aspect-ratio: 1/1;
	flex: none;
	max-width: none;
	display: block;
}

.pn-meta-item img[width="22"] {
	width: 22px!important;
	height: 22px!important;
}

.pn-meta-item img[width="36"] {
	width: 36px!important;
	height: 36px!important;
}

.pn-empty {
	text-align: center;
	color: var(--muted);
	padding: 40px 0;
}

.pn-no-result-icon {
	display: flex;
	justify-content: center;
	margin: 32px 0 8px;
}

.pn-no-result-icon svg {
	display: block;
	max-width: 100%;
	height: auto;
}

:root[data-theme="dark"] .pn-no-result-icon circle[fill="#fff"] {
	fill: #1e2140;
}

/* Pagination */
.pn-pagination {
	display: flex;
	justify-content: center;
	gap: 10px;
	margin: 28px 0 30px;
}

.pn-pagination .page-numbers {
	min-width: 36px;
	height: 36px;
	border-radius: var(--btn-radius);
	border: 1px solid var(--line);
	background: var(--card);
	display: grid;
	place-items: center;
	font-size: 13px;
	font-weight: 500;
	color: var(--text);
	transition: .2s;
	padding: 0 8px;
}

.pn-pagination a.page-numbers:hover {
	border-color: var(--orange);
	color: var(--orange);
}

.pn-pagination .current {
	background: var(--orange);
	border-color: var(--orange);
	color: #fff;
	box-shadow: 0 5px 14px color-mix(in srgb, var(--orange) 35%, transparent);
}

/* Author box */
.pn-author-box {
	display: flex;
	align-items: center;
	gap: 26px;
	background: linear-gradient(180deg, 
color-mix(in srgb, var(--orange) 8%, white) 0%, 
color-mix(in srgb, var(--orange) 3%, white) 100%);
	border: 1px solid 
color-mix(in srgb, var(--orange) 10%, transparent);
	border-radius: 16px;
	padding: 16px 26px;
	margin: 26px 0;
}

:root[data-theme="dark"] .pn-author-box {
	border-color: var(--line);
}

.pn-author-photo {
	position: relative;
	width: 110px;
	height: 110px;
	flex: none;
}

.pn-author-photo img {
	width: 110px;
	height: 110px;
	border-radius: 50%;
	object-fit: cover;
	border: 3px solid #fff;
	box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
}

.pn-author-photo i {
	position: absolute;
	right: 6px;
	bottom: 8px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: var(--orange);
	border: 2px solid #fff;
}

.pn-author-photo i::after {
	content: "";
	position: absolute;
	inset: -2px;
	border-radius: 50%;
	background: var(--orange);
	opacity: .5;
	animation: pn-dot-ring 1.8s ease-out infinite;
}

@keyframes pn-dot-ring {
	0% { transform: scale(1); opacity: .5; }
	70%, 100% { transform: scale(2.3); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.pn-author-photo i,
	.pn-author-photo i::after { animation: none; }
}

.pn-author-info {
	flex: 1;
	min-width: 0;
}

.pn-author-label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 10px;
	letter-spacing: .5px;
	color: #5a5f80;
	font-weight: 500;
}

.pn-author-label b {
	width: 22px;
	height: 2px;
	background: var(--orange);
}

.pn-author-info h4 {
	font-size: 21px;
	margin: 3px 0 4px;
}

.pn-author-info h4 a {
	color: inherit;
	text-decoration: none;
	transition: color .2s;
}

.pn-author-info h4 a:hover {
	color: var(--orange);
}

.pn-author-info p {
	margin: 0;
	font-size: 12.5px;
	color: var(--muted);
	line-height: 1.7;
	max-width: 560px;
}

.pn-author-social {
	padding-left: 26px;
	border-left: 1px solid #f0d9c7;
}

/* Social */
.pn-social {
	display: flex;
	gap: 9px;
	flex-wrap: wrap;
}

.pn-social a {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	color: #fff;
	transition: transform .2s;
}

.pn-social a:hover {
	transform: translateY(-3px);
	color: #fff;
}

.pn-social-sm a {
	width: 26px;
	height: 26px;
}

.pn-social-sm a svg {
	width: 13px;
	height: 13px;
}

.pn-social a i {
	font-size: 13px;
	line-height: 1;
}

.pn-footer .pn-social a {
	background: #fff!important;
	color: #0d1233;
}

.pn-footer .pn-social a.pn-social-facebook {
	color: #1877f2;
}

.pn-footer .pn-social a.pn-social-youtube {
	color: #ef0000;
}

.pn-footer .pn-social a.pn-social-instagram {
	color: #e1306c;
}

.pn-footer .pn-social a.pn-social-pinterest {
	color: #e60023;
}

.pn-footer .pn-social a.pn-social-linkedin {
	color: #0a66c2;
}

/* ---------- Layout (single/page) ---------- */
.pn-page-top {
	padding-top: 40px;
	padding-bottom: 30px;
}

.pn-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
	color: var(--muted);
	margin-bottom: 35px;
}

.pn-breadcrumb i {
	font-style: normal;
	color: #a3a7c4;
}

.pn-breadcrumb a:hover {
	color: var(--orange);
}

.pn-breadcrumb span {
	color: var(--text);
	opacity: .7;
}

.pn-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 26px;
	align-items: start;
}

.pn-no-sidebar .pn-layout {
	grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 961px) {
	.pn-has-sidebar .pn-layout .pn-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

.pn-article {
	position: relative;
}

.pn-featured {
	position: relative;
	border-radius: 16px;
	overflow: hidden;
	aspect-ratio: 1200/620;
	background: #e9e6f7;
	box-shadow: rgb(149 157 165 / 15%) 0px 8px 30px;
}

.pn-featured img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pn-featured .pn-badge {
	top: 16px;
	left: 16px;
	font-size: 12px;
	padding: 5px 16px;
}

.pn-title {
	font-size: clamp(20px, 3.4vw, 30px);
	font-weight: 700;
	letter-spacing: -.8px;
	line-height: 1.15;
	margin: 20px 0 15px;
	color: var(--text);
}

.pn-meta-single {
	gap: 8px 14px;
	font-size: 12px;
	color: #565b80;
	margin-bottom: 14px;
}

:root[data-theme="dark"] .pn-meta-single {
	color: var(--muted);
}

.pn-meta-single strong {
	color: var(--text);
	font-weight: 600;
}

.pn-meta-single svg {
	color: var(--purple);
}

.pn-dot {
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: #a3a7c4;
}

.pn-lead {
	font-size: 14.5px;
	color: #4a4f74;
	line-height: 1.75;
	margin: 0 0 16px;
}

:root[data-theme="dark"] .pn-lead {
	color: var(--muted);
}

/* TOC */
.pn-toc {
	border: 1px solid var(--line);
	border-radius: 12px;
	background: var(--card);
	margin: 16px 0 22px;
	overflow: hidden;
	box-shadow: 0 2px 10px rgba(30, 24, 80, .03);
}

.pn-toc[hidden] {
	display: none;
}

.pn-toc-head {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 14px;
	background: transparent;
	border: 0;
	padding: 12px 16px;
	color: var(--text);
	text-align: left;
}

.pn-toc-ico {
	color: var(--purple);
	display: grid;
}

.pn-toc-title {
	flex: 1;
	font-size: 15px;
	font-weight: 600;
}

.pn-toc-btn {
	padding: 6px 34px;
	border: 1px solid var(--line);
	border-radius: 8px;
	font-size: 12px;
	font-weight: 500;
	background: var(--card);
	box-shadow: 0 2px 6px rgba(0, 0, 0, .05);
}

.pn-toc-list {
	display: none;
	padding: 2px 22px 16px 46px;
	counter-reset: toc;
	font-size: 13.5px;
}

.pn-toc.is-open .pn-toc-list {
	display: block;
}

.pn-toc-list li {
	counter-increment: toc;
	padding: 4px 0;
}

.pn-toc-list li::before {
	content: counter(toc) ". ";
	color: var(--purple);
	font-weight: 600;
}

.pn-toc-list a:hover {
	color: var(--orange);
}

/* Content */
.pn-content {
	font-size: 14.5px;
	color: #4a4f74;
	line-height: 1.8;
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 16px;
	padding: 26px 28px;
	margin: 18px 0;
	box-shadow: rgb(149 157 165 / 15%) 0px 8px 30px;
}

.pn-content::after {
	content: "";
	display: block;
	clear: both;
}

:root[data-theme="dark"] .pn-content {
	color: #b8bde0;
}

.pn-content > *:first-child {
	margin-top: 0;
}

.pn-content h2 {
	font-size: 21px;
	font-weight: 700;
	color: var(--text);
	margin: 26px 0 8px;
	padding-left: 16px;
	position: relative;
	letter-spacing: -.2px;
}

.pn-content h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 3px;
	bottom: 3px;
	width: 4px;
	border-radius: 4px;
	background: linear-gradient(
    180deg,
    color-mix(in srgb, var(--purple) 35%, white),
    var(--purple2)
);
}

.pn-content h3 {
	font-size: 18px;
	color: var(--text);
	margin: 22px 0 8px;
}

.pn-content h4 {
	font-size: 16px;
	color: var(--text);
	margin: 18px 0 6px;
}

.pn-content p {
	margin: 0 0 14px;
}

.pn-content a {
	color: var(--purple);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pn-content ul,
.pn-content ol {
	margin: 0 0 16px 22px;
}

.pn-content ul {
	list-style: disc;
}

.pn-content ol {
	list-style: decimal;
}

.pn-content li {
	margin-bottom: 5px;
}

.pn-content img {
	border-radius: 15px;
    width: 100%;
    max-width: 350px;
    margin: auto;
}

.pn-content blockquote {
	margin: 18px 0;
	padding: 14px 20px;
	border-left: 4px solid var(--orange);
	background: var(--soft);
	border-radius: 0 12px 12px 0;
	font-style: italic;
}

.pn-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0;
	font-size: 13.5px;
}

.pn-content th,
.pn-content td {
	border: 1px solid var(--line);
	padding: 9px 12px;
	text-align: left;
}

.pn-content th {
	background: var(--soft);
}

.pn-content code {
	background: var(--soft);
	padding: 2px 6px;
	border-radius: 6px;
	font-size: .9em;
}

/* AI Prompt box (modern card: view / hide / copy) */
.pn-ai-prompt{
	--pn-ai-panel:var(--soft);
	position:relative;
	overflow:hidden;
	background:var(--card);
	border:1px solid var(--line);
	border-radius:18px;
	padding:18px;
	margin:26px 0;
	box-shadow:0 10px 30px rgba(30,24,80,.08);
}
.pn-ai-prompt:before{
	content:"";
	position:absolute;
	left:0;right:0;top:0;
	height:4px;
	background:var(--grad);
}
:root[data-theme="dark"] .pn-ai-prompt{box-shadow:0 10px 30px rgba(0,0,0,.4)}
.pn-ai-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:10px;
	margin:4px 0 14px;
}
.pn-ai-label{
	display:inline-flex;
	align-items:center;
	gap:7px;
	padding:2px 10px;
	border-radius:999px;
	font-size:10px;
	font-weight:600;
	letter-spacing:.8px;
	color:var(--orange);
	background:color-mix(in srgb,var(--orange) 12%,transparent);
	border:1px solid color-mix(in srgb,var(--orange) 28%,transparent);
}
.pn-ai-meta{
	font-size:12px;
	font-weight:500;
	color:var(--muted);
	white-space:nowrap;
}
.pn-ai-text-wrap{
	position:relative;
	overflow:hidden;
	max-height:8.5em;
	background:var(--pn-ai-panel);
	border:1px solid var(--line);
	border-radius:12px;
	padding:14px 16px;
	transition:max-height .45s cubic-bezier(.4,0,.2,1);
}
.pn-ai-expanded .pn-ai-text-wrap{max-height:none}
.pn-ai-collapsed .pn-ai-text-wrap:after{
	content:"";
	position:absolute;
	left:0;right:0;bottom:0;
	height:60px;
	background:linear-gradient(to bottom,transparent,var(--pn-ai-panel));
	pointer-events:none;
}
.pn-ai-short .pn-ai-text-wrap:after{display:none}
.pn-ai-text{
	font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
	font-size:clamp(13px,3.6vw,14px);
	line-height:1.75;
	color:var(--text);
	white-space:pre-wrap;
	word-wrap:break-word;
}
.pn-ai-buttons{
	display:flex;
	gap:10px;
	animation:pnAiFadeIn .25s ease;
}
.pn-ai-buttons[hidden]{display:none}
.pn-ai-buttons-top{margin-bottom:14px}
.pn-ai-buttons-bottom{margin-top:14px}
.pn-ai-btn{
	flex:1;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:7px;
	min-width:0;
	color:#fff;
	background:linear-gradient(90deg,var(--orange),var(--pink));
	border:1px solid transparent;
	border-radius:12px;
	padding:12px 10px;
	font-size:clamp(11.5px,3vw,13.5px);
	font-weight:600;
	white-space:nowrap;
	cursor:pointer;
	font-family:inherit;
	box-shadow:0 6px 16px color-mix(in srgb,var(--pink) 28%,transparent);
	transition:transform .15s ease,box-shadow .2s,background .2s,color .2s;
}
.pn-ai-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px color-mix(in srgb,var(--pink) 34%,transparent)}
.pn-ai-btn:active{transform:translateY(0)}
.pn-ai-btn-ghost{
	color:var(--text);
	background:var(--card);
	border-color:var(--line);
	box-shadow:none;
}
.pn-ai-btn-ghost:hover{
	color:var(--purple);
	border-color:var(--purple);
	box-shadow:0 6px 16px color-mix(in srgb,var(--purple) 16%,transparent);
}
.pn-ai-btn.is-done{
	color:#fff;
	background:#1fa463;
	border-color:transparent;
	box-shadow:0 6px 16px rgba(31,164,99,.32);
}
.pn-ai-icon{
	font-family:"Segoe UI Emoji","Apple Color Emoji","Noto Color Emoji",sans-serif;
	font-size:14px;
	line-height:1;
}
.pn-ai-btn.is-done .pn-ai-icon{font-family:inherit;font-size:15px;font-weight:700}
@keyframes pnAiFadeIn{
	from{opacity:0;transform:translateY(-4px)}
	to{opacity:1;transform:translateY(0)}
}
@media(max-width:600px){
	.pn-ai-prompt{padding:14px;border-radius:16px}
	.pn-ai-buttons{gap:8px}
	.pn-ai-btn{padding:11px 6px;gap:5px}
	.pn-ai-meta{font-size:11px}
}

/* Tags + share */
.pn-tags {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 18px 0;
	font-size: 13px;
}

.pn-tags strong {
	font-weight: 600;
}

.pn-tags a {
	padding: 5px 18px;
	border: 1px solid var(--line);
	border-radius: 8px;
	font-size: 11.5px;
	background: var(--soft);
	color: #4a4f74;
	transition: .2s;
}

:root[data-theme="dark"] .pn-tags a {
	color: var(--muted);
}

.pn-tags a:hover {
	background: var(--purple);
	border-color: var(--purple);
	color: #fff;
}

.pn-share {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	background: var(--soft);
	border-radius: 14px;
	padding: 12px 20px;
	border: 1px solid var(--line);
}

.pn-share-label {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	font-weight: 600;
}

.pn-share-btns {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.pn-share-btns a,
.pn-share-btns button {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 0;
	display: grid;
	place-items: center;
	color: #fff;
	transition: transform .2s;
}

.pn-share-btns a:hover,
.pn-share-btns button:hover {
	transform: translateY(-3px);
	color: #fff;
}

.pn-copylink {
	background: #6b7280;
}

.pn-copylink.is-done {
	background: #10b981;
}

/* Prev / next */
.pn-postnav {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin: 0 0 24px;
}

.pn-postnav a {
	display: flex;
	align-items: center;
	gap: 14px;
	border: 1px solid var(--line);
	border-radius: 12px;
	padding: 10px 14px;
	background: var(--card);
	transition: .2s;
	min-width: 0;
}

.pn-postnav a:hover {
	box-shadow: var(--shadow);
	transform: translateY(-2px);
}

.pn-pn-next {
	justify-content: space-between;
	text-align: right;
}

.pn-pn-img {
	width: 62px;
	height: 62px;
	flex: none;
	border-radius: 8px;
	overflow: hidden;
}

.pn-pn-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pn-pn-txt {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.pn-pn-txt small {
	color: var(--orange);
	font-weight: 500;
	font-size: 11px;
}

.pn-pn-txt strong {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
}

/* Comments */
.pn-comments-title,
.pn-reply-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 22px;
	margin: 14px 0 14px;
}

.pn-reply-title {
	font-size: 16px;
	margin: 0 0 14px;
}

.pn-comment-list {
	margin-bottom: 22px;
}

.pn-comment-list .children {
	margin-left: 54px;
}

.pn-comment {
	margin-bottom: 14px;
}

.pn-comment-body {
	display: flex;
	gap: 14px;
}

.pn-avatar-lg {
	border-radius: 50%;
	width: 44px;
	height: 44px;
	object-fit: cover;
	flex: none;
}

.pn-comment-main {
	flex: 1;
	min-width: 0;
}

.pn-comment-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 13px;
}

.pn-comment-head strong {
	font-weight: 600;
}

.pn-comment-head time {
	font-size: 10.5px;
	color: var(--muted);
	margin-left: 8px;
}

.pn-comment-head .comment-reply-link {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	color: var(--purple);
	font-weight: 500;
}

.pn-comment-text {
	font-size: 13px;
	color: #4a4f74;
	margin-top: 2px;
}

.pn-comment-text p {
	margin: 0;
}

.pn-comment-form {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 16px 18px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 8px;
	box-shadow: rgb(149 157 165 / 15%) 0px 8px 30px;
}

.comment-respond {
	margin-top: 8px;
}

.pn-comment-form .pn-reply-title {
	width: 100%;
	margin: 0;
}

#reply-title {
	width: 100%;
}

.pn-f {
	margin: 0;
}

.pn-f-3 {
	flex: 1 1 30%;
	min-width: 160px;
}

.pn-f-full {
	flex: 1 1 100%;
}

.pn-f input,
.pn-f textarea {
	width: 100%;
	border: 1px solid var(--line);
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 12.5px;
	background: var(--soft);
	color: var(--text);
	outline: 0;
	transition: border .2s;
}

.pn-f input:focus,
.pn-f textarea:focus {
	border-color: var(--purple);
	background: var(--card);
}

.pn-f textarea {
	resize: vertical;
	min-height: 170px;
}

.form-submit {
	flex: 1 1 100%;
	margin: 0;
}

.pn-submit {
	width: 100%;
	border: 0;
	border-radius: var(--btn-radius);
	padding: 12px;
	font-weight: 600;
	font-size: 14px;
	color: #fff;
	background: linear-gradient(90deg, var(--orange2) 0%, var(--pink) 55%, var(--purple) 100%);
	box-shadow: 0 6px 16px rgba(236, 72, 153, .25);
	transition: transform .2s;
}

.pn-submit:hover {
	transform: translateY(-2px);
}

.pn-comment-form .logged-in-as,
.pn-comment-form .comment-notes {
	width: 100%;
	margin: 0;
	font-size: 12px;
	color: var(--muted);
}

/* ---------- Sidebar ---------- */
.pn-sidebar {
	display: flex;
	flex-direction: column;
	gap: 20px;
	position: sticky;
	top: 86px;
}

.pn-widget {
	background: var(--card);
	border: 1px solid var(--line);
	border-radius: 16px;
	padding: 18px;
	box-shadow: rgb(149 157 165 / 15%) 0px 8px 30px;
}

.pn-w-search {
	padding: 14px;
}

.pn-w-search .pn-searchform {
	border: 1px solid var(--line);
}

.pn-w-title {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 18px;
	margin-bottom: 14px;
}

.pn-w-ico {
	display: grid;
	place-items: center;
}

.pn-w-ico-cat {
	color: var(--orange);
}

.pn-catlist li+li {
	margin-top: 2px;
}

.pn-catlist a {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 7px 4px;
	border-radius: 10px;
	font-size: 12.5px;
	font-weight: 500;
	transition: background .2s;
}

.pn-catlist a:hover {
	background: var(--soft);
}

.pn-cat-ico {
	width: 26px;
	height: 26px;
	border-radius: var(--btn-radius);
	display: grid;
	place-items: center;
	flex: none;
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .15);
}

.pn-cat-name {
	flex: 1;
}

.pn-cat-count {
	width: 23px;
    height: 23px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 11px;
    background: var(--soft);
    border-radius: var(--btn-radius);
    padding: 1px 8px;
    color: var(--muted);
}

.pn-chev {
	color: #a3a7c4;
}

.pn-newsletter {
	position: relative;
	background: linear-gradient(135deg, 
color-mix(in srgb, var(--purple) 15%, white) 0%, 
color-mix(in srgb, var(--purple) 15%, white) 55%, 
color-mix(in srgb, var(--pink) 15%, white) 100%);
	border-color: #e6dbff;
	overflow: hidden;
}

:root[data-theme="dark"] .pn-newsletter {
	background: linear-gradient(135deg, #231c52, #2a1d55);
	border-color: var(--line);
}

.pn-plane {
	position: absolute;
	right: 14px;
	top: 10px;
	transform: rotate(8deg);
}

.pn-newsletter h3 {
	font-size: 17px;
	line-height: 1.3;
	max-width: 200px;
	margin-bottom: 10px;
	color: #1a1147;
}

:root[data-theme="dark"] .pn-newsletter h3 {
	color: #fff;
}

.pn-newsletter p {
	margin: 0 0 16px;
	font-size: 11.5px;
	color: #565b80;
	max-width: 240px;
}

.pn-newsletter input {
	width: 100%;
	border: 1px solid #e3d9fb;
	border-radius: 8px;
	padding: 11px 14px;
	font-size: 12.5px;
	background: #fff;
	outline: 0;
	margin-bottom: 10px;
	color: #14183a;
}

.pn-newsletter .pn-btn {
	width: 100%;
	padding: 11px;
}

.pn-newsletter .pn-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	opacity: 0;
}

.pn-newsletter .pn-btn:disabled {
	opacity: .7;
	cursor: wait;
}

.pn-nl-msg {
	margin-top: 10px;
	font-size: 12px;
	font-weight: 500;
	line-height: 1.4;
}

.pn-nl-msg:empty {
	display: none;
}

.pn-nl-msg.is-ok {
	color: #15803d;
	text-align: center;
}

.pn-nl-msg.is-err {
	color: #dc2626;
}

:root[data-theme="dark"] .pn-nl-msg.is-ok {
	color: #4ade80;
}

:root[data-theme="dark"] .pn-nl-msg.is-err {
	color: #f87171;
}

.pn-poplist li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
}

.pn-poplist li+li {
	border-top: 1px solid var(--line);
}

.pn-pop-num {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--orange2), var(--orange));
	color: #fff;
	display: grid;
	place-items: center;
	font-size: 11px;
	font-weight: 600;
	flex: none;
	box-shadow: 0 3px 8px color-mix(in srgb, var(--orange) 30%, transparent);
}

.pn-pop-img {
	width: 58px;
	height: 58px;
	border-radius: 10px;
	overflow: hidden;
	flex: none;
	background: #e9e6f7;
}

.pn-pop-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pn-pop-txt {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.pn-pop-txt > a {
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.pn-pop-txt > a:hover {
	color: var(--orange);
}

.pn-date {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 10px;
	color: var(--muted);
}

.pn-rellist li {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 0;
}

.pn-rellist li+li {
	border-top: 1px solid var(--line);
}

.pn-rellist .pn-pop-img {
	width: 64px;
	height: 58px;
}

/* ---------- Archive misc / 404 ---------- */
.pn-archive-desc {
	color: var(--muted);
	margin: -8px 0 20px;
	font-size: 13.5px;
}

.pn-search-again {
	max-width: 520px;
	margin: 0 auto 24px;
}

.pn-404 {
	text-align: center;
	padding: 70px 24px 90px;
}

.pn-404-code {
	font-size: clamp(90px, 16vw, 170px);
	font-weight: 800;
	line-height: 1;
	background: linear-gradient(90deg, var(--orange), var(--pink), var(--purple));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.pn-404 h1 {
	font-size: 30px;
	margin: 6px 0 8px;
}

.pn-404 p {
	color: var(--muted);
	margin: 0 0 24px;
}

/* ---------- Footer ---------- */
.pn-footer {
	margin-top: 34px;
	background: #171a2e;
	color: #c9cdee;
}

.pn-footer-grid {
	display: grid;
	grid-template-columns: 1.35fr 1.2fr .9fr 1fr;
	gap: 34px;
	padding-top: 34px;
	padding-bottom: 24px;
}

.pn-fbrand p {
	font-size: 12.5px;
	line-height: 1.75;
	margin: 14px 0 14px;
	max-width: 260px;
	color: #aab0d8;
}

.pn-fcol h4 {
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 14px;
}

.pn-flist li {
	margin-bottom: 8px;
	font-size: 13px;
}

.pn-flist a {
	color: #c9cdee;
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.pn-flist a:hover {
	color: var(--orange);
}

.pn-flist-dot a::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--orange);
	flex: none;
}

.pn-flist-arrow a::before {
	content: "";
	border-left: 5px solid #fff;
	border-top: 3.5px solid transparent;
	border-bottom: 3.5px solid transparent;
	flex: none;
}

.pn-footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, .08);
	font-size: 12px;
	color: #aab0d8;
}

.pn-fb-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 14px;
	padding-bottom: 14px;
	gap: 12px;
}

.pn-fb-inner span {
	display: inline-flex;
	align-items: center;
	gap: 5px;
}

/* WP core */
.alignleft {
	float: left;
	margin: 0 18px 12px 0;
}

.alignright {
	float: right;
	margin: 0 0 12px 18px;
}

.aligncenter {
	display: block;
	margin: 0 auto 14px;
}

.wp-caption {
	max-width: 100%;
}

.wp-caption-text,
.gallery-caption {
	font-size: 12px;
	color: var(--muted);
	text-align: center;
	margin-top: 4px;
}

.sticky,
.bypostauthor {
	display: block;
}

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
	.pn-layout {
		grid-template-columns: minmax(0, 1fr) 300px;
	}

	.pn-menu {
		gap: 20px;
	}
}

@media (max-width: 960px) {
	.custom-logo-link img.custom-logo,
	.pn-header img.custom-logo {
		height: var(--pn-logo-h-m, 36px);
	}

	.pn-header-inner > .custom-logo-link {
		flex: 0 1 auto;
		min-width: 0;
		max-width: 55vw;
	}

	.pn-layout {
		grid-template-columns: 1fr;
	}

	.pn-sidebar {
		position: static;
	}

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

	.pn-hero-inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.pn-hero-copy {
		min-width: 0;
	}

	.pn-hero {
		padding-top: 270px;
		aspect-ratio: auto;
		display: block;
	}

	.pn-hero-bg {
		bottom: auto;
		height: 290px;
	}

	.pn-hero-bg img {
		object-position: 94% center;
	}

	.pn-burger {
		display: flex;
	}

	.pn-nav {
		position: fixed;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto;
		flex: none;
		display: block;
		width: min(320px, 84vw);
		height: 100vh;
		height: 100dvh;
		overflow-y: auto;
		background: var(--bg);
		padding: 0 22px 28px;
		z-index: 60;
		box-shadow: -14px 0 36px rgba(20, 20, 60, .18);
		transform: translateX(100%);
		visibility: hidden;
		transition: transform .35s cubic-bezier(.22, .8, .3, 1), visibility 0s linear .35s;
	}

	.pn-nav.is-open {
		transform: translateX(0);
		visibility: visible;
		transition: transform .35s cubic-bezier(.22, .8, .3, 1), visibility 0s;
	}

	.pn-nav-head {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 68px;
		border-bottom: 1px solid var(--line);
		margin-bottom: 6px;
	}

	.pn-nav-logo {
		display: flex;
		align-items: center;
		min-width: 0;
	}

	.pn-nav-logo .pn-logo {
		font-size: 20px;
	}

	.pn-nav-logo img {
		height: min(var(--pn-logo-h-m, 36px), 48px);
		max-height: 48px;
		width: auto;
	}

	.pn-nav-close {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: 0;
		background: var(--soft);
		color: var(--text);
		display: grid;
		place-items: center;
		cursor: pointer;
		transition: background .2s, transform .3s;
	}

	.pn-nav-close:hover {
		background: var(--orange);
		color: #fff;
		transform: rotate(90deg);
	}

	.pn-nav-overlay {
		display: block;
		position: fixed;
		inset: 0;
		background: rgba(13, 18, 51, .55);
		opacity: 0;
		visibility: hidden;
		transition: opacity .3s, visibility 0s linear .3s;
		z-index: 55;
	}

	.pn-nav-overlay.is-open {
		opacity: 1;
		visibility: visible;
		transition: opacity .3s, visibility 0s;
	}

	body.pn-nav-lock {
		overflow: hidden;
	}

	.pn-menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.pn-menu > li {
		border-bottom: 1px solid var(--line);
	}

	.pn-menu a {
		padding: 14px 0;
		font-size: 14px;
	}

	.pn-menu > li > a::after {
		display: none;
	}

	.pn-menu .sub-menu {
		display: none;
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: 0;
		padding: 0 0 0 14px;
	}

	.pn-menu .menu-item-has-children.is-open > .sub-menu {
		display: block;
	}

	.pn-menu > .menu-item-has-children > a {
		justify-content: space-between;
	}

	.pn-menu > .menu-item-has-children.is-open > a::before {
		transform: translateY(2px) rotate(-135deg);
	}
}

@media (max-width: 640px) {
	.pn-container {
		padding-left: 16px;
		padding-right: 16px;
	}

	.pn-page-top {
		padding-top: 24px;
		padding-bottom: 24px;
	}

	.pn-content {
		padding: 18px 16px;
		border-radius: 14px;
	}

	.pn-grid {
		grid-template-columns: 1fr;
	}

	.pn-sub-btn {
		display: none;
	}

	.pn-hero-btns {
		flex-wrap: nowrap;
		gap: 10px;
	}

	.pn-hero-btns .pn-btn {
		flex: 1 1 0;
		min-width: 0;
		white-space: normal;
		text-align: center;
		padding: 12px 8px;
		font-size: 12.5px;
		gap: 5px;
	}

	.pn-hero-btns .pn-btn svg {
		width: 14px;
		height: 14px;
		flex: none;
	}

	.pn-author-box {
		flex-direction: column;
		text-align: center;
		padding: 20px;
	}

	.pn-author-label {
		justify-content: center;
	}

	.pn-author-social {
		border: 0;
		padding: 0;
	}

	.pn-postnav {
		grid-template-columns: 1fr;
	}

	.pn-share {
		justify-content: center;
	}

	.pn-footer-grid {
		grid-template-columns: 1fr;
		padding-top: 34px;
        padding-bottom: 24px;
	}

	.pn-fb-inner {
		flex-direction: column;
		padding-top: 14px;
        padding-bottom: 14px;
	}

	.pn-latest-title {
		font-size: 16px;
	}
}

@media (max-width: 380px) {
	.pn-hero-btns .pn-btn {
		font-size: 11.5px;
		padding: 11px 6px;
	}

	.pn-hero-btns .pn-btn svg {
		display: none;
	}
}