/* Captrit Careers: listing, job rows, job page. Same tokens and grid as the rest of the site. */

/* Why Captrit: four points on hairlines */
.cj-points {
	display: grid;
	margin-top: 64px;
	border-top: 1px solid var(--wp--preset--color--paper-line);
	counter-reset: point;
}
@media (min-width: 768px) { .cj-points { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 40px; } }
@media (min-width: 1024px) { .cj-points { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 96px; } }
.cj-points > * { margin: 0; }
.cj-point { position: relative; padding: 28px 0 32px; border-bottom: 1px solid var(--wp--preset--color--paper-line); counter-increment: point; }
@media (min-width: 1024px) { .cj-point { border-bottom: 0; } }
.cj-point::before {
	content: counter(point, decimal-leading-zero);
	display: block;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px;
	color: var(--wp--preset--color--on-paper-faint);
}
.cj-point > * { margin: 0; }
.cj-point h3 { margin-top: 20px; font-size: 22px; line-height: 1.3; letter-spacing: -0.02em; }
.cj-point p { margin-top: 12px; font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--on-paper-muted); }

/* Open roles */
.cj-open { border-top: 1px solid var(--wp--preset--color--paper-line); }
.cj-open > .c-h2,
.cj-more > .c-h2 { margin-bottom: 0; }
.cj-list { margin-top: 48px; }
.cj-tabs { margin-bottom: 24px; }
.cj-rows { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--wp--preset--color--paper-line); }
.cj-rows li { border-bottom: 1px solid var(--wp--preset--color--paper-line); }
.cj-row {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 8px 24px;
	padding: 28px 0;
	color: inherit;
	text-decoration: none;
}
.cj-row:hover { text-decoration: none; }
@media (min-width: 1024px) {
	.cj-row { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 40px; align-items: center; padding: 32px 0; }
	.cj-row-main { grid-column: 1 / span 7; }
	.cj-row-meta { grid-column: 8 / span 4; }
	.cj-row-arrow { grid-column: 12; justify-self: end; }
}
.cj-row-main { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.cj-row-team,
.cj-row-meta {
	font-family: var(--wp--preset--font-family--mono);
	font-size: 12px;
	letter-spacing: 0.01em;
	line-height: 1.4;
	color: var(--wp--preset--color--on-paper-faint);
}
.cj-row-title { font-size: 24px; font-weight: 500; line-height: 1.25; letter-spacing: -0.02em; color: var(--wp--preset--color--on-paper); }
@media (min-width: 640px) { .cj-row-title { font-size: 28px; } }
.cj-row-summary { max-width: 60ch; font-size: 15px; line-height: 1.6; color: var(--wp--preset--color--on-paper-muted); }
.cj-row-meta { grid-column: 1; }
.cj-row-arrow { grid-row: 1; grid-column: 2; align-self: start; padding-top: 22px; color: var(--wp--preset--color--on-paper); transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); }
@media (min-width: 1024px) {
	.cj-row-main { grid-column: 1 / span 7; }
	.cj-row-meta { grid-column: 8 / span 4; grid-row: 1; }
	.cj-row-arrow { grid-column: 12; grid-row: 1; align-self: center; justify-self: end; padding-top: 0; }
}
.cj-row:hover .cj-row-title { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.cj-row:hover .cj-row-arrow { transform: translateX(4px); color: var(--wp--preset--color--accent); }
.cj-empty { padding: 40px 0; border-top: 1px solid var(--wp--preset--color--paper-line); border-bottom: 1px solid var(--wp--preset--color--paper-line); }
.cj-empty p { margin: 0; color: var(--wp--preset--color--on-paper-muted); }
.cj-empty .cj-empty-title { margin-bottom: 8px; font-size: 22px; font-weight: 500; letter-spacing: -0.02em; color: var(--wp--preset--color--on-paper); }
.cj-empty a { color: var(--wp--preset--color--accent); }

/* Job page header */
.cj-head .wp-block-post-terms a { pointer-events: none; }
.cj-line {
	margin: 24px 0 0;
	font-family: var(--wp--preset--font-family--mono);
	font-size: 13px;
	letter-spacing: 0.01em;
	color: var(--wp--preset--color--on-ink-muted);
}
.cj-head-actions { align-items: center !important; justify-content: flex-start !important; gap: 24px 32px !important; }
.cj-actions { margin: 0; }
.cj-apply {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	height: 48px;
	padding: 0 24px;
	background: var(--wp--preset--color--accent);
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	transition: background-color 0.2s;
}
.cj-apply:hover { background: var(--wp--preset--color--accent-hover); color: #fff; text-decoration: none; }
.cj-apply svg { transition: transform 0.3s; }
.cj-apply:hover svg { transform: translateX(2px); }
.cj-closed { margin: 0; padding: 12px 16px; border-left: 2px solid #B45309; background: rgb(255 255 255 / 0.06); font-size: 15px; }
.cj-closed a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* Job page body: description 7 cols, details card cols 9-12 */
.cj-body { padding-block: 56px 96px; }
@media (min-width: 640px) { .cj-body { padding-top: 64px; } }
.cj-grid { display: grid; gap: 48px; }
.cj-grid > * { margin: 0; }
@media (min-width: 1024px) {
	.cj-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 40px; align-items: start; }
	.cj-content { grid-column: 1 / span 7; }
	.cj-card { grid-column: 9 / span 4; position: sticky; top: 104px; }
}
.cj-content.cb-body { padding: 0; }
.cj-content .wp-block-post-content > h2:first-child { margin-top: 0; }
.cj-card {
	padding: 28px;
	background: var(--wp--preset--color--paper-2);
}
.cj-card .c-label { margin: 0 0 20px; color: #626975; }
.cj-card dl { margin: 0; }
.cj-card dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--wp--preset--color--paper-line); }
.cj-card dt { font-size: 14px; color: #555B66; }
.cj-card dd { margin: 0; font-size: 14px; font-weight: 500; text-align: right; color: var(--wp--preset--color--on-paper); }
.cj-card .cj-apply { width: 100%; margin-top: 24px; box-sizing: border-box; }
.cj-card .cj-closed { margin-top: 24px; background: transparent; color: var(--wp--preset--color--on-paper); }

.cj-more { border-top: 1px solid var(--wp--preset--color--paper-line); }

/* Labels placed directly in a constrained section stay left-aligned */
.is-layout-constrained > .c-label { width: auto; }
