/**
 * Editorial pages: universities index, the portal gate, publishers, contact, help,
 * plus the blog/archive fallback that index.php renders.
 *
 * Loaded only on those templates — see inc/enqueue.php. Logical properties throughout.
 */

/* ---- Shared page chrome ------------------------------------------------- */

.jd-page { padding-block: var(--jd-space-16) var(--jd-space-24); }

.jd-page__head { margin-block-end: var(--jd-space-12); }

.jd-page__title {
	font-size: var(--jd-fs-display);
	line-height: var(--jd-lh-title);
	margin: 0 0 var(--jd-space-5);
}

.jd-page__intro,
.jd-prose {
	font-size: var(--jd-fs-sm);
	color: var(--jd-text-secondary);
	line-height: var(--jd-lh-body);
	max-inline-size: 68ch;
	text-wrap: pretty;
}

.jd-prose > :first-child { margin-block-start: 0; }
.jd-prose > :last-child { margin-block-end: 0; }

.jd-prose h2,
.jd-prose h3 {
	color: var(--jd-navy);
	margin-block: var(--jd-space-12) var(--jd-space-5);
}

.jd-prose h2 { font-size: var(--jd-fs-title); }
.jd-prose h3 { font-size: var(--jd-fs-lg); }
.jd-prose p { margin-block: 0 var(--jd-space-6); }

.jd-prose a {
	color: var(--jd-navy);
	border-block-end: 1px solid var(--jd-hairline);
	transition: border-color var(--jd-transition);
}

.jd-prose a:hover { border-block-end-color: var(--jd-navy); }

.jd-prose ul,
.jd-prose ol { margin-block: 0 var(--jd-space-6); padding-inline-start: var(--jd-space-9); }

.jd-prose li { margin-block-end: var(--jd-space-3); }

.jd-prose img { max-inline-size: 100%; block-size: auto; border-radius: var(--jd-radius-tag); }

.jd-prose blockquote {
	margin: var(--jd-space-9) 0;
	padding-inline-start: var(--jd-space-8);
	border-inline-start: 2px solid var(--jd-brass);
	font-family: var(--jd-font-display);
	font-size: var(--jd-fs-lg);
	color: var(--jd-navy);
}

/* Wide content must scroll inside itself rather than pushing the page sideways. */
.jd-prose table { display: block; overflow-x: auto; max-inline-size: 100%; }
.jd-prose pre { overflow-x: auto; }

/* ---- Universities index (05) -------------------------------------------- */

.jd-unis { padding-block: var(--jd-space-20) var(--jd-space-24); }

.jd-unis__head { max-inline-size: 680px; }
.jd-unis__kicker { color: var(--jd-text-secondary); margin: 0 0 var(--jd-space-3); }

.jd-unis__title {
	font-size: 36px;
	line-height: var(--jd-lh-title);
	margin: 0 0 var(--jd-space-5);
}

.jd-unis__intro { margin-block-end: var(--jd-space-11); }

.jd-unis__search { max-inline-size: 520px; }

.jd-unis__search .jd-input {
	min-block-size: 52px;
	inline-size: 100%;
	padding-inline: var(--jd-space-8);
	border: var(--jd-border);
	border-radius: var(--jd-radius-btn);
	background-color: var(--jd-surface);
	font-family: var(--jd-font-ui);
	font-size: 13.5px;
	color: var(--jd-ink);
	outline: none;
	transition: border-color var(--jd-transition);
}

.jd-unis__search .jd-input:focus { border-color: var(--jd-navy); }

.jd-unis__group { margin-block-start: var(--jd-space-16); }

.jd-unis__grouptitle {
	display: flex;
	align-items: center;
	gap: var(--jd-space-8);
	font-size: 11px;
	color: var(--jd-text-secondary);
	margin: 0 0 var(--jd-space-2);
}

.jd-unis__grouptitle::after {
	content: "";
	flex: 1;
	block-size: 1px;
	background-color: var(--jd-hairline);
}

/* Two columns, as in the prototype. `columns` rather than grid because the rows are a
   single flowing list and break-inside keeps each row whole. */
.jd-unis__list {
	columns: 2;
	column-gap: var(--jd-space-20);
	list-style: none;
	margin: 0;
	padding: 0;
}

@media (max-width: 768px) { .jd-unis__list { columns: 1; } }

.jd-unis__item { break-inside: avoid; }

