/* PM Hub Article Redesign — brand-matched styling for individual guide
   articles and the blog index. Tokens match the site's real brand system
   ("pmstack" Additional CSS). */

.pmart-wrap {
	--pmf-ink: #0E1525;
	--pmf-ink-soft: #3a4256;
	--pmf-muted: #6b7280;
	--pmf-violet: #7c3aed;
	--pmf-blue: #2563eb;
	--pmf-grad: linear-gradient(135deg,#7c3aed 0%,#2563eb 100%);
	--pmf-line: #ececf2;
	--pmf-surface: #ffffff;
	--pmf-radius: 14px;
	--pmf-shadow: 0 6px 16px rgba(14,21,37,.06), 0 2px 6px rgba(14,21,37,.04);
	--pmf-shadow-lg: 0 24px 48px -12px rgba(14,21,37,.18);
	--pmf-display: "Newsreader", Georgia, "Times New Roman", serif;
	--pmf-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--pmf-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
	max-width: 1180px;
	margin: 0 auto;
	padding: 32px 20px 80px;
	font-family: var(--pmf-sans);
	color: var(--pmf-ink-soft);
}
.pmart-wrap *, .pmart-wrap *::before, .pmart-wrap *::after { box-sizing: border-box; }
.pmart-wrap h1, .pmart-wrap h2, .pmart-wrap h3 { font-family: var(--pmf-display); color: var(--pmf-ink); letter-spacing: -.015em; line-height: 1.15; margin: 0; }
.pmart-wrap p { margin: 0; }
.pmart-wrap a { color: var(--pmf-blue); text-decoration: none; }
.pmart-wrap a:hover { color: var(--pmf-violet); }

/* Hide the theme's duplicate title/byline/featured-image on target posts. */
body.postid-41 .entry-title, body.postid-149 .entry-title,
body.postid-41 h1.entry-title, body.postid-149 h1.entry-title,
body.postid-41 .post-title, body.postid-149 .post-title,
body.postid-41 .single-post-title, body.postid-149 .single-post-title,
body.postid-41 header.entry-header, body.postid-149 header.entry-header,
body.postid-41 .entry-header, body.postid-149 .entry-header,
body.postid-41 .entry-meta, body.postid-149 .entry-meta,
body.postid-41 .posted-on, body.postid-149 .posted-on,
body.postid-41 .byline, body.postid-149 .byline,
body.postid-41 .post-meta, body.postid-149 .post-meta,
body.postid-41 .post-thumbnail, body.postid-149 .post-thumbnail,
body.postid-41 .entry-thumbnail, body.postid-149 .entry-thumbnail,
body.postid-41 figure.post-thumbnail, body.postid-149 figure.post-thumbnail,
body.postid-41 .wp-post-image, body.postid-149 .wp-post-image { display: none !important; }
body.postid-41 #nav + *, body.postid-149 #nav + * { padding-top: 24px !important; }

/* BrowserStack-style hero banner */
.pmart-banner { background: linear-gradient(135deg,#f5f0ff 0%,#eff5ff 55%,#f9fafc 100%); border-radius: 24px; padding: 40px 44px 44px; margin-bottom: 40px; text-align: center; position: relative; overflow: hidden; }
.pmart-banner::before, .pmart-banner::after { content: ""; position: absolute; top: 0; bottom: 0; width: 80px; background-image: repeating-linear-gradient(-45deg, transparent 0 10px, rgba(124,58,237,.06) 10px 11px); pointer-events: none; }
.pmart-banner::before { left: 0; }
.pmart-banner::after { right: 0; transform: scaleX(-1); }
.pmart-crumbs { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-bottom: 22px; font-family: var(--pmf-sans); font-size: 0.86rem; position: relative; z-index: 1; }
.pmart-crumbs a { color: var(--pmf-ink-soft); font-weight: 600; }
.pmart-crumbs a:hover { color: var(--pmf-violet); }
.pmart-crumb-sep { color: var(--pmf-muted); font-weight: 400; }
.pmart-crumb-current { color: var(--pmf-muted); font-weight: 500; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pmart-banner-title { font-family: var(--pmf-display) !important; font-size: clamp(1.9rem, 4.5vw, 3rem) !important; font-weight: 600 !important; color: var(--pmf-ink) !important; letter-spacing: -.02em !important; line-height: 1.12 !important; margin: 0 auto 18px !important; max-width: 900px; position: relative; z-index: 1; }
.pmart-banner-desc { font-size: 1.05rem; line-height: 1.65; color: var(--pmf-ink-soft); max-width: 780px; margin: 0 auto 28px !important; position: relative; z-index: 1; }
.pmart-authorship { display: flex; justify-content: center; gap: 20px; flex-wrap: wrap; margin-bottom: 14px; position: relative; z-index: 1; }
.pmart-written-by { display: inline-flex; align-items: center; gap: 8px; font-family: var(--pmf-sans); font-size: 0.9rem; }
.pmart-authorship-label { color: var(--pmf-muted); font-weight: 500; }
.pmart-author-avatar-sm { width: 26px; height: 26px; border-radius: 999px; background: var(--pmf-grad); color: #fff; font-weight: 700; font-size: 0.72rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pmart-authorship-name { color: var(--pmf-blue); font-weight: 700; }
.pmart-banner-meta { display: flex; justify-content: center; align-items: center; gap: 14px; font-size: 0.86rem; color: var(--pmf-ink-soft); position: relative; z-index: 1; }
.pmart-meta-sep { width: 1px; height: 14px; background: var(--pmf-line); display: inline-block; }

/* Key Takeaways */
.pmart-takeaways-section { background: rgba(124,58,237,.04); border: 1px solid rgba(124,58,237,.15); border-radius: var(--pmf-radius); padding: 22px 24px; margin-bottom: 40px; }
.pmart-takeaways-heading { font-family: var(--pmf-mono); font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--pmf-violet); margin-bottom: 14px !important; }
.pmart-takeaways-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.pmart-takeaways-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 0.93rem; line-height: 1.6; color: var(--pmf-ink-soft); }
.pmart-takeaways-list .check { flex-shrink: 0; width: 20px; height: 20px; border-radius: 999px; background: var(--pmf-grad); color: #fff; font-size: 0.68rem; display: flex; align-items: center; justify-content: center; margin-top: 2px; }

.pmart-toc-icon { display: inline-flex; flex-direction: column; gap: 3px; width: 14px; }
.pmart-toc-icon span { display: block; height: 2px; border-radius: 1px; background: var(--pmf-violet); }
.pmart-toc-icon span:nth-child(1) { width: 100%; }
.pmart-toc-icon span:nth-child(2) { width: 70%; }
.pmart-toc-icon span:nth-child(3) { width: 100%; }

.pmart-author-box { display: flex; align-items: center; gap: 16px; background: #fff; border: 1px solid var(--pmf-line); border-radius: var(--pmf-radius); padding: 20px 22px; margin-top: 8px; }
.pmart-author-avatar { flex-shrink: 0; width: 44px; height: 44px; border-radius: 999px; background: var(--pmf-grad); color: #fff; font-family: var(--pmf-display); font-weight: 600; font-size: 1.1rem; display: flex; align-items: center; justify-content: center; }
.pmart-author-name { font-weight: 700; color: var(--pmf-ink); font-size: 0.95rem; margin-bottom: 2px !important; }
.pmart-author-role { font-size: 0.85rem; color: var(--pmf-muted); }

.pmart-shell { display: grid; grid-template-columns: 260px 1fr; grid-template-areas: "toc main"; gap: 40px; align-items: start; }
.pmart-main { grid-area: main; min-width: 0; }
.pmart-toc { grid-area: toc; position: sticky; top: 100px; display: flex; flex-direction: column; gap: 20px; }
.pmart-toc-card { background: transparent; border: none; border-left: 2px solid var(--pmf-line); border-radius: 0; padding: 0 0 0 18px; }
.pmart-toc-title { display: flex; align-items: center; gap: 8px; font-family: var(--pmf-mono); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--pmf-muted); margin-bottom: 14px; }
.pmart-toc-title .dot { width: 6px; height: 6px; border-radius: 999px; background: var(--pmf-violet); flex-shrink: 0; }
.pmart-toc-nav { display: flex; flex-direction: column; gap: 2px; }
.pmart-toc-nav a { font-size: 0.87rem; font-weight: 600; color: var(--pmf-ink-soft); padding: 7px 0; border-bottom: none; transition: color .15s ease, padding-left .15s ease; }
.pmart-toc-nav a:hover { color: var(--pmf-violet); padding-left: 4px; }
.pmart-cta-card { background: var(--pmf-grad); border: none; color: #fff; position: relative; overflow: hidden; border-radius: var(--pmf-radius); padding: 18px 16px; }
.pmart-cta-eyebrow { font-family: var(--pmf-mono); font-size: 0.65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: rgba(255,255,255,.75); margin-bottom: 8px; }
.pmart-cta-card h3 { color: #fff; font-size: 1.05rem; margin-bottom: 8px; }
.pmart-cta-card p { color: rgba(255,255,255,.85); font-size: 0.82rem; line-height: 1.55; margin-bottom: 14px; }
.pmart-cta-btn { display: flex; align-items: center; justify-content: center; width: 100%; background: rgba(255,255,255,.16); color: #fff !important; font-weight: 700; font-size: 0.82rem; padding: 11px 12px; border-radius: 10px; margin-bottom: 8px; }
.pmart-cta-btn:hover { background: rgba(255,255,255,.26); }
.pmart-cta-btn--ghost { background: transparent; border: 1px solid rgba(255,255,255,.35); margin-bottom: 0; }

.pmart-section { margin-bottom: 52px; }
.pmart-eyebrow { font-family: var(--pmf-mono); font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--pmf-violet); margin-bottom: 8px; }
.pmart-eyebrow--light { color: rgba(255,255,255,.7); }
.pmart-section h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); font-weight: 600; margin-bottom: 16px; }
.pmart-h2--light { color: #fff !important; }
.pmart-intro { font-size: 1rem; line-height: 1.75; margin-bottom: 22px; max-width: 760px; }
.pmart-lead--light { color: rgba(255,255,255,.85) !important; font-size: 1rem; line-height: 1.75; margin-bottom: 22px; max-width: 720px; }

.pmart-criteria-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-bottom: 24px; }
.pmart-criteria-card { background: #fff; border: 1px solid var(--pmf-line); border-radius: var(--pmf-radius); padding: 20px; }
.pmart-num-badge { width: 32px; height: 32px; background: rgba(124,58,237,.08); color: var(--pmf-violet); border-radius: 9px; display: flex; align-items: center; justify-content: center; font-family: var(--pmf-display); font-weight: 600; font-size: 0.9rem; margin-bottom: 12px; }
.pmart-criteria-card h3 { font-size: 1rem; margin-bottom: 8px; }
.pmart-criteria-card p { font-size: 0.87rem; line-height: 1.65; }

.pmart-alert, .pmart-tip { display: flex; gap: 12px; align-items: flex-start; border-radius: var(--pmf-radius); padding: 18px 20px; }
.pmart-alert { background: #fffbeb; }
.pmart-alert p { color: #92400e; font-size: 0.95rem; line-height: 1.7; }
.pmart-tip { background: rgba(124,58,237,.06); margin-top: 24px; }
.pmart-tip p { color: #4c1d95; font-size: 0.95rem; line-height: 1.7; }
.pmart-tip--light { background: rgba(255,255,255,.1); }
.pmart-tip--light p { color: #eaf2ff; }
.pmart-alert .icon, .pmart-tip .icon { font-size: 1.1rem; line-height: 1; flex-shrink: 0; margin-top: 3px; }

.pmart-ranked-list { display: grid; gap: 18px; }
.pmart-rank-card { background: #fff; border: 1px solid var(--pmf-line); border-radius: 20px; padding: 24px; }
.pmart-rank-card--top { border-color: rgba(124,58,237,.25); box-shadow: var(--pmf-shadow); }
.pmart-rank-head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 14px; }
.pmart-rank-num { width: 44px; height: 44px; flex-shrink: 0; border-radius: 13px; color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--pmf-display); font-weight: 600; background: var(--pmf-ink); }
.pmart-rank-num--gradient { background: var(--pmf-grad); }
.pmart-rank-tag { font-family: var(--pmf-mono); font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--pmf-violet); margin-bottom: 5px; }
.pmart-rank-card h3 { font-size: clamp(1.1rem, 2.4vw, 1.4rem); font-weight: 600; }
.pmart-rank-body { font-size: 0.95rem; line-height: 1.75; margin-bottom: 16px; }
.pmart-rank-body a { font-weight: 700; }
.pmart-rank-meta-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; }
.pmart-meta-box { background: #f8fafc; border: 1px solid var(--pmf-line); border-radius: 13px; padding: 14px; font-size: 0.87rem; line-height: 1.6; }
.pmart-meta-box strong { display: block; color: var(--pmf-ink); margin-bottom: 3px; }
.pmart-meta-box--warn { background: #fff7ed; border-color: #fed7aa; }
.pmart-meta-box--warn strong, .pmart-meta-box--warn span { color: #9a3412; }

.pmart-more { margin-bottom: 52px; }
.pmart-more-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.pmart-more-card { background: #fff; border: 1px solid var(--pmf-line); border-radius: var(--pmf-radius); padding: 20px; }
.pmart-more-num { font-family: var(--pmf-mono); font-size: 0.75rem; font-weight: 700; color: var(--pmf-violet); margin-bottom: 8px; }
.pmart-more-card h3 { font-size: 1.05rem; margin-bottom: 8px; }
.pmart-more-card p { font-size: 0.87rem; line-height: 1.65; margin-bottom: 10px; }
.pmart-watch { font-size: 0.8rem !important; color: var(--pmf-muted) !important; line-height: 1.6 !important; margin-bottom: 0 !important; }

.pmart-ai-panel { background: linear-gradient(145deg,#1e1240 0%,#3d1f7a 55%,#2563eb 100%); border-radius: 22px; padding: 32px; }
.pmart-ai-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-bottom: 4px; }
.pmart-ai-card { border-radius: 14px; padding: 18px; background: rgba(255,255,255,.06); }
.pmart-ai-card h3 { color: #fff; font-size: 1rem; margin-bottom: 8px; }
.pmart-ai-card p { color: #d7e6ff; font-size: 0.88rem; line-height: 1.7; }

.pmart-table-wrap { overflow-x: auto; border: 1px solid var(--pmf-line); border-radius: 16px; }
.pmart-table { width: 100%; border-collapse: collapse; min-width: 720px; background: #fff; }
.pmart-table thead tr { background: var(--pmf-ink); color: #fff; }
.pmart-table th { padding: 14px 15px; text-align: left; font-family: var(--pmf-mono); font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.pmart-table td { padding: 14px 15px; border-top: 1px solid var(--pmf-line); font-size: 0.9rem; color: var(--pmf-ink-soft); }
.pmart-table td:first-child { font-weight: 700; color: var(--pmf-ink); }
.pmart-note { font-size: 0.82rem; color: var(--pmf-muted); line-height: 1.65; margin-top: 14px; }

.pmart-decision-panel { background: #fff; border: 1px solid var(--pmf-line); border-radius: 18px; padding: 24px; margin-bottom: 24px; }
.pmart-decision-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
.pmart-decision-card { background: #f8fafc; border: 1px solid var(--pmf-line); border-radius: 14px; padding: 18px; }
.pmart-decision-card strong { color: var(--pmf-ink); font-size: 0.95rem; }
.pmart-decision-card p { font-size: 0.87rem; line-height: 1.65; margin-top: 8px; }

/* ============ Blog index (page 98) — live posts grid ============ */
.pmhub-latest-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 26px;
	font-family: "Plus Jakarta Sans", sans-serif;
}
.pmhub-latest-card {
	background: #fff;
	border: 1px solid #ececf2;
	border-radius: 22px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	text-decoration: none !important;
	color: inherit;
	transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
	box-shadow: 0 1px 2px rgba(14,21,37,.04), 0 1px 3px rgba(14,21,37,.06);
}
.pmhub-latest-card:hover { transform: translateY(-6px); box-shadow: 0 24px 48px -12px rgba(14,21,37,.18); border-color: #e2e2ee; }
.pmhub-latest-cover { position: relative; height: 172px; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.pmhub-latest-cover.t-violet { background: linear-gradient(150deg,#7c3aed,#9d5cf5); }
.pmhub-latest-cover.t-blue { background: linear-gradient(150deg,#2563eb,#4f86f7); }
.pmhub-latest-cover.t-ink { background: linear-gradient(150deg,#161d33,#0b1020); }
.pmhub-latest-cover.t-indigo { background: linear-gradient(150deg,#4f46e5,#6d5ef0); }
.pmhub-latest-cover.t-slate { background: linear-gradient(150deg,#334155,#1e293b); }
.pmhub-latest-cover.t-teal { background: linear-gradient(150deg,#0e7490,#2563eb); }
.pmhub-latest-cover.t-grad { background: linear-gradient(135deg,#7c3aed,#2563eb); }
.pmhub-latest-tag { position: absolute; top: 16px; left: 16px; font-family: "JetBrains Mono", monospace; font-size: 0.64rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: rgba(14,21,37,.42); border: 1px solid rgba(255,255,255,.2); padding: 6px 11px; border-radius: 999px; }
.pmhub-latest-initial { font-family: "Newsreader", Georgia, serif; font-style: italic; font-weight: 600; font-size: 5rem; color: rgba(255,255,255,.75); line-height: 1; }
.pmhub-latest-body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.pmhub-latest-body h4 { font-family: "Newsreader", Georgia, serif; font-weight: 600; color: #0E1525; font-size: 1.22rem; line-height: 1.25; letter-spacing: -.01em; margin: 0 0 10px; }
.pmhub-latest-body p { font-size: 0.92rem; color: #6b7280; margin: 0 0 18px; flex: 1; line-height: 1.55; }
.pmhub-latest-meta { display: flex; align-items: center; gap: 10px; margin-top: auto; font-family: "JetBrains Mono", monospace; font-size: 0.72rem; color: #6b7280; text-transform: uppercase; letter-spacing: .02em; }
.pmhub-latest-meta .dot { width: 4px; height: 4px; border-radius: 999px; background: #cfcfdc; }
.pmhub-empty { text-align: center; padding: 60px 20px; color: #6b7280; }

@media (max-width: 900px) {
	.pmhub-latest-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
	.pmhub-latest-grid { grid-template-columns: 1fr; }
}

/* Article page responsive */
@media (max-width: 900px) {
	.pmart-banner { padding: 32px 22px 34px; border-radius: 20px; }
	.pmart-banner::before, .pmart-banner::after { width: 40px; }
	.pmart-shell { grid-template-columns: 1fr; grid-template-areas: "main" "toc"; gap: 28px; }
	.pmart-toc { position: static; flex-direction: row; flex-wrap: wrap; }
	.pmart-toc-card { flex: 1 1 100%; border-left: none; border-top: 2px solid var(--pmf-line); padding: 14px 0 0; }
	.pmart-toc-nav { flex-direction: row; overflow-x: auto; gap: 8px; -webkit-overflow-scrolling: touch; }
	.pmart-toc-nav a { border-bottom: none; background: var(--pmf-line); padding: 8px 14px; border-radius: 999px; white-space: nowrap; }
	.pmart-cta-card { flex: 1 1 100%; }
}
@media (max-width: 640px) {
	.pmart-wrap { padding: 24px 14px 60px; }
	.pmart-banner { padding: 26px 18px 28px; }
	.pmart-rank-card { padding: 18px; }
	.pmart-ai-panel { padding: 22px; }
}