/* tools.css — Layout styles not in bundle.css */
/* All colours via var(--token); no hardcoded hex values */

/* ===== GLOBAL ===== */

body {
	margin: 0;
	background: var(--cream-50);
	color: var(--ink);
	font-family: var(--font-text);
}

.ico {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.75;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex: 0 0 auto;
}

*:focus-visible {
	outline: 2px solid var(--teal-700);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

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

.pm-header__logo {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 20px;
	letter-spacing: -0.5px;
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	color: var(--ink);
	text-decoration: none;
}

.pm-header {
	position: sticky;
	top: 0;
	z-index: 100;
	transition: height 0.2s ease, background 0.2s ease;
}

.pm-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	height: 72px;
	padding: 0 32px;
	max-width: 1200px;
	margin: 0 auto;
}

.pm-header.is-stuck {
	background: var(--cream-50);
	box-shadow: 0 1px 0 var(--line);
}

.pm-header.is-stuck .pm-header__inner {
	height: 60px;
}

.pm-header.is-stuck .pm-header__logo {
	font-size: 18px;
}

/* Nav */

.pm-header__nav {
	display: flex;
	align-items: center;
	gap: 4px;
	font-family: var(--font-display);
	font-size: 15px;
}

.pm-header__nav > a {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 12px;
	border-radius: 999px;
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-header__nav > a:hover {
	color: var(--ink);
	background: var(--surface-card);
}

.pm-header__nav > a.is-current {
	color: var(--ink);
}

.pm-header__nav > a.is-current::after {
	content: "";
	width: 12px;
	height: 6px;
	border-radius: 999px;
	background: var(--teal-700);
	margin-left: 4px;
}

/* Dropdown */

.pm-header__dropdown {
	position: relative;
}

.pm-header__dropdown-trigger {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 8px 12px;
	border-radius: 999px;
	color: var(--ink-muted);
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 400;
	background: none;
	border: 0;
	cursor: pointer;
}

.pm-header__dropdown-trigger:hover,
.pm-header__dropdown-trigger[aria-expanded="true"] {
	color: var(--ink);
	background: var(--surface-card);
}

.pm-header__dropdown-trigger .ico {
	width: 16px;
	height: 16px;
}

.pm-header__dropdown-panel {
	position: absolute;
	top: 44px;
	left: 0;
	width: 300px;
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 8px;
	box-shadow: var(--shadow-float);
	z-index: 101;
}

.pm-header__dropdown-panel::before {
	content: "";
	position: absolute;
	top: -12px;
	left: 0;
	right: 0;
	height: 12px;
}

.pm-header__dropdown-panel a {
	display: block;
	padding: 12px 14px;
	border-radius: 12px;
	color: var(--ink);
	text-decoration: none;
}

.pm-header__dropdown-panel a:hover {
	background: var(--cream-50);
}

.pm-header__dropdown-panel strong {
	display: block;
	font-weight: 500;
	font-size: 15px;
}

.pm-header__dropdown-panel span {
	display: block;
	font-family: var(--font-text);
	font-size: 13px;
	color: var(--ink-muted);
	margin-top: 2px;
}

/* Burger */

.pm-header__burger {
	display: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--surface-card);
	box-shadow: inset 0 0 0 1px var(--line);
	align-items: center;
	justify-content: center;
	color: var(--ink);
	border: 0;
	cursor: pointer;
}

.pm-header__actions .pm-btn-sm {
	min-height: 36px;
	font-size: 14px;
	padding: 4px 4px 4px 14px;
}

.pm-header__actions .pm-btn-sm .pm-btn-arrow {
	width: 28px;
	height: 28px;
	font-size: 14px;
}

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

.pm-mobile-menu {
	position: fixed;
	inset: 0;
	background: var(--cream-50);
	z-index: 200;
	display: none;
	flex-direction: column;
}

.pm-mobile-menu.is-open {
	display: flex;
}

.pm-mobile-menu[hidden] {
	display: none;
}

.pm-mobile-menu__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	height: 64px;
	padding: 0 16px;
}

.pm-mobile-menu__header .pm-header__logo {
	font-size: 17px;
}

.pm-mobile-menu__close {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--surface-card);
	box-shadow: inset 0 0 0 1px var(--line);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--ink);
	border: 0;
	cursor: pointer;
}

.pm-mobile-menu__links {
	padding: 8px 16px;
	display: flex;
	flex-direction: column;
}

.pm-mobile-menu__links > a,
.pm-mobile-menu__expand {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 4px;
	border-bottom: 1px solid var(--line);
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
	letter-spacing: -0.4px;
	color: var(--ink);
	text-decoration: none;
	background: none;
	border-top: 0;
	border-left: 0;
	border-right: 0;
	width: 100%;
	cursor: pointer;
}

.pm-mobile-menu__sub {
	padding: 4px 4px 12px 4px;
	border-bottom: 1px solid var(--line);
}

.pm-mobile-menu__sub a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 4px;
	font-family: var(--font-display);
	font-size: 16px;
	font-weight: 400;
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-mobile-menu__bottom {
	margin-top: auto;
	padding: 16px;
	display: grid;
	gap: 12px;
}

.pm-mobile-menu__bottom .full {
	justify-content: space-between;
	width: 100%;
	box-sizing: border-box;
}

.pm-mobile-menu__social {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

/* ===== FOOTER ===== */

.pm-footer {
	background: var(--sand-100);
	border-radius: var(--radius-xl) var(--radius-xl) 0 0;
	padding: 56px 0 28px;
}

.pm-footer__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 32px;
}

.pm-footer__top {
	display: grid;
	grid-template-columns: 1.3fr 1fr 1fr 1fr 1.4fr;
	gap: 32px;
}

.pm-footer__top h4 {
	margin: 0 0 10px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 14px;
	color: var(--ink);
}

.pm-footer__col a,
.pm-footer__newsletter a {
	display: block;
	font-size: 14px;
	line-height: 30px;
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-footer__col a:hover {
	color: var(--ink);
}

.pm-footer__brand p {
	margin: 12px 0 0;
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
	max-width: 240px;
}

.pm-footer__social {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 16px;
}

.pm-footer__email {
	display: flex !important;
	align-items: center;
	gap: 6px;
}

.pm-footer__email .ico {
	width: 16px;
	height: 16px;
}

.pm-footer__newsletter p {
	margin: 0;
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
}

/* Newsletter form */

.pm-inline {
	display: flex;
	gap: 6px;
	background: var(--cream-50);
	border: 1px solid var(--ink-muted);
	border-radius: 999px;
	padding: 4px 4px 4px 16px;
	align-items: center;
	margin-top: 12px;
}

.pm-inline .pm-input {
	flex: 1;
	font-size: 14px;
	color: var(--ink);
	background: transparent;
	border: 0;
	outline: 0;
	min-width: 0;
}

.pm-inline .pm-input::placeholder {
	color: var(--ink-muted);
}

.pm-newsletter__message {
	font-size: 13px;
	line-height: 18px;
	margin: 8px 0 0;
	min-height: 18px;
}

.pm-newsletter__message.is-error {
	color: var(--danger-600);
}

.pm-newsletter__message.is-success {
	color: var(--teal-700);
}

/* Footer disclaimer */

.pm-footer__disclaimer {
	margin-top: 40px;
	padding: 16px 20px;
	background: var(--cream-50);
	border-radius: var(--radius-md);
	font-size: 13px;
	line-height: 20px;
	color: var(--ink);
}

.pm-footer__disclaimer strong {
	font-family: var(--font-display);
	font-weight: 500;
}

/* Footer legal */

.pm-footer__legal {
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	font-size: 12px;
	line-height: 18px;
	color: var(--ink-muted);
}

.pm-footer__legal a {
	color: var(--ink-muted);
	margin-left: 16px;
	text-decoration: none;
}

.pm-footer__legal a:hover {
	color: var(--ink);
}

/* ===== RESPONSIVE ===== */

@media (max-width: 899px) {
	.pm-header__nav {
		display: none;
	}

	.pm-header__actions {
		display: none;
	}

	.pm-header__burger {
		display: inline-flex;
	}

	.pm-header__inner {
		padding: 0 16px;
		height: 64px;
	}

	.pm-header.is-stuck .pm-header__inner {
		height: 56px;
	}

	.pm-footer__inner {
		padding: 0 16px;
	}

	.pm-footer__top {
		grid-template-columns: 1fr 1fr;
		gap: 24px;
	}

	.pm-footer__brand {
		grid-column: 1 / -1;
	}

	.pm-footer__newsletter {
		grid-column: 1 / -1;
	}
}

@media (min-width: 900px) {
	.pm-mobile-menu {
		display: none !important;
	}
}

@media (max-width: 599px) {
	.pm-footer__top {
		grid-template-columns: 1fr;
	}

	.pm-footer {
		padding: 32px 0 20px;
	}

	.pm-footer__legal {
		flex-direction: column;
		gap: 8px;
	}

	.pm-footer__legal nav a {
		margin-left: 0;
		margin-right: 16px;
	}
}

/* ===== LEGAL PAGES ===== */

.pm-legal__inner {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 32px;
}

.pm-legal__breadcrumbs {
	font-family: var(--font-display);
	font-size: 13px;
	color: var(--ink-muted);
	margin-top: 32px;
}

.pm-legal__breadcrumbs a {
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-legal__breadcrumbs a:hover {
	color: var(--ink);
}

.pm-legal__breadcrumbs span[aria-current] {
	color: var(--ink);
	font-weight: 500;
}

.pm-legal__title {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 48px;
	line-height: 50px;
	letter-spacing: -1.6px;
	margin: 14px 0 0;
}

.pm-legal__meta {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 18px;
}

.pm-legal__tabs {
	display: flex;
	gap: 8px;
	margin-top: 28px;
	overflow-x: auto;
	scrollbar-width: none;
}

.pm-legal__tabs::-webkit-scrollbar {
	display: none;
}

.pm-legal__tabs .pm-tag {
	white-space: nowrap;
	flex: 0 0 auto;
	text-decoration: none;
}

.pm-legal__layout {
	display: grid;
	grid-template-columns: 240px minmax(0, 680px);
	gap: 64px;
	margin-top: 40px;
}

.pm-legal__toc {
	position: sticky;
	top: 24px;
	align-self: start;
	font-family: var(--font-display);
	font-size: 14px;
	line-height: 30px;
	color: var(--ink-muted);
}

.pm-legal__toc-title {
	font-size: 14px;
	font-weight: 500;
	color: var(--ink);
	margin: 0 0 6px;
}

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

.pm-legal__toc-list a {
	display: flex;
	gap: 10px;
	align-items: center;
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-legal__toc-list a:hover,
.pm-legal__toc-list a.is-active {
	color: var(--ink);
}

.pm-legal__summary {
	background: var(--teal-100);
	border-radius: var(--radius-md);
	padding: 22px 24px;
}

.pm-legal__summary h2 {
	font: 500 13px/18px var(--font-display);
	color: var(--teal-700);
	margin: 0;
	display: flex;
	gap: 8px;
	align-items: center;
}

.pm-legal__summary ul {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
}

.pm-legal__summary li {
	display: flex;
	gap: 12px;
	font-size: 16px;
	line-height: 26px;
	padding: 4px 0;
}

.pm-legal__summary li::before {
	content: "";
	flex: 0 0 20px;
	height: 10px;
	border-radius: 999px;
	background: var(--teal-700);
	margin-top: 8px;
}

.pm-legal__body h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 26px;
	line-height: 32px;
	letter-spacing: -0.6px;
	margin: 44px 0 0;
	display: flex;
	gap: 12px;
}

.pm-legal__body p {
	font-size: 17px;
	line-height: 28px;
	margin: 12px 0 0;
}

.pm-legal__body a:not(.pm-btn) {
	color: var(--berry-600);
}

.pm-legal__body table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	margin-top: 16px;
	font-size: 14px;
	line-height: 21px;
	background: var(--surface-card);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.pm-legal__body th {
	font: 500 13px/18px var(--font-display);
	text-align: left;
	background: var(--sand-100);
	padding: 12px 14px;
}

.pm-legal__body td {
	padding: 12px 14px;
	border-top: 1px solid var(--line);
	vertical-align: top;
}

.pm-legal__body td:first-child {
	font-family: var(--font-display);
	font-weight: 500;
}

.pm-legal__contact {
	margin-top: 20px;
	display: flex;
	justify-content: space-between;
	gap: 16px;
	align-items: center;
	flex-wrap: wrap;
}

.pm-legal__contact h3 {
	font: 500 16px/22px var(--font-display);
	margin: 0;
}

.pm-legal__contact p {
	font-size: 14px;
	color: var(--ink-muted);
	margin: 4px 0 0;
}

.pm-legal__contact a {
	color: var(--ink);
}

/* ===== DISCLAIMER (FULL) ===== */

.pm-disclaimer-full {
	padding: 28px;
}

.pm-disclaimer-full .pm-eyebrow {
	margin-bottom: 8px;
}

.pm-disclaimer-full h3 {
	font: 500 22px/28px var(--font-display);
	letter-spacing: -0.4px;
	margin: 0;
}

.pm-disclaimer-full p {
	font-size: 15px;
	line-height: 23px;
	margin: 12px 0 0;
}

.pm-disclaimer-full__crisis {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	background: var(--sand-100);
	border-radius: var(--radius-md);
	padding: 16px 18px;
	font-size: 15px;
	line-height: 23px;
	margin-top: 16px;
}

.pm-disclaimer-full__crisis strong {
	font-family: var(--font-display);
	font-weight: 500;
}

.pm-disclaimer-full__crisis p {
	margin: 4px 0 0;
}

/* ===== ALERT (SHORT DISCLAIMER) ===== */

.pm-alert {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	padding: 14px 18px;
	border-radius: var(--radius-md);
	font-size: 14px;
	line-height: 22px;
}

.pm-alert-info {
	background: var(--teal-100);
	color: var(--ink);
}

.pm-alert .ico {
	color: var(--teal-700);
	margin-top: 1px;
}

.pm-alert p {
	margin: 0;
}

.pm-alert a {
	color: var(--ink);
	text-decoration: underline;
}

/* ===== LEGAL RESPONSIVE ===== */

@media (max-width: 899px) {
	.pm-legal__inner {
		padding: 0 16px;
	}

	.pm-legal__title {
		font-size: 36px;
		line-height: 38px;
		letter-spacing: -1.1px;
	}

	.pm-legal__layout {
		grid-template-columns: minmax(0, 1fr);
		gap: 0;
		margin-top: 24px;
	}

	.pm-legal__toc {
		position: static;
		margin-bottom: 24px;
	}

	.pm-legal__toc-title {
		cursor: pointer;
	}
}

@media (max-width: 599px) {
	.pm-legal__breadcrumbs {
		margin-top: 20px;
	}

	.pm-disclaimer-full {
		padding: 20px;
	}
}

/* ===== COOKIE CONSENT OVERRIDES ===== */
/* Adapt selectors to whichever plugin is installed */

/* --- Complianz --- */

.cmplz-cookiebanner {
	position: fixed;
	bottom: var(--space-6);
	left: var(--space-6);
	right: var(--space-6);
	max-width: 600px;
	background: var(--surface-card);
	border-radius: var(--radius-lg);
	padding: var(--space-6);
	box-shadow: var(--shadow-float);
	z-index: 9999;
	font-family: var(--font-text);
	color: var(--ink);
}

.cmplz-cookiebanner .cmplz-title {
	font: 500 18px/24px var(--font-display);
	letter-spacing: -0.3px;
	margin: 0;
}

.cmplz-cookiebanner .cmplz-message {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
	margin: 6px 0 0;
}

.cmplz-cookiebanner .cmplz-message a {
	color: var(--ink);
	text-decoration: underline;
}

.cmplz-cookiebanner .cmplz-btn {
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 500;
	border-radius: var(--radius-pill);
	padding: 10px 18px;
	min-height: 40px;
	cursor: pointer;
	border: 0;
}

.cmplz-cookiebanner .cmplz-deny,
.cmplz-cookiebanner .cmplz-accept {
	background: var(--surface-card);
	color: var(--ink);
	box-shadow: inset 0 0 0 1px var(--line);
}

.cmplz-cookiebanner .cmplz-deny:hover,
.cmplz-cookiebanner .cmplz-accept:hover {
	box-shadow: inset 0 0 0 1px var(--ink-muted);
}

.cmplz-cookiebanner .cmplz-manage-options {
	background: none;
	color: var(--ink);
	text-decoration: underline;
	padding: 5px 8px;
}

/* Complianz preferences modal */

.cmplz-categories .cmplz-category {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	justify-content: space-between;
	padding: 16px 0;
	border-top: 1px solid var(--line);
}

.cmplz-categories .cmplz-category-title {
	font: 500 15px/20px var(--font-display);
}

.cmplz-categories .cmplz-category-description {
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-muted);
}

@media (max-width: 599px) {
	.cmplz-cookiebanner {
		left: var(--space-4);
		right: var(--space-4);
		bottom: var(--space-4);
	}
}

/* --- CookieYes --- */

.cky-consent-container .cky-consent-bar {
	position: fixed;
	bottom: var(--space-6);
	left: var(--space-6);
	right: var(--space-6);
	max-width: 600px;
	background: var(--surface-card);
	border-radius: var(--radius-lg);
	padding: var(--space-6);
	box-shadow: var(--shadow-float);
	z-index: 9999;
	font-family: var(--font-text);
	color: var(--ink);
}

.cky-consent-container .cky-title {
	font: 500 18px/24px var(--font-display);
	letter-spacing: -0.3px;
}

.cky-consent-container .cky-notice-des {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
}

.cky-consent-container .cky-notice-des a {
	color: var(--ink);
	text-decoration: underline;
}

.cky-consent-container .cky-btn {
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 500;
	border-radius: var(--radius-pill);
	padding: 10px 18px;
	min-height: 40px;
	cursor: pointer;
	border: 0;
	background: var(--surface-card);
	color: var(--ink);
	box-shadow: inset 0 0 0 1px var(--line);
}

.cky-consent-container .cky-btn:hover {
	box-shadow: inset 0 0 0 1px var(--ink-muted);
}

.cky-consent-container .cky-btn-customize {
	background: none;
	color: var(--ink);
	text-decoration: underline;
	box-shadow: none;
	padding: 5px 8px;
}

@media (max-width: 599px) {
	.cky-consent-container .cky-consent-bar {
		left: var(--space-4);
		right: var(--space-4);
		bottom: var(--space-4);
	}
}

/* ===== QUIZ PAGE ===== */

/* Intro */

.pm-quiz-intro__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	max-width: 1200px;
	margin: 48px auto 0;
	padding: 0 32px;
}

.pm-quiz-intro h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 56px;
	line-height: 58px;
	letter-spacing: -2px;
	margin: 16px 0 0;
}

.pm-quiz-intro h1 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-quiz-intro__sub {
	font-size: 18px;
	line-height: 30px;
	color: var(--ink-muted);
	margin: 16px auto 0;
	max-width: 520px;
}

.pm-quiz-intro__facts {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: 20px;
}

.pm-quiz-intro__ctas {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: center;
	margin-top: 32px;
}

.pm-quiz-intro__ctas .pm-btn {
	font-size: 18px;
	min-height: 52px;
	padding: 8px 28px 8px 28px;
}

.pm-quiz-intro__ctas .pm-btn.has-arrow {
	padding: 8px 8px 8px 28px;
}

.pm-quiz-intro__ctas .pm-btn-arrow {
	width: 36px;
	height: 36px;
	font-size: 18px;
}

.pm-quiz-intro__note {
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-muted);
}

.pm-quiz-intro__note a {
	color: var(--berry-600);
}

.pm-quiz-intro__patterns {
	margin-top: 56px;
	width: 100%;
	max-width: 820px;
}

.pm-quiz-intro__patterns .pm-tray {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
}

.pm-quiz-intro__patterns .pm-card {
	padding: 18px;
	text-align: left;
}

.pm-quiz-intro__patterns .pm-card h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 10px 0 0;
}

.pm-quiz-intro__patterns .pm-card p {
	margin: 4px 0 0;
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
}

.pm-quiz-intro__patterns > .pm-quiz-intro__note {
	text-align: center;
	margin-top: 12px;
}

/* Quiz flow */

.pm-quiz-flow {
	max-width: 680px;
	margin: 0 auto;
	padding: 24px 32px 40px;
}

.pm-quiz__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-family: var(--font-display);
	font-size: 13px;
}

.pm-quiz__back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--ink-muted);
	background: none;
	border: 0;
	cursor: pointer;
	font-family: var(--font-display);
	font-size: 13px;
	padding: 8px 0;
}

.pm-quiz__back .ico {
	width: 16px;
	height: 16px;
	transform: rotate(180deg);
}

.pm-quiz__back:hover {
	color: var(--ink);
}

.pm-quiz__counter {
	color: var(--ink-muted);
}

/* Progress segments */

.pm-segs {
	display: flex;
	gap: 4px;
	margin-top: 12px;
}

.pm-seg {
	flex: 1;
	height: 6px;
	background: var(--berry-100);
	border-radius: 999px;
}

.pm-seg.is-done {
	background: var(--teal-700);
}

.pm-seg.is-active {
	background: linear-gradient(90deg, var(--teal-700) 50%, var(--berry-100) 50%);
}

/* Question */

.pm-quiz__text {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 24px;
	line-height: 30px;
	letter-spacing: -0.5px;
	margin: 20px 0 0;
}

/* Answer options */

.pm-option {
	display: flex;
	align-items: center;
	gap: 12px;
	border: 1px solid var(--line);
	border-radius: var(--radius-md);
	padding: 14px 16px;
	margin-top: 10px;
	font-size: 15px;
	line-height: 22px;
	background: var(--surface-card);
	cursor: pointer;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.pm-option:hover {
	border-color: var(--ink-muted);
}

.pm-option input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

.pm-option__radio {
	flex: 0 0 18px;
	height: 18px;
	border-radius: 50%;
	border: 1.5px solid var(--ink-muted);
	box-sizing: border-box;
	transition: border 0.15s ease;
}

.pm-option.is-selected {
	border-color: var(--teal-700);
	background: var(--teal-100);
}

.pm-option.is-selected .pm-option__radio {
	border: 5px solid var(--teal-700);
}

/* Disclaimer footer */

.pm-quiz__disclaimer {
	margin-top: 20px;
	padding-top: 12px;
	border-top: 1px solid var(--line);
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-muted);
}

/* Results */

.pm-quiz-results {
	max-width: 1060px;
	margin: 0 auto;
	padding: 24px 32px 40px;
}

.pm-quiz-results__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 400px;
	gap: 40px;
	align-items: start;
}

.pm-quiz-results__main {
	min-width: 0;
}

.pm-quiz-results__side {
	position: sticky;
	top: 24px;
	align-self: start;
}

.pm-quiz-results__title {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 28px;
	line-height: 32px;
	letter-spacing: -0.7px;
	margin: 14px 0 0;
}

.pm-accent {
	color: var(--berry-600);
}

.pm-quiz-results__bars {
	margin-top: 20px;
}

.pm-quiz-results__bar {
	margin-top: 10px;
}

.pm-quiz-results__bar.is-main {
	font-weight: 500;
}

.pm-quiz-results__bar-label {
	display: flex;
	justify-content: space-between;
	font-family: var(--font-display);
	font-size: 13px;
}

.pm-quiz-results__bar-track {
	height: 12px;
	background: var(--sand-100);
	border-radius: 999px;
	overflow: hidden;
	margin-top: 4px;
}

.pm-quiz-results__bar-fill {
	height: 100%;
	border-radius: 999px;
	transition: width 0.6s ease;
}

.pm-quiz-results__note {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
	margin: 14px 0 0;
}

.pm-quiz-results__inner > p {
	font-size: 15px;
	line-height: 24px;
	margin: 14px 0 0;
}

.pm-quiz-results__desc {
	background: var(--surface-card);
	border-radius: var(--radius-lg);
	padding: 24px 28px;
	margin-top: 24px;
	border-left: 4px solid var(--berry-600);
}

.pm-quiz-results__desc p {
	font-size: 16px;
	line-height: 26px;
	margin: 0;
	color: var(--ink);
}

.pm-quiz-results__secondary {
	background: var(--teal-100);
	border-radius: var(--radius-md);
	padding: 18px 20px;
	margin-top: 12px;
	font-size: 15px;
	line-height: 24px;
}

.pm-quiz-results__secondary strong {
	font-family: var(--font-display);
	font-weight: 500;
	color: var(--teal-700);
	display: block;
	margin-bottom: 4px;
}

.pm-quiz-results__disclaimer {
	padding: 20px 22px;
	margin-top: 20px;
}

.pm-quiz-results__disclaimer h3 {
	font: 500 16px/22px var(--font-display);
	margin: 8px 0 0;
}

.pm-quiz-results__disclaimer p {
	font-size: 14px;
	line-height: 22px;
	margin: 8px 0 0;
	color: var(--ink-muted);
}

.pm-quiz-results__disclaimer ul {
	margin: 8px 0 0;
	padding-left: 20px;
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
}

/* Share buttons */

.pm-quiz-share {
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--line);
}

.pm-quiz-share__label {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	margin: 0 0 12px;
}

.pm-quiz-share__buttons {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.pm-quiz-share__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 16px;
	border-radius: var(--radius-pill);
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 14px;
	text-decoration: none;
	cursor: pointer;
	border: 1px solid var(--line);
	background: var(--surface-card);
	color: var(--ink);
	transition: border-color 0.15s ease, background 0.15s ease;
}

.pm-quiz-share__btn:hover {
	border-color: var(--ink-muted);
}

.pm-quiz-share__btn svg {
	flex: 0 0 auto;
}

.pm-quiz-share__btn--wa:hover {
	border-color: var(--teal-700);
	color: var(--teal-700);
}

.pm-quiz-share__btn--x:hover {
	border-color: var(--ink);
}

.pm-quiz-share__btn--fb:hover {
	border-color: var(--berry-600);
	color: var(--berry-600);
}

.pm-quiz-share__btn--copy:hover {
	border-color: var(--teal-700);
}

/* Quiz page alert */

.pm-quiz-page .pm-alert {
	margin-top: 16px;
}

/* SEO content below quiz */

.pm-quiz-seo {
	display: grid;
	grid-template-columns: minmax(0, 680px);
	justify-content: center;
	margin: 120px auto 0;
	padding: 0 32px;
}

.pm-quiz-seo h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 34px;
	line-height: 38px;
	letter-spacing: -1px;
	margin: 48px 0 0;
}

.pm-quiz-seo h2:first-child {
	margin-top: 0;
}

.pm-quiz-seo h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
	line-height: 28px;
	letter-spacing: -0.4px;
	margin: 32px 0 0;
}

.pm-quiz-seo > p,
.pm-quiz-seo > ol {
	font-size: 18px;
	line-height: 30px;
	margin: 16px 0 0;
}

.pm-quiz-seo a:not(.pm-btn) {
	color: var(--berry-600);
	text-underline-offset: 3px;
}

.pm-quiz-seo ol {
	padding-left: 24px;
}

.pm-quiz-seo ol li {
	margin-top: 8px;
}

.pm-quiz-seo ol li strong {
	color: var(--ink);
}

.pm-quiz-seo strong {
	font-family: var(--font-display);
	font-weight: 500;
	color: var(--ink);
}

.pm-seo-stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 32px;
}

.pm-seo-stat {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 24px;
	text-align: center;
}

.pm-seo-stat__value {
	display: block;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 36px;
	line-height: 40px;
	letter-spacing: -1.2px;
	color: var(--teal-700);
}

.pm-seo-stat__label {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	line-height: 20px;
	color: var(--ink-muted);
}

.pm-quiz-seo .pm-callout {
	margin-top: 32px;
}

.pm-faq-item {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 18px 22px;
	margin-top: 8px;
}

.pm-faq-item summary {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 17px;
	line-height: 24px;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	cursor: pointer;
}

.pm-faq-item summary::-webkit-details-marker {
	display: none;
}

.pm-faq-item summary::after {
	content: "+";
	color: var(--berry-600);
	font-size: 20px;
	line-height: 24px;
	flex-shrink: 0;
}