.jd-unis__link {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--jd-space-6);
	padding: var(--jd-space-6) var(--jd-space-3);
	border-block-end: 1px solid var(--jd-paper-deep);
	color: var(--jd-ink);
	transition: background-color var(--jd-transition);
}

.jd-unis__link:hover { background-color: var(--jd-paper); }
.jd-unis__name { font-size: 13.5px; font-weight: 500; }

.jd-unis__meta {
	display: flex;
	align-items: baseline;
	gap: var(--jd-space-4);
	flex-shrink: 0;
}

.jd-unis__lock {
	border: 1px solid rgb(24 41 94 / .35);
	border-radius: var(--jd-radius-tag);
	padding: 2px var(--jd-space-4);
	font-size: 10px;
	font-weight: 500;
	color: var(--jd-navy);
	white-space: nowrap;
}

.jd-unis__count { font-size: 10.5px; color: var(--jd-text-muted); }

/* The arrow points along the reading direction, so it must flip with the language. */
.jd-unis__link::after {
	content: "\2190";
	color: var(--jd-text-muted);
	font-size: var(--jd-fs-2xs);
}

:dir(ltr) .jd-unis__link::after { content: "\2192"; }

.jd-unis__noresults {
	background-color: var(--jd-surface);
	border: var(--jd-border);
	border-radius: var(--jd-radius-card);
	padding: var(--jd-space-20);
	text-align: center;
	color: var(--jd-text-secondary);
	margin-block-start: var(--jd-space-12);
}

.jd-unis__ask {
	border: var(--jd-border);
	border-radius: var(--jd-radius-card);
	background-color: var(--jd-surface);
	padding: var(--jd-space-9) var(--jd-space-11);
	display: flex;
	align-items: center;
	gap: var(--jd-space-7);
	flex-wrap: wrap;
	margin-block-start: var(--jd-space-20);
}

.jd-unis__askbody {
	font-size: var(--jd-fs-xs);
	color: var(--jd-ink);
	line-height: 1.9;
	flex: 1;
	min-inline-size: 260px;
	margin: 0;
}

/* ---- Portal gate (06) --------------------------------------------------- */

.jd-gate { padding-block: var(--jd-space-20) var(--jd-space-24); }

.jd-gate__card {
	max-inline-size: 520px;
	margin-inline: auto;
	background-color: var(--jd-surface);
	border: var(--jd-border);
	border-radius: var(--jd-radius-card);
	box-shadow: var(--jd-shadow-card);
	padding: var(--jd-space-13);
}

.jd-gate__title {
	display: flex;
	align-items: center;
	gap: var(--jd-space-5);
	font-size: 21px;
	margin: 0 0 var(--jd-space-5);
}

.jd-gate__lock { display: inline-flex; color: var(--jd-navy); }

.jd-gate__lede {
	border-block: var(--jd-border);
	padding-block: var(--jd-space-4);
	font-size: var(--jd-fs-2xs);
	color: var(--jd-text-secondary);
	line-height: 2;
	margin: 0 0 var(--jd-space-9);
}

.jd-gate__body { margin-block-end: var(--jd-space-9); }

.jd-gate__actions { display: grid; gap: var(--jd-space-5); }
.jd-gate__actions .jd-btn { inline-size: 100%; min-block-size: 48px; }

.jd-gate__help {
	font-size: 11.5px;
	color: var(--jd-text-secondary);
	line-height: 1.9;
	margin-block: var(--jd-space-6) 0;
}

.jd-gate__help a { color: var(--jd-navy); font-weight: 500; border-block-end: 1px solid var(--jd-navy); }

.jd-notice {
	border: var(--jd-border);
	border-radius: var(--jd-radius-btn);
	padding: var(--jd-space-5) var(--jd-space-8);
	font-size: var(--jd-fs-2xs);
	margin-block-end: var(--jd-space-9);
}

.jd-notice--info { border-color: rgb(24 41 94 / .3); color: var(--jd-navy); background-color: var(--jd-surface); }
.jd-notice p { margin: 0; }

/* ---- Publishers (14) ---------------------------------------------------- */

.jd-pubs { padding-block: var(--jd-space-16) var(--jd-space-24); }

.jd-pubs__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--jd-space-8);
}

@media (max-width: 1080px) { .jd-pubs__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px)  { .jd-pubs__grid { grid-template-columns: minmax(0, 1fr); } }

.jd-pub {
	background-color: var(--jd-surface);
	border: var(--jd-border);
	border-radius: var(--jd-radius-card);
	padding: var(--jd-space-9);
	transition: border-color var(--jd-transition);
}