.pm-faq-item[open] summary::after {
	content: "\2212";
}

.pm-faq-item p {
	font-size: 16px;
	line-height: 26px;
	margin: 12px 0 0;
	color: var(--ink-muted);
}

.pm-quiz-seo__faq {
	margin-top: 20px;
	margin-bottom: 64px;
}

/* ===== QUIZ RESPONSIVE ===== */

@media (max-width: 899px) {
	.pm-quiz-intro__inner {
		padding: 0 16px;
	}

	.pm-quiz-intro h1 {
		font-size: 38px;
		line-height: 40px;
		letter-spacing: -1.2px;
	}

	.pm-quiz-intro__patterns .pm-tray {
		grid-template-columns: 1fr 1fr;
	}

	.pm-quiz-flow {
		padding: 24px 16px 40px;
	}

	.pm-quiz-results {
		padding: 24px 16px 40px;
	}

	.pm-quiz-results__inner {
		grid-template-columns: minmax(0, 1fr);
	}

	.pm-quiz-seo {
		padding: 0 16px;
	}
}

@media (max-width: 599px) {
	.pm-quiz-intro h1 {
		font-size: 32px;
		line-height: 34px;
		letter-spacing: -1px;
	}

	.pm-quiz-intro__ctas {
		flex-direction: column;
		align-items: flex-start;
	}

	.pm-quiz-intro__patterns .pm-tray {
		grid-template-columns: 1fr;
	}
}


/* ===== Email gate: guide card ===== */

.pm-guide-tray {
	margin-top: 0;
}

.pm-guide-card {
	padding: 0;
	overflow: hidden;
}

.pm-guide-card__mock {
	position: relative;
	aspect-ratio: 16 / 10;
	border-radius: var(--radius-md) var(--radius-md) 0 0;
	background: var(--sand-100);
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: 10px;
	box-sizing: border-box;
	overflow: hidden;
}

.pm-guide-card__doc {
	position: absolute;
	left: 50%;
	top: 14%;
	width: 34%;
	height: 86%;
	transform: translateX(-50%) rotate(-4deg);
	background: var(--surface-card);
	border-radius: 6px;
	box-shadow: var(--shadow-float);
}

.pm-guide-card__doc::before {
	content: "";
	position: absolute;
	left: 12%;
	right: 12%;
	top: 12%;
	height: 18%;
	border-radius: 4px;
	background: var(--berry-100);
}

.pm-guide-card__doc::after {
	content: "";
	position: absolute;
	left: 12%;
	top: 38%;
	width: 40%;
	height: 7%;
	border-radius: 999px;
	background: var(--teal-700);
}

.pm-guide-card__label {
	position: relative;
	font-size: 11px;
	color: var(--ink-muted);
	background: color-mix(in srgb, var(--surface-card) 80%, transparent);
	border-radius: 999px;
	padding: 3px 8px;
}

.pm-guide-card .pm-chip {
	margin: 16px 16px 0;
}

.pm-guide-card__heading {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 10px 16px 0;
}

.pm-guide-card__list {
	list-style: none;
	padding: 0;
	margin: 12px 16px 0;
}

.pm-guide-card__list li {
	display: flex;
	gap: 10px;
	font-size: 14px;
	line-height: 21px;
	margin-top: 8px;
}

.pm-guide-card__form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 18px 16px 0;
}

.pm-guide-card__form .pm-input {
	border: 1px solid var(--ink-muted);
	border-radius: 999px;
	padding: 12px 18px;
	font-size: 15px;
	color: var(--ink);
	background: var(--surface-card);
	width: 100%;
	box-sizing: border-box;
}

.pm-guide-card__form .pm-input:focus {
	outline: 2px solid var(--teal-700);
	outline-offset: 1px;
	border-color: var(--teal-700);
}

.pm-guide-card__form .pm-btn {
	width: 100%;
	justify-content: center;
}

.pm-guide-card__message {
	margin: 0;
	padding: 0 16px;
	font-size: 14px;
	line-height: 21px;
	min-height: 21px;
}

.pm-guide-card__message.is-error {
	color: var(--berry-600);
}

.pm-guide-card__message.is-success {
	color: var(--teal-700);
}

.pm-guide-card__consent {
	font-size: 13px;
	line-height: 19px;
	color: var(--ink-muted);
	margin: 10px 16px 16px;
}

.pm-guide-card__consent a {
	color: var(--berry-600);
}


/* ===== Thank-you page ===== */

.pm-thankyou {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 32px;
}

.pm-thankyou__inner {
	max-width: 560px;
	margin: 48px auto 80px;
}

.pm-thankyou__confirmation {
	background: var(--teal-100);
	border-radius: var(--radius-md);
	padding: 14px 16px;
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14px;
	line-height: 21px;
	margin-bottom: 32px;
}

.pm-thankyou__confirmation svg {
	color: var(--teal-700);
	flex: 0 0 20px;
	margin-top: 1px;
}

.pm-thankyou__confirmation p {
	margin: 0;
}

.pm-thankyou h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 34px;
	line-height: 38px;
	letter-spacing: -1px;
	margin: 14px 0 0;
}

.pm-thankyou__sub {
	font-size: 16px;
	line-height: 26px;
	color: var(--ink-muted);
	margin: 10px 0 24px;
}

.pm-program-card {
	padding: 0;
	overflow: hidden;
}

.pm-program-card__mock {
	position: relative;
	aspect-ratio: 16 / 10;
	border-radius: var(--radius-md) var(--radius-md) 0 0;
	background: var(--sand-100);
	display: flex;
	align-items: flex-end;
	justify-content: flex-start;
	padding: 10px;
	box-sizing: border-box;
	overflow: hidden;
}

.pm-program-card__doc {
	position: absolute;
	left: 50%;
	top: 18%;
	width: 62%;
	height: 70%;
	transform: translateX(-50%);
	background: var(--surface-card);
	border-radius: 6px;
	box-shadow: var(--shadow-float);
}

.pm-program-card__doc::before {
	content: "";
	position: absolute;
	left: 12%;
	right: 12%;
	top: 12%;
	height: 18%;
	border-radius: 4px;
	background: var(--berry-100);
}

.pm-program-card__doc::after {
	content: "";
	position: absolute;
	left: 12%;
	top: 38%;
	width: 40%;
	height: 7%;
	border-radius: 999px;
	background: var(--teal-700);
}

.pm-program-card__doc2 {
	position: absolute;
	left: 58%;
	top: 30%;
	width: 22%;
	height: 62%;
	background: var(--surface-card);
	border-radius: 8px;
	box-shadow: var(--shadow-float);
}

.pm-program-card__label {
	position: relative;
	font-size: 11px;
	color: var(--ink-muted);
	background: color-mix(in srgb, var(--surface-card) 80%, transparent);
	border-radius: 999px;
	padding: 3px 8px;
}

.pm-program-card__chips {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	padding: 16px 16px 0;
}

.pm-program-card__heading {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 10px 16px 0;
}

.pm-program-card__desc {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-muted);
	margin: 6px 16px 0;
}

.pm-program-card__list {
	list-style: none;
	padding: 0;
	margin: 12px 16px 0;
}

.pm-program-card__list li {
	display: flex;
	gap: 10px;
	font-size: 14px;
	line-height: 21px;
	margin-top: 8px;
}

.pm-program-card .pm-btn {
	width: calc(100% - 32px);
	margin: 18px 16px 0;
	justify-content: center;
}

.pm-thankyou__skip {
	text-align: center;
	margin: 12px 16px 16px;
}

.pm-thankyou__skip a {
	font-family: var(--font-display);
	font-size: 13px;
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-thankyou__skip a:hover {
	color: var(--ink);
}

@media (max-width: 899px) {
	.pm-thankyou {
		padding: 0 16px;
	}
}

@media (max-width: 599px) {
	.pm-thankyou h1 {
		font-size: 28px;
		line-height: 32px;
		letter-spacing: -0.7px;
	}

	.pm-guide-card__form {
		padding: 14px 12px 0;
	}

	.pm-guide-card .pm-chip,
	.pm-guide-card__heading,
	.pm-guide-card__list,
	.pm-guide-card__consent {
		margin-left: 12px;
		margin-right: 12px;
	}

	.pm-guide-card__message {
		padding: 0 12px;
	}

	.pm-program-card__chips,
	.pm-program-card__heading,
	.pm-program-card__desc,
	.pm-program-card__list {
		padding-left: 12px;
		padding-right: 12px;
		margin-left: 0;
		margin-right: 0;
	}

	.pm-program-card .pm-btn {
		width: calc(100% - 24px);
		margin: 14px 12px 0;
	}

	.pm-thankyou__skip {
		margin: 10px 12px 14px;
	}
}


/* =================================================
   HOMEPAGE
   ================================================= */

.pm-home {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 32px 80px;
}

/* ===== Sections ===== */

.pm-section {
	margin-top: 120px;
}

.pm-section__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 32px;
}

.pm-section__head h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 48px;
	line-height: 50px;
	letter-spacing: -1.6px;
	margin: 14px 0 0;
	max-width: 640px;
}

.pm-section__head h2 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-section__head > p {
	margin: 12px 0 0;
	font-size: 16px;
	line-height: 26px;
	color: var(--ink-muted);
	max-width: 520px;
}

.pm-section__source {
	margin-top: 10px;
	font-size: 13px;
	color: var(--ink-muted);
}

/* ===== Hero ===== */

.pm-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
	gap: 32px;
	align-items: center;
	margin-top: 16px;
}

.pm-hero h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 64px;
	line-height: 64px;
	letter-spacing: -2.4px;
	margin: 18px 0 0;
}

.pm-hero h1 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-hero__sub {
	font-size: 18px;
	line-height: 30px;
	color: var(--ink-muted);
	margin: 20px 0 0;
	max-width: 500px;
}

.pm-hero__ctas {
	display: flex;
	gap: 12px;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 28px;
}

.pm-hero__trust {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	margin-top: 14px;
	font-size: 15px;
	color: var(--ink-muted);
}

.pm-hero__trust span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.pm-hero__visual {
	position: relative;
}

.pm-hero__visual-top {
	position: relative;
	min-height: calc(100vh - 200px);
	border-radius: var(--radius-xl);
	background: var(--sand-100);
	padding: 20px;
	box-sizing: border-box;
}

.pm-hero__photo {
	flex: 1;
}

.pm-hero__glass {
	position: absolute;
	top: 20px;
	right: 20px;
	background: color-mix(in srgb, var(--surface-card) 80%, transparent);
	border-radius: var(--radius-md);
	padding: 14px 16px;
	box-shadow: var(--shadow-float);
}

.pm-hero__glass-value {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 28px;
	letter-spacing: -1px;
}

.pm-hero__glass-label {
	font-size: 14px;
	color: var(--ink-muted);
}

.pm-hero__mini-quiz {
	position: absolute;
	bottom: 20px;
	left: 20px;
	right: 20px;
	z-index: 1;
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 16px;
	box-shadow: var(--shadow-float);
}

.pm-hero__mini-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}

.pm-hero__mini-hint {
	font-size: 13px;
	color: var(--ink-muted);
}

.pm-hero__mini-question {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 16px;
	margin: 10px 0 0;
}

.pm-hero__mini-opt {
	display: flex;
	align-items: center;
	gap: 10px;
	border: 1px solid var(--line);
	border-radius: 999px;
	padding: 8px 14px;
	font-size: 14px;
	margin-top: 8px;
	text-decoration: none;
	color: var(--ink);
	transition: border-color 0.15s, background 0.15s;
}

.pm-hero__mini-opt:hover {
	border-color: var(--teal-700);
	background: var(--teal-100);
}

.pm-hero__mini-opt--static {
	pointer-events: none;
}

.pm-hero__mini-radio {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 1.5px solid var(--ink-muted);
	display: inline-block;
	flex-shrink: 0;
	box-sizing: border-box;
}

.pm-hero__mini-radio--on {
	border: 4px solid var(--teal-700);
}

.pm-hero__mini-opt:hover .pm-hero__mini-radio {
	border-color: var(--teal-700);
}

/* ===== Founder band ===== */

.pm-founder-band {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 40px;
	align-items: center;
	background: var(--teal-100);
	border-radius: var(--radius-xl);
	padding: 24px 48px 24px 24px;
	margin-top: 120px;
}

.pm-founder-band__photo {
	aspect-ratio: 1 / 1;
	border-radius: var(--radius-lg);
	background: var(--sand-100);
}

.pm-founder-band__quote {
	margin: 16px 0 0;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 30px;
	line-height: 36px;
	letter-spacing: -0.8px;
	color: var(--ink);
	max-width: 620px;
}

.pm-founder-band__quote em {
	font-style: normal;
	color: var(--teal-700);
}

.pm-founder-band__name {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 14px 0 0;
	font-size: 14px;
	color: var(--ink);
}

.pm-founder-band__cta {
	margin-top: 20px;
}

/* ===== Path cards ===== */

.pm-path-card {
	display: flex;
	flex-direction: column;
	min-height: 220px;
}

.pm-path-card__num {
	font-family: var(--font-display);
	font-size: 14px;
	color: var(--ink-muted);
}

.pm-path-card__link {
	margin-top: auto;
	padding-top: 20px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	color: var(--ink);
	text-decoration: none;
}

.pm-path-card__link span {
	color: var(--berry-600);
}

/* ===== Bento tools ===== */

.pm-bento {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
}

.pm-bento-tool {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	text-decoration: none;
	color: var(--ink);
}

.pm-bento-tool--big {
	grid-column: span 2;
	grid-row: span 2;
}

.pm-bento-tool .pm-chip {
	align-self: flex-start;
}

.pm-bento-tool h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
	line-height: 28px;
	letter-spacing: -0.4px;
	margin: 6px 0 0;
}

.pm-bento-tool p {
	margin: 0;
	font-size: 15px;
	line-height: 24px;
	color: var(--ink-muted);
}

.pm-bento-tool__preview {
	background: var(--sand-100);
	border-radius: var(--radius-md);
	padding: 16px;
	margin-top: 12px;
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
}

.pm-bento-tool__preview .pm-hero__mini-opt {
	margin-top: 0;
}

.pm-bento-tool__preview .pm-hero__mini-question {
	margin: 0;
}

.pm-bento-tool__go {
	margin-top: auto;
	padding-top: 12px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	text-decoration: none;
	color: var(--ink);
}

.pm-bento-tool__go span {
	color: var(--berry-600);
}

/* ===== Home chips ===== */

.pm-home-chips {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.pm-home-chips .pm-chip.is-on {
	background: var(--ink);
	color: var(--cream-50);
	border-color: var(--ink);
}

.pm-home__no-articles {
	font-size: 16px;
	color: var(--ink-muted);
	grid-column: 1 / -1;
}

/* ===== Article card ===== */

.pm-article {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.pm-article-media {
	position: relative;
	aspect-ratio: 16 / 10;
	background: var(--sand-100);
	display: flex;
	align-items: flex-end;
	padding: 12px;
	box-sizing: border-box;
	overflow: hidden;
	text-decoration: none;
}

.pm-article-media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.pm-article-media .pm-chip {
	position: relative;
	z-index: 1;
}

.pm-article-body {
	padding: 16px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.pm-card-meta {
	font-size: 13px;
	color: var(--ink-muted);
}

.pm-article-title {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 6px 0 0;
}

.pm-article-title a {
	color: var(--ink);
	text-decoration: none;
}

.pm-article-link {
	margin-top: auto;
	padding-top: 12px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	color: var(--ink);
	text-decoration: none;
}

.pm-article-link span {
	color: var(--berry-600);
}

/* ===== Product cards ===== */

.pm-product-card {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.pm-product-card__cover {
	margin: 8px;
	aspect-ratio: 16 / 10;
	border-radius: var(--radius-lg);
	display: flex;
	align-items: flex-end;
	padding: 16px;
	box-sizing: border-box;
}

.pm-product-card__cover--berry {
	background: var(--berry-100);
}

.pm-product-card__cover--teal {
	background: var(--teal-100);
}

.pm-product-card__cover strong {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 20px;
	line-height: 24px;
	letter-spacing: -0.4px;
	color: var(--ink);
	max-width: 70%;
}

.pm-product-card__body {
	padding: 8px 24px 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}

.pm-product-card__footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: auto;
}

.pm-product-card__price {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
}

/* ===== Trust cards ===== */

.pm-trust-card h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 10px 0 0;
}

.pm-trust-card p {
	margin: 4px 0 0;
	font-size: 15px;
	line-height: 24px;
	color: var(--ink-muted);
}

/* ===== Tool card (quiz card for inline use) ===== */

.pm-tool-card {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pm-tool-card .pm-chip {
	align-self: flex-start;
}

.pm-tool-card h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
	line-height: 24px;
	margin: 6px 0 0;
}

.pm-tool-card p {
	margin: 0;
	font-size: 15px;
	line-height: 24px;
	color: var(--ink-muted);
}

.pm-tool-card__link {
	margin-top: auto;
	padding-top: 12px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	color: var(--ink);
	text-decoration: none;
}

.pm-tool-card__link span {
	color: var(--berry-600);
}

/* ===== Homepage newsletter ===== */

.pm-home-newsletter {
	background: var(--surface-card);
	border-radius: var(--radius-xl);
	padding: 56px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 40px;
	align-items: center;
}

.pm-home-newsletter h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 40px;
	line-height: 44px;
	letter-spacing: -1.3px;
	margin: 14px 0 0;
}

.pm-home-newsletter h2 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-home-newsletter p {
	margin: 12px 0 0;
	font-size: 16px;
	line-height: 26px;
	color: var(--ink-muted);
}

/* ===== HOMEPAGE RESPONSIVE ===== */

@media (max-width: 899px) {
	.pm-home {
		padding: 0 16px;
	}

	.pm-section {
		margin-top: 72px;
	}

	.pm-section__head h2 {
		font-size: 34px;
		line-height: 38px;
		letter-spacing: -1px;
	}

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

	.pm-hero h1 {
		font-size: 42px;
		line-height: 44px;
		letter-spacing: -1.4px;
	}

	.pm-hero__visual-top {
		min-height: 500px;
	}

	.pm-bento {
		grid-template-columns: minmax(0, 1fr);
	}

	.pm-bento-tool--big {
		grid-column: auto;
		grid-row: auto;
	}

	.pm-founder-band {
		grid-template-columns: minmax(0, 1fr);
		gap: 20px;
		padding: 16px 16px 24px;
		margin-top: 72px;
	}

	.pm-founder-band__photo {
		aspect-ratio: 4 / 3;
	}

	.pm-founder-band__quote {
		font-size: 24px;
		line-height: 30px;
	}

	.pm-home-newsletter {
		grid-template-columns: minmax(0, 1fr);
		padding: 28px;
	}

	.pm-home-newsletter h2 {
		font-size: 34px;
		line-height: 38px;
	}
}

@media (max-width: 599px) {
	.pm-hero h1 {
		font-size: 36px;
		line-height: 38px;
		letter-spacing: -1.2px;
	}

	.pm-hero__ctas {
		flex-direction: column;
		align-items: flex-start;
	}

	.pm-product-card__body {
		padding: 8px 16px 16px;
	}
}


/* =================================================
   SINGLE ARTICLE
   ================================================= */

.pm-single {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 32px;
}

.pm-breadcrumbs {
	font-family: var(--font-display);
	font-size: 13px;
	color: var(--ink-muted);
	margin-top: 24px;
}

.pm-breadcrumbs a {
	color: var(--ink-muted);
	text-decoration: none;
}

.pm-breadcrumbs a:hover {
	color: var(--ink);
}

.pm-breadcrumbs span[aria-current] {
	color: var(--ink);
	font-weight: 500;
}

.pm-single__header {
	max-width: 820px;
	margin: 20px 0 0;
}

.pm-single__header h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 48px;
	line-height: 50px;
	letter-spacing: -1.6px;
	margin: 16px 0 0;
}