.jd-pub:hover { border-color: var(--jd-hairline-strong); }

.jd-pub__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	min-block-size: 64px;
	padding-block-end: var(--jd-space-7);
	border-block-end: var(--jd-border);
	margin-block-end: var(--jd-space-7);
}

.jd-pub__logo { max-block-size: 44px; max-inline-size: 70%; inline-size: auto; }

.jd-pub__wordmark {
	font-family: var(--jd-font-latin);
	font-size: var(--jd-fs-lg);
	color: var(--jd-navy);
	text-align: center;
}

.jd-pub__name { font-size: var(--jd-fs-base); color: var(--jd-ink); margin: 0 0 var(--jd-space-3); }

.jd-pub__desc {
	font-size: var(--jd-fs-2xs);
	color: var(--jd-text-secondary);
	line-height: var(--jd-lh-body);
	margin: 0 0 var(--jd-space-6);
}

.jd-pub__links {
	display: flex;
	gap: var(--jd-space-6);
	flex-wrap: wrap;
	font-size: var(--jd-fs-2xs);
	margin: 0;
}

.jd-pub__browse { color: var(--jd-navy); font-weight: 500; }
.jd-pub__site { color: var(--jd-text-muted); }
.jd-pub__browse:hover,
.jd-pub__site:hover { border-block-end: 1px solid currentColor; }

/* ---- Contact (15) ------------------------------------------------------- */

.jd-contact { padding-block: var(--jd-space-16) var(--jd-space-24); }

.jd-contact__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
	gap: var(--jd-space-12);
	align-items: start;
}

/* contactGridStyle is mob||tab, so it collapses at 1080. */
@media (max-width: 1080px) {
	.jd-contact__layout { grid-template-columns: minmax(0, 1fr); }
}

.jd-contact__aside {
	background-color: var(--jd-surface);
	border: var(--jd-border);
	border-radius: var(--jd-radius-card);
	box-shadow: var(--jd-shadow-card);
	padding: var(--jd-space-10);
}

.jd-contact__asidetitle { font-size: var(--jd-fs-lg); margin: 0 0 var(--jd-space-8); }
.jd-contact__list { margin: 0; }

.jd-contact__row {
	padding-block: var(--jd-space-5);
	border-block-end: var(--jd-border);
}

.jd-contact__row:last-child { border-block-end: 0; }

.jd-contact__row dt {
	font-size: 10px;
	letter-spacing: var(--jd-track-label);
	color: var(--jd-text-muted);
	text-transform: uppercase;
	margin-block-end: var(--jd-space-2);
}

.jd-contact__row dd {
	margin: 0;
	font-size: var(--jd-fs-xs);
	color: var(--jd-ink);
	line-height: var(--jd-lh-body);
}

.jd-contact__row dd a { color: var(--jd-navy); }
.jd-contact__row dd a:hover { border-block-end: 1px solid currentColor; }

/* ---- Help (16) ---------------------------------------------------------- */

.jd-help { padding-block: var(--jd-space-16) var(--jd-space-24); }
.jd-help__faq { max-inline-size: 76ch; }

/* ---- Blog / archive fallback -------------------------------------------- */

.jd-postlist { display: grid; gap: var(--jd-space-9); max-inline-size: 76ch; }

.jd-postcard {
	padding-block-end: var(--jd-space-9);
	border-block-end: var(--jd-border);
}

.jd-postcard__title { font-size: var(--jd-fs-title); margin: 0 0 var(--jd-space-3); }
.jd-postcard__title a { color: var(--jd-navy); }
.jd-postcard__meta { margin: 0 0 var(--jd-space-5); color: var(--jd-text-muted); }
.jd-postcard__excerpt { color: var(--jd-text-secondary); }

.jd-pagination {
	display: flex;
	gap: var(--jd-space-5);
	flex-wrap: wrap;
	margin-block-start: var(--jd-space-12);
}

.jd-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: 40px;
	min-block-size: 40px;
	padding-inline: var(--jd-space-4);
	border: var(--jd-border);
	border-radius: var(--jd-radius-btn);
	color: var(--jd-navy);
	transition: border-color var(--jd-transition);
}

.jd-pagination .page-numbers:hover { border-color: var(--jd-navy); }

.jd-pagination .page-numbers.current {
	background-color: var(--jd-navy);
	border-color: var(--jd-navy);
	color: var(--jd-on-navy);
}