.pm-single__lead {
	font-size: 20px;
	line-height: 32px;
	color: var(--ink-muted);
	margin: 16px 0 0;
	max-width: 680px;
}

.pm-single__meta {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	flex-wrap: wrap;
	font-size: 13px;
	color: var(--ink-muted);
}

.pm-single__avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--berry-100);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--font-display);
	font-weight: 500;
	color: var(--berry-600);
	font-size: 13px;
}

.pm-single__hero {
	margin-top: 32px;
	aspect-ratio: 21 / 9;
	border-radius: var(--radius-xl);
	background: var(--sand-100);
	overflow: hidden;
}

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

/* Two-column grid */

.pm-single__grid {
	display: grid;
	grid-template-columns: 240px minmax(0, 680px);
	gap: 64px;
	margin-top: 64px;
	justify-content: center;
}

/* Desktop TOC */

.pm-toc {
	position: sticky;
	top: 24px;
	align-self: start;
	font-family: var(--font-display);
	font-size: 14px;
}

.pm-toc__label {
	margin: 0 0 12px;
	font-size: 12px;
	color: var(--ink-muted);
}

.pm-toc__links a {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--ink-muted);
	text-decoration: none;
	padding: 7px 0;
}

.pm-toc__links a.is-on {
	color: var(--ink);
	font-weight: 500;
}

.pm-toc__links a.is-on::before {
	content: "";
	width: 16px;
	height: 8px;
	border-radius: 999px;
	background: var(--teal-700);
}

.pm-toc__cta {
	margin-top: 24px;
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 16px;
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-muted);
}

.pm-toc__cta strong {
	display: block;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	color: var(--ink);
	margin-bottom: 4px;
}

.pm-toc__cta span {
	display: block;
	margin-bottom: 12px;
}

/* Mobile TOC */

.pm-toc-mobile {
	display: none;
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 14px 18px;
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 500;
	margin-bottom: 16px;
}

.pm-toc-mobile summary {
	list-style: none;
	display: flex;
	justify-content: space-between;
	cursor: pointer;
}

.pm-toc-mobile summary::-webkit-details-marker {
	display: none;
}

.pm-toc-mobile summary::after {
	content: "+";
	color: var(--berry-600);
}

.pm-toc-mobile[open] summary::after {
	content: "\2212";
}

.pm-toc-mobile__links a {
	display: block;
	color: var(--ink-muted);
	text-decoration: none;
	font-weight: 400;
	padding: 6px 0;
	font-size: 14px;
}

/* Article body typography */

.pm-single__body h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 34px;
	line-height: 38px;
	letter-spacing: -1px;
	margin: 56px 0 0;
}

.pm-single__body h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
	line-height: 28px;
	letter-spacing: -0.4px;
	margin: 32px 0 0;
}

.pm-single__body > p {
	font-size: 18px;
	line-height: 30px;
	margin: 16px 0 0;
}

.pm-single__body a:not(.pm-btn) {
	color: var(--berry-600);
	text-underline-offset: 3px;
}

.pm-single__body ul {
	list-style: none;
	padding: 0;
	margin: 16px 0 0;
}

.pm-single__body ul li {
	display: flex;
	gap: 12px;
	font-size: 18px;
	line-height: 30px;
	margin-top: 8px;
}

.pm-single__body ul li::before {
	content: "";
	flex: 0 0 16px;
	height: 8px;
	border-radius: 999px;
	background: var(--teal-700);
	margin-top: 11px;
}

.pm-single__body ol {
	margin: 16px 0 0;
	padding-left: 20px;
	font-size: 18px;
	line-height: 30px;
}

.pm-single__body ol li {
	margin-top: 6px;
}

.pm-single__body figure {
	margin: 32px 0 0;
}

.pm-single__body figcaption {
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-muted);
	margin-top: 10px;
}

.pm-single__body blockquote {
	border-left: 3px solid var(--teal-700);
	padding-left: 20px;
	margin: 24px 0 0;
	font-size: 18px;
	line-height: 30px;
	color: var(--ink-muted);
}

/* Author bio */

.pm-author-bio {
	display: flex;
	gap: 20px;
	align-items: center;
	background: var(--surface-card);
	border-radius: var(--radius-lg);
	padding: 24px;
	margin-top: 40px;
}

.pm-author-bio__photo {
	flex: 0 0 96px;
	height: 96px;
	border-radius: var(--radius-lg);
	background: var(--sand-100);
}

.pm-author-bio__content strong {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 18px;
}

.pm-author-bio__content p {
	font-size: 15px;
	line-height: 24px;
	color: var(--ink-muted);
	margin: 4px 0 0;
}

.pm-author-bio__content a {
	color: var(--berry-600);
}

/* Related articles */

.pm-related {
	margin-top: 96px;
}

.pm-related h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 34px;
	letter-spacing: -1px;
	margin: 12px 0 24px;
}

/* ===== SINGLE ARTICLE RESPONSIVE ===== */

@media (max-width: 899px) {
	.pm-single {
		padding: 0 16px;
	}

	.pm-single__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
		margin-top: 32px;
	}

	.pm-toc {
		display: none;
	}

	.pm-toc-mobile {
		display: block;
	}

	.pm-single__header h1 {
		font-size: 34px;
		line-height: 38px;
	}

	.pm-single__hero {
		aspect-ratio: 4 / 3;
	}

	.pm-related {
		margin-top: 56px;
	}
}

@media (max-width: 599px) {
	.pm-single__header h1 {
		font-size: 28px;
		line-height: 32px;
		letter-spacing: -0.7px;
	}

	.pm-author-bio {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* ===========================
   BLOG ARCHIVE / CATEGORY / SEARCH
   =========================== */

.pm-blog {
	max-width: 1200px;
	margin: 0 auto;
	padding: 48px var(--space-400) 72px;
	display: flex;
	flex-direction: column;
	gap: 48px;
}

.pm-blog__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
}

.pm-blog__header h1 {
	font-family: var(--font-display);
	font-size: 48px;
	line-height: 52px;
	font-weight: 500;
	letter-spacing: -1.2px;
	color: var(--ink);
	margin: 8px 0 0;
}

.pm-blog__header h1 em {
	color: var(--berry-600);
	font-style: normal;
}

.pm-blog__sub {
	font-size: 18px;
	line-height: 28px;
	color: var(--ink-soft);
	max-width: 600px;
	margin-top: 8px;
}

.pm-blog__search {
	display: flex;
	gap: 8px;
}

.pm-blog__search .pm-input {
	min-width: 260px;
}

/* Breadcrumbs (reuse from single) */
.pm-blog .pm-breadcrumbs {
	margin-bottom: -24px;
}

/* Category filter chips */
.pm-blog__filters {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.pm-tag {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 16px;
	border-radius: var(--radius-full);
	border: 1px solid var(--border);
	background: var(--surface-card);
	font-size: 14px;
	font-weight: 500;
	color: var(--ink-soft);
	text-decoration: none;
	transition: background 0.15s, color 0.15s, border-color 0.15s;
	cursor: pointer;
}

.pm-tag:hover {
	background: var(--sand-100);
	color: var(--ink);
	border-color: var(--ink-soft);
}

.pm-tag.is-on {
	background: var(--ink);
	color: var(--surface-card);
	border-color: var(--ink);
}

.pm-tag__count {
	font-size: 12px;
	opacity: 0.6;
}

/* Featured sticky article */
.pm-blog__featured {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	background: var(--surface-card);
	border-radius: var(--radius-card);
	border: 1px solid var(--border);
	overflow: hidden;
}

.pm-blog__featured-img {
	display: block;
	min-height: 320px;
	background: var(--sand-100);
}

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

.pm-blog__featured-img--empty {
	background: var(--sand-100);
}

.pm-blog__featured-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 16px;
	padding: 40px 40px 40px 0;
}

.pm-blog__featured-text h2 {
	font-family: var(--font-display);
	font-size: 28px;
	line-height: 32px;
	font-weight: 500;
	letter-spacing: -0.7px;
	color: var(--ink);
	margin: 0;
}

.pm-blog__featured-text h2 a {
	color: inherit;
	text-decoration: none;
}

.pm-blog__featured-text h2 a:hover {
	color: var(--berry-600);
}

.pm-blog__featured-text p {
	font-size: 16px;
	line-height: 24px;
	color: var(--ink-soft);
}

.pm-blog__featured-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--ink-soft);
}

.pm-blog__featured-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--teal-100);
}

/* Article grid */
.pm-blog__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}

/* Tool break card inside grid */
.pm-blog__toolbreak {
	grid-column: 1 / -1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding: 32px 40px;
	background: var(--teal-100);
	border-radius: var(--radius-card);
}

.pm-blog__toolbreak h3 {
	font-family: var(--font-display);
	font-size: 22px;
	line-height: 28px;
	font-weight: 500;
	letter-spacing: -0.3px;
	color: var(--ink);
	margin: 4px 0;
}

.pm-blog__toolbreak p {
	font-size: 16px;
	line-height: 24px;
	color: var(--ink-soft);
}

.pm-blog__empty {
	grid-column: 1 / -1;
	text-align: center;
	font-size: 18px;
	color: var(--ink-soft);
	padding: 64px 0;
}

/* Pagination */
.pm-blog__pagination .nav-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.pm-blog__pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: var(--radius-full);
	border: 1px solid var(--border);
	font-size: 14px;
	font-weight: 500;
	color: var(--ink-soft);
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}

.pm-blog__pagination .page-numbers:hover {
	background: var(--sand-100);
	color: var(--ink);
}

.pm-blog__pagination .page-numbers.current {
	background: var(--ink);
	color: var(--surface-card);
	border-color: var(--ink);
}

.pm-blog__pagination .prev,
.pm-blog__pagination .next {
	border: none;
	color: var(--berry-600);
}

/* Newsletter band (blog) — styled like homepage newsletter */
.pm-blog__newsletter {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	align-items: center;
	padding: 56px;
	background: var(--surface-card);
	border-radius: var(--radius-xl);
}

.pm-blog__newsletter h2 {
	font-family: var(--font-display);
	font-size: 36px;
	line-height: 40px;
	font-weight: 500;
	letter-spacing: -1px;
	color: var(--ink);
	margin: 14px 0 0;
}

/* Category "start here" box */
.pm-cat-start {
	display: flex;
	gap: 24px;
	align-items: flex-start;
	padding: 32px;
	background: var(--teal-100);
	border-radius: var(--radius-card);
}

.pm-cat-start__icon {
	font-size: 24px;
	color: var(--teal-700);
	flex-shrink: 0;
	margin-top: 2px;
}

.pm-cat-start strong {
	font-family: var(--font-display);
	font-size: 18px;
	font-weight: 500;
	color: var(--ink);
}

.pm-cat-start p {
	font-size: 16px;
	line-height: 24px;
	color: var(--ink-soft);
	margin: 4px 0 16px;
}

/* Search empty state */
.pm-search-empty {
	text-align: center;
	padding: 80px 0;
}

.pm-search-empty__pill {
	width: 48px;
	height: 20px;
	background: var(--teal-700);
	border-radius: var(--radius-full);
	margin: 0 auto 24px;
}

.pm-search-empty__text {
	font-size: 18px;
	line-height: 28px;
	color: var(--ink);
	margin-bottom: 24px;
}

.pm-search-empty__chips {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin-bottom: 32px;
}

.pm-search-empty__caveat {
	font-size: 14px;
	line-height: 20px;
	color: var(--ink-soft);
	max-width: 480px;
	margin: 0 auto;
}

/* Responsive: tablet */
@media (max-width: 899px) {
	.pm-blog__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.pm-blog__search .pm-input {
		min-width: 200px;
	}

	.pm-blog__featured {
		grid-template-columns: 1fr;
	}

	.pm-blog__featured-text {
		padding: 24px;
	}

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

	.pm-blog__newsletter {
		grid-template-columns: 1fr;
		padding: 32px;
	}

	.pm-blog__toolbreak {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Responsive: phone */
@media (max-width: 599px) {
	.pm-blog {
		padding-top: 32px;
		gap: 32px;
	}

	.pm-blog__header h1 {
		font-size: 28px;
		line-height: 32px;
		letter-spacing: -0.7px;
	}

	.pm-blog__search {
		flex-direction: column;
	}

	.pm-blog__search .pm-input {
		min-width: 0;
		width: 100%;
	}

	.pm-blog__filters {
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.pm-blog__filters::-webkit-scrollbar {
		display: none;
	}

	.pm-tag {
		white-space: nowrap;
	}

	.pm-blog__grid {
		grid-template-columns: 1fr;
	}

	.pm-blog__featured-text h2 {
		font-size: 22px;
		line-height: 26px;
	}

	.pm-blog__newsletter {
		padding: 28px;
	}

	.pm-blog__newsletter h2 {
		font-size: 24px;
		line-height: 28px;
		letter-spacing: -0.6px;
	}

	.pm-blog__toolbreak {
		padding: 24px;
	}

	.pm-cat-start {
		flex-direction: column;
		gap: 16px;
		padding: 24px;
	}
}

/* ===========================
   ABOUT PAGE
   =========================== */

.pm-about {
	max-width: 1200px;
	margin: 0 auto;
	padding: 40px var(--space-400) 0;
}

/* Hero */
.pm-about__hero {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
	gap: 48px;
	align-items: center;
}

.pm-about__hero-text h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 60px;
	line-height: 62px;
	letter-spacing: -2.2px;
	color: var(--ink);
	margin: 16px 0 0;
}

.pm-about__hero-text h1 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-about__sub {
	font-size: 19px;
	line-height: 31px;
	color: var(--ink-soft);
	margin: 18px 0 0;
	max-width: 540px;
}

.pm-about__facts {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 22px 0 26px;
}

/* Photo placeholder slots */
.pm-about__photo-slot {
	position: relative;
	border-radius: var(--radius-xl);
	background: var(--sand-100);
	aspect-ratio: 4 / 5;
	overflow: hidden;
}

.pm-about__photo-slot--wide {
	aspect-ratio: 3 / 2;
}

.pm-about__hero-photo .pm-about__photo-slot {
	min-height: 400px;
}

.pm-about__chipfloat {
	position: absolute;
	right: 18px;
	bottom: 18px;
	background: color-mix(in srgb, var(--surface-card) 88%, transparent);
	backdrop-filter: blur(8px);
	box-shadow: var(--shadow-float);
	border-radius: var(--radius-md);
	padding: 12px 16px;
	font-size: 13px;
	line-height: 18px;
	max-width: 200px;
}

.pm-about__chipfloat strong {
	display: block;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	line-height: 20px;
}

.pm-about__chipfloat span {
	color: var(--ink-soft);
}

/* Story section */
.pm-about__story {
	display: grid;
	grid-template-columns: 240px minmax(0, 680px);
	gap: 64px;
	margin-top: 96px;
	justify-content: center;
}

.pm-about__side {
	position: sticky;
	top: 24px;
	align-self: start;
}

.pm-about__side strong {
	display: block;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 14px;
	color: var(--ink);
	margin-bottom: 12px;
}

.pm-about__sidenav {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.pm-about__sidenav a {
	display: flex;
	gap: 10px;
	align-items: center;
	font-family: var(--font-display);
	font-size: 14px;
	line-height: 30px;
	color: var(--ink-soft);
	text-decoration: none;
	transition: color 0.15s;
}

.pm-about__sidenav a:hover,
.pm-about__sidenav a.is-on {
	color: var(--ink);
}

.pm-about__body h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 34px;
	line-height: 38px;
	letter-spacing: -1px;
	color: var(--ink);
	margin: 0;
}

.pm-about__body h2 + h2,
.pm-about__body h2:not(:first-child) {
	margin-top: 56px;
}

.pm-about__body p {
	font-size: 18px;
	line-height: 30px;
	color: var(--ink);
	margin: 16px 0 0;
}

.pm-about__quote {
	margin: 36px 0;
	padding: 0 0 0 24px;
	border-left: 3px solid var(--teal-700);
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 26px;
	line-height: 34px;
	letter-spacing: -0.5px;
	color: var(--ink);
}

.pm-about__quote em {
	font-style: normal;
	color: var(--teal-700);
}

.pm-about__figure {
	margin: 36px 0 0;
}

.pm-about__figure figcaption {
	font-size: 13px;
	line-height: 20px;
	color: var(--ink-soft);
	margin-top: 10px;
}

/* Sections (timeline, principles, photo strip) */
.pm-about__sec {
	margin-top: 96px;
}

.pm-about__sec-head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 24px;
}

.pm-about__sec-head h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 40px;
	line-height: 44px;
	letter-spacing: -1.3px;
	color: var(--ink);
	margin: 14px 0 0;
}

.pm-about__sec-head h2 em {
	font-style: normal;
	color: var(--berry-600);
}

/* Timeline */
.pm-about__timeline {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	background: var(--sand-100);
	border-radius: var(--radius-lg);
	padding: 8px;
	margin-top: 32px;
}

.pm-about__tl-card {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 22px;
}

.pm-about__tl-card--now {
	background: var(--teal-100);
}

.pm-about__tl-yr {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 13px;
	line-height: 18px;
	color: var(--teal-700);
	display: flex;
	align-items: center;
	gap: 8px;
}

.pm-about__tl-card h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 20px;
	line-height: 26px;
	letter-spacing: -0.3px;
	color: var(--ink);
	margin: 12px 0 0;
}

.pm-about__tl-card p {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-soft);
	margin: 8px 0 0;
}

/* Principles */
.pm-about__principles {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
	margin-top: 32px;
}

.pm-about__princ-card {
	padding: 28px;
}

.pm-about__princ-card h3 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 22px;
	line-height: 28px;
	letter-spacing: -0.4px;
	color: var(--ink);
	margin: 0;
}

.pm-about__list {
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
}

.pm-about__list li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 16px;
	line-height: 26px;
	color: var(--ink);
	padding: 7px 0;
}

.pm-about__list li::before {
	content: "";
	flex: 0 0 20px;
	height: 10px;
	border-radius: var(--radius-full);
	background: var(--teal-700);
	margin-top: 8px;
}

.pm-about__list--no li::before {
	background: var(--ink-soft);
}

.pm-about__disclose {
	background: var(--sand-100);
	border-radius: var(--radius-md);
	padding: 16px 18px;
	margin-top: 16px;
	font-size: 14px;
	line-height: 22px;
	color: var(--ink);
}

.pm-about__disclose strong {
	font-family: var(--font-display);
	font-weight: 500;
}

/* Photo strip */
.pm-about__strip {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin-top: 32px;
}

/* Closing CTA */
.pm-about__close {
	background: var(--surface-card);
	border-radius: var(--radius-xl);
	padding: 48px;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
	gap: 40px;
	align-items: center;
	margin-top: 96px;
	margin-bottom: 96px;
}

.pm-about__close h2 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 38px;
	line-height: 42px;
	letter-spacing: -1.2px;
	color: var(--ink);
	margin: 14px 0 0;
}

.pm-about__close h2 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-about__close p {
	font-size: 16px;
	line-height: 26px;
	color: var(--ink-soft);
	margin: 12px 0 22px;
}

.pm-about__contact {
	display: grid;
	gap: 8px;
}

.pm-about__contact a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: var(--cream-50);
	border-radius: var(--radius-md);
	padding: 14px 18px;
	color: var(--ink);
	text-decoration: none;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	line-height: 20px;
	transition: background 0.15s;
}

.pm-about__contact a:hover {
	background: var(--sand-100);
}

.pm-about__contact a span {
	color: var(--ink-soft);
	font-family: var(--font-text);
	font-weight: 400;
	font-size: 13px;
}

/* About responsive: tablet */
@media (max-width: 899px) {
	.pm-about__hero {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.pm-about__hero-photo {
		order: -1;
	}

	.pm-about__hero-text h1 {
		font-size: 42px;
		line-height: 44px;
		letter-spacing: -1.4px;
	}

	.pm-about__story {
		grid-template-columns: 1fr;
		gap: 0;
		margin-top: 64px;
	}

	.pm-about__side {
		display: none;
	}

	.pm-about__body h2 {
		font-size: 28px;
		line-height: 32px;
	}

	.pm-about__quote {
		font-size: 22px;
		line-height: 30px;
	}

	.pm-about__sec {
		margin-top: 64px;
	}

	.pm-about__sec-head {
		flex-direction: column;
		align-items: flex-start;
	}

	.pm-about__sec-head h2 {
		font-size: 32px;
		line-height: 36px;
	}

	.pm-about__timeline {
		grid-template-columns: 1fr;
	}

	.pm-about__principles {
		grid-template-columns: 1fr;
	}

	.pm-about__strip {
		grid-template-columns: 1fr 1fr;
	}

	.pm-about__strip .pm-about__photo-slot:first-child {
		grid-column: 1 / -1;
		aspect-ratio: 4 / 3;
	}

	.pm-about__close {
		grid-template-columns: 1fr;
		padding: 28px;
		margin-top: 64px;
		margin-bottom: 64px;
	}

	.pm-about__close h2 {
		font-size: 30px;
		line-height: 34px;
	}
}

/* About responsive: phone */
@media (max-width: 599px) {
	.pm-about__hero-text h1 {
		font-size: 32px;
		line-height: 36px;
		letter-spacing: -1px;
	}

	.pm-about__sub {
		font-size: 17px;
		line-height: 28px;
	}

	.pm-about__facts {
		flex-direction: column;
	}

	.pm-about__close h2 {
		font-size: 26px;
		line-height: 30px;
	}
}

/* ===========================
   404 PAGE
   =========================== */

.pm-404 {
	max-width: 720px;
	margin: 72px auto 0;
	padding: 0 var(--space-400);
	text-align: center;
}

.pm-404__hero {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.pm-404__big {
	display: inline-flex;
	align-items: center;
	gap: 0.06em;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 200px;
	line-height: 1;
	letter-spacing: -8px;
	color: var(--ink);
}

.pm-404__big .pm-pill {
	width: 0.86em;
	height: 0.43em;
}

.pm-404 h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 44px;
	line-height: 48px;
	letter-spacing: -1.5px;
	color: var(--ink);
	margin: 28px 0 0;
}

.pm-404 h1 em {
	font-style: normal;
	color: var(--berry-600);
}

.pm-404__sub {
	font-size: 18px;
	line-height: 30px;
	color: var(--ink-soft);
	margin: 14px auto 0;
	max-width: 560px;
}

.pm-404__search {
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--surface-card);
	border: 1px solid var(--border);
	border-radius: var(--radius-full);
	padding: 5px 5px 5px 18px;
	min-height: 52px;
	max-width: 520px;
	margin: 32px auto 0;
	text-align: left;
}

.pm-404__search svg {
	flex: 0 0 18px;
	color: var(--ink-soft);
}

.pm-404__search .pm-input {
	flex: 1;
	min-width: 0;
	border: none;
	background: transparent;
	padding: 0;
}

.pm-404__search .pm-input:focus {
	outline: none;
	box-shadow: none;
}

/* Route cards */
.pm-404__routes {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	background: var(--sand-100);
	border-radius: var(--radius-lg);
	padding: 8px;
	margin: 56px 0 96px;
}

.pm-404__route-card {
	background: var(--surface-card);
	border-radius: var(--radius-md);
	padding: 24px;
	color: var(--ink);
	text-decoration: none;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 8px;
	transition: box-shadow 0.15s;
}

.pm-404__route-card:hover {
	box-shadow: var(--shadow-float);
}

.pm-404__route-card .pm-chip {
	align-self: flex-start;
}

.pm-404__route-card strong {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 20px;
	line-height: 26px;
	letter-spacing: -0.3px;
}

.pm-404__route-desc {
	font-size: 14px;
	line-height: 22px;
	color: var(--ink-soft);
}

.pm-404__route-go {
	margin-top: auto;
	padding-top: 12px;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 14px;
	color: var(--ink);
}

.pm-404__route-go span {
	color: var(--berry-600);
}

/* 404 responsive */
@media (max-width: 899px) {
	.pm-404 {
		margin-top: 40px;
	}

	.pm-404__big {
		font-size: 120px;
		letter-spacing: -5px;
	}

	.pm-404 h1 {
		font-size: 32px;
		line-height: 36px;
	}

	.pm-404__routes {
		grid-template-columns: 1fr;
		margin-top: 40px;
	}
}

/* 404 responsive: phone */
@media (max-width: 599px) {
	.pm-404__big {
		font-size: 90px;
		letter-spacing: -4px;
	}

	.pm-404 h1 {
		font-size: 26px;
		line-height: 30px;
		letter-spacing: -0.8px;
	}

	.pm-404__search {
		flex-direction: column;
		border-radius: var(--radius-md);
		padding: 12px;
	}

	.pm-404__search svg {
		display: none;
	}

	.pm-404__search .pm-input {
		width: 100%;
	}
}


/* ===== CONTACT PAGE ===== */

.pm-contact {
	max-width: 680px;
	margin: 0 auto;
	padding: 64px 32px 96px;
}

.pm-contact__inner {
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.pm-contact__header h1 {
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 48px;
	line-height: 50px;
	letter-spacing: -1.6px;
	margin: 16px 0 0;
}

.pm-contact__sub {
	font-size: 18px;
	line-height: 30px;
	color: var(--ink-muted);
	margin: 16px 0 0;
}

.pm-contact__email {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 16px;
	font-family: var(--font-display);
	font-size: 15px;
	font-weight: 500;
	color: var(--berry-600);
	text-decoration: none;
}

.pm-contact__email:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pm-contact__form-wrap {
	background: var(--surface-card);
	border-radius: var(--radius-xl);
	padding: 40px;
}

.pm-contact-form {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.pm-contact-form__field label {
	display: block;
	font-family: var(--font-display);
	font-weight: 500;
	font-size: 15px;
	margin-bottom: 8px;
	color: var(--ink);
}

.pm-contact-form__field input,
.pm-contact-form__field textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 14px 18px;
	font-family: var(--font-text);
	font-size: 16px;
	line-height: 24px;
	color: var(--ink);
	background: var(--cream-50);
	border: 1px solid var(--line);
	border-radius: var(--radius-md);
	transition: border-color 0.15s ease;
}

.pm-contact-form__field input::placeholder,
.pm-contact-form__field textarea::placeholder {
	color: var(--ink-muted);
}

.pm-contact-form__field input:focus,
.pm-contact-form__field textarea:focus {
	outline: none;
	border-color: var(--teal-700);
	box-shadow: 0 0 0 3px var(--teal-100);
}

.pm-contact-form__field textarea {
	resize: vertical;
	min-height: 120px;
}

.pm-contact-form__status {
	padding: 14px 18px;
	border-radius: var(--radius-md);
	font-size: 15px;
	line-height: 22px;
}

.pm-contact-form__status--success {
	background: var(--teal-100);
	color: var(--teal-700);
}

.pm-contact-form__status--error {
	background: var(--berry-100);
	color: var(--berry-600);
}

@media (max-width: 599px) {
	.pm-contact {
		padding: 32px 16px 64px;
	}

	.pm-contact__header h1 {
		font-size: 34px;
		line-height: 38px;
		letter-spacing: -1.2px;
	}

	.pm-contact__form-wrap {
		padding: 24px;
		border-radius: var(--radius-lg);
	}
}