/* GE Article Layout — mobile-first, single breakpoint at 900px.
   Fonts are never set here: every element inherits font-family from the
   active theme. Colours, max width, content/sidebar ratio and text-size
   scale are all CSS variables so Settings -> Article Layout can override
   them (see includes/class-assets.php::build_css_variables()). */

:root {
	--ge-navy: #0f1e35;
	--ge-ink: #1a2b49;
	--ge-body-grey: #3d3d3d;
	--ge-gold: #c8a96e;
	--ge-deep-gold: #a8813f;
	--ge-sand: #f0ece3;
	--ge-sand-deep: #e5dfd3;
	--ge-white: #ffffff;
	--ge-header-offset: 0px;
	--ge-max-width: 1700px;
	--ge-content-width: 70%;
	--ge-body-scale: 1;
	--ge-heading-scale: 1;
}

.ge-article-page,
.ge-article-page *,
.ge-read-next,
.ge-read-next *,
.ge-progress-bar {
	box-sizing: border-box;
}

.ge-article-page {
	overflow-x: clip;
	background: var(--ge-white);
	font-family: inherit;
}

.ge-article-page a {
	color: var(--ge-deep-gold);
	text-decoration: none;
}
.ge-article-page a:hover {
	color: var(--ge-gold);
}
.ge-article-page ::selection,
.ge-read-next ::selection {
	background: var(--ge-gold);
	color: var(--ge-navy);
}

/* The Read next section sits outside .ge-article-page, so it needs its
   own copy of the link reset — without this, its links fall back to the
   browser/theme default underline instead of the design's link styling. */
.ge-read-next a {
	color: inherit;
	text-decoration: none;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; overflow: hidden;
	clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* Focus rings */
.ge-article-page a:focus-visible,
.ge-article-page button:focus-visible,
.ge-article-page input:focus-visible,
.ge-read-next a:focus-visible {
	outline: 2px solid var(--ge-gold);
	outline-offset: 2px;
}

/* -------------------------------------------------------- */
/* 1. Reading progress bar                                    */
/* -------------------------------------------------------- */
.ge-progress-bar {
	position: fixed;
	left: 0;
	top: var(--ge-header-offset, 0px);
	height: 2px;
	width: 0%;
	background: var(--ge-gold);
	z-index: 60;
	transition: width 0.1s linear;
}

/* -------------------------------------------------------- */
/* 2. Hero                                                     */
/* -------------------------------------------------------- */
.ge-hero {
	position: relative;
	background: var(--ge-navy);
	overflow: hidden;
}
.ge-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: var(--ge-hero-image, none);
	background-size: cover;
	background-position: center;
	opacity: 0.4;
}
.ge-hero-scrim {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(10,16,30,.97) 0%, rgba(10,16,30,.72) 55%, rgba(10,16,30,.5) 100%);
}
.ge-hero-inner {
	position: relative;
	max-width: var(--ge-max-width, 1700px);
	margin: 0 auto;
	padding: 30px 22px 28px;
}

.ge-breadcrumb {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .16em;
}
.ge-breadcrumb-parent { color: rgba(255,255,255,.55); }
.ge-breadcrumb-sep { color: rgba(255,255,255,.35); margin: 0 6px; }
.ge-breadcrumb-primary { color: var(--ge-gold); }
.ge-breadcrumb a { color: inherit; }
.ge-breadcrumb a:hover { color: var(--ge-gold); }

.ge-hero-title {
	font-weight: 400;
	font-size: calc(34px * var(--ge-heading-scale, 1));
	line-height: 1.1;
	letter-spacing: -.01em;
	color: var(--ge-white);
	max-width: 940px;
	margin: 14px 0 0;
	text-wrap: balance;
}
.ge-hero-title em {
	font-style: italic;
	color: var(--ge-gold);
}

.ge-hero-deck {
	font-weight: 300;
	font-size: calc(17px * var(--ge-body-scale, 1));
	line-height: 1.6;
	color: rgba(255,255,255,.8);
	max-width: 720px;
	margin-top: 18px;
}

.ge-byline {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
	padding-top: 20px;
	border-top: 1px solid rgba(255,255,255,.2);
}
.ge-byline-avatar {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
}
.ge-byline-text { flex: 1 1 auto; min-width: 0; }
.ge-byline-name {
	font-size: 14px;
	color: var(--ge-white);
	margin: 0;
}
.ge-byline-bio {
	font-size: 13px;
	font-weight: 300;
	color: rgba(255,255,255,.5);
	margin: 2px 0 0;
}
.ge-byline-meta {
	width: 100%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .1em;
	color: rgba(255,255,255,.55);
	margin-top: 4px;
}
.ge-meta-updated { color: var(--ge-gold); }
.ge-meta-dot {
	width: 4px; height: 4px;
	border-radius: 50%;
	background: rgba(255,255,255,.35);
	flex-shrink: 0;
}

/* -------------------------------------------------------- */
/* 3. Body                                                     */
/* -------------------------------------------------------- */
.ge-body-wrap {
	max-width: var(--ge-max-width, 1700px);
	margin: 0 auto;
	padding: 30px 22px 8px;
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.ge-article {
	width: 100%;
	min-width: 0;
	color: var(--ge-body-grey);
}

.ge-article > p:first-of-type {
	font-weight: 400;
	font-size: calc(19px * var(--ge-body-scale, 1));
	line-height: 1.6;
	color: var(--ge-ink);
}

.ge-article p {
	font-weight: 300;
	font-size: calc(16.5px * var(--ge-body-scale, 1));
	line-height: 1.78;
	margin-top: 20px;
}
.ge-article > p:first-of-type + p,
.ge-article > p:first-of-type { margin-top: 0; }

.ge-article h2 {
	font-weight: 400;
	font-size: calc(26px * var(--ge-heading-scale, 1));
	line-height: 1.1;
	color: var(--ge-ink);
	margin: 32px 0 14px;
}
.ge-article h3 {
	font-weight: 400;
	font-size: calc(22px * var(--ge-heading-scale, 1));
	line-height: 1.15;
	color: var(--ge-ink);
	margin: 28px 0 12px;
}

.ge-article ul,
.ge-article ol {
	font-weight: 300;
	font-size: calc(16.5px * var(--ge-body-scale, 1));
	line-height: 1.78;
	color: var(--ge-body-grey);
	padding-left: 1.1em;
	margin-top: 20px;
}
.ge-article li { margin-bottom: 10px; }
.ge-article li::marker { color: var(--ge-deep-gold); }

.ge-article figure,
.ge-figure {
	overflow: hidden;
	background: var(--ge-sand-deep);
	margin: 26px -22px;
	aspect-ratio: 4/3;
}
.ge-article figure img,
.ge-figure img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.ge-article figcaption {
	font-size: 13px;
	font-weight: 300;
	line-height: 1.6;
	color: rgba(26,43,73,.6);
	margin: 13px 22px 0;
	position: relative;
	padding-top: 12px;
}
.ge-article figcaption::before {
	content: '';
	position: absolute;
	top: 0; left: 0;
	width: 22px; height: 1px;
	background: var(--ge-gold);
}

.ge-article blockquote {
	margin: 30px 0;
	padding-left: 18px;
	border-left: 3px solid var(--ge-gold);
}
.ge-article blockquote p {
	font-style: italic;
	font-weight: 400;
	font-size: calc(24px * var(--ge-heading-scale, 1));
	line-height: 1.35;
	color: var(--ge-ink);
	margin-top: 0;
}
.ge-article blockquote cite {
	display: block;
	font-weight: 300;
	font-size: 14px;
	color: rgba(26,43,73,.55);
	font-style: normal;
	margin-top: 8px;
}

.ge-article a {
	color: var(--ge-deep-gold);
	border-bottom: 1px solid rgba(168,129,63,.35);
}
.ge-article a:hover {
	color: var(--ge-gold);
	border-bottom-color: var(--ge-gold);
}

/* Vote panel */
.ge-vote-panel {
	background: var(--ge-sand);
	margin: 34px -22px 0;
	padding: 24px 22px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.ge-vote-prompt {
	font-weight: 400;
	font-size: calc(20px * var(--ge-heading-scale, 1));
	color: var(--ge-ink);
	margin: 0;
}
.ge-vote-buttons {
	display: flex;
	gap: 12px;
}
.ge-vote-btn {
	flex: 1;
	min-height: 46px;
	padding: 13px 20px;
	border: 1px solid rgba(26,43,73,.3);
	background: transparent;
	color: var(--ge-ink);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .14em;
	cursor: pointer;
	transition: background .2s, color .2s;
}
.ge-vote-btn:hover {
	background: rgba(26,43,73,.06);
}
.ge-vote-btn.is-selected {
	background: var(--ge-ink);
	border-color: var(--ge-ink);
	color: var(--ge-white);
}
.ge-vote-panel.is-voted .ge-vote-btn:not(.is-selected) {
	opacity: .45;
	pointer-events: none;
}

/* -------------------------------------------------------- */
/* 3b. Aside                                                   */
/* -------------------------------------------------------- */
.ge-aside {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 28px;
}

.ge-kicker {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .22em;
	color: rgba(26,43,73,.5);
	margin: 0;
}
.ge-kicker--dark { color: var(--ge-gold); }

/* Series */
.ge-series-card {
	order: -1;
	padding: 30px 22px 0;
}
.ge-series-list {
	list-style: none;
	margin: 14px 0 0;
	padding: 0;
}
.ge-series-item { border-top: 1px solid rgba(26,43,73,.14); }
.ge-series-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	min-height: 46px;
	padding: 16px 0;
	color: inherit;
}
.ge-series-readtime {
	position: absolute;
	width: 1px; height: 1px; overflow: hidden;
}
.ge-series-title {
	font-weight: 400;
	font-size: calc(17px * var(--ge-heading-scale, 1));
	line-height: 1.3;
	color: var(--ge-ink);
	flex: 1;
}
.ge-series-link:hover .ge-series-title { color: var(--ge-deep-gold); }
.ge-series-arrow {
	color: var(--ge-gold);
	font-size: 16px;
	flex-shrink: 0;
}

/* Newsletter */
.ge-newsletter {
	order: 1;
	background: var(--ge-navy);
	padding: 28px 22px;
	margin: 0 -22px;
}
.ge-newsletter-heading {
	font-weight: 400;
	font-size: calc(22px * var(--ge-heading-scale, 1));
	line-height: 1.3;
	color: var(--ge-white);
	margin: 10px 0 20px;
}
.ge-newsletter-form {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.ge-newsletter-input {
	width: 100%;
	min-height: 48px;
	padding: 14px 16px;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.16);
	color: var(--ge-white);
	font-size: 15px;
}
.ge-newsletter-input::placeholder { color: rgba(255,255,255,.4); }
.ge-newsletter-input:focus-visible { border-color: var(--ge-gold); outline: none; }
.ge-newsletter-submit {
	width: 100%;
	min-height: 48px;
	padding: 15px;
	background: var(--ge-gold);
	border: none;
	color: var(--ge-navy);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .16em;
	cursor: pointer;
	transition: background .2s;
}
.ge-newsletter-submit:hover { background: #dfc48f; }

/* Custom sidebar block — free-form, admin-authored (Settings -> Article
   Layout -> Sidebar content). Deliberately minimal styling: it needs to
   host arbitrary text/HTML/shortcodes without fighting whatever the
   content brings with it. */
.ge-sidebar-custom {
	order: 2;
	padding: 0 22px;
	color: var(--ge-body-grey);
	font-size: calc(15px * var(--ge-body-scale, 1));
	line-height: 1.7;
}
.ge-sidebar-custom > *:first-child { margin-top: 0; }
.ge-sidebar-custom > *:last-child { margin-bottom: 0; }
.ge-sidebar-custom img {
	max-width: 100%;
	height: auto;
	display: block;
}
.ge-sidebar-custom iframe,
.ge-sidebar-custom video {
	max-width: 100%;
}

/* Share and save */
.ge-share-save {
	order: -2;
	padding: 0 22px;
}
.ge-share-row {
	display: flex;
	flex-wrap: nowrap;
	gap: 10px;
	margin-top: 14px;
}
.ge-share-btn,
.ge-save-btn {
	width: 70px;
	height: 70px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(26,43,73,.22);
	color: var(--ge-ink);
	background: transparent;
	cursor: pointer;
	transition: background .2s, color .2s;
}
.ge-share-btn svg,
.ge-save-btn svg {
	width: 30px;
	height: 30px;
}
.ge-share-btn:hover,
.ge-save-btn:hover {
	background: var(--ge-ink);
	color: var(--ge-white);
}
.ge-save-btn[aria-pressed="true"] {
	color: var(--ge-gold);
	border-color: var(--ge-gold);
}
.ge-save-btn[aria-pressed="true"] svg { fill: var(--ge-gold); }

/* -------------------------------------------------------- */
/* 4. Read next                                                */
/* -------------------------------------------------------- */
.ge-read-next {
	background: var(--ge-sand);
	padding: 32px 0 36px;
}
.ge-read-next-inner {
	max-width: var(--ge-max-width, 1700px);
	margin: 0 auto;
	padding: 0 22px;
}
.ge-read-next-header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 20px;
	border-bottom: 1px solid rgba(26,43,73,.18);
}
.ge-read-next-header h2 {
	font-weight: 400;
	font-size: calc(26px * var(--ge-heading-scale, 1));
	color: var(--ge-ink);
	margin: 0;
}
.ge-read-next-all {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .16em;
	color: var(--ge-ink);
	white-space: nowrap;
}
.ge-read-next-all:hover { color: var(--ge-deep-gold); }

.ge-read-next-subheading {
	font-weight: 400;
	font-size: calc(17px * var(--ge-heading-scale, 1));
	color: var(--ge-ink);
	margin: 32px 0 0;
}
.ge-read-next-subheading:first-of-type { margin-top: 26px; }

.ge-read-next-grid {
	display: flex;
	flex-direction: column;
	gap: 30px;
	margin-top: 20px;
}
.ge-read-next-card {
	display: flex;
	align-items: center;
	gap: 18px;
	color: inherit;
}
.ge-read-next-image {
	flex: 0 0 116px;
	width: 116px;
	aspect-ratio: 4/5;
	background-color: var(--ge-sand-deep);
	background-size: cover;
	background-position: center;
}
.ge-read-next-text {
	flex: 1;
	min-width: 0;
}
.ge-read-next-category,
.ge-read-next-readtime {
	display: none;
}
.ge-read-next-title {
	font-weight: 400;
	font-size: calc(17px * var(--ge-heading-scale, 1));
	line-height: 1.3;
	color: var(--ge-ink);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.ge-read-next-cta {
	display: inline-block;
	margin-top: 12px;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--ge-deep-gold);
}

/* ================================================================ */
/* DESKTOP ≥ 900px                                                    */
/* ================================================================ */
@media (min-width: 900px) {

	.ge-hero-inner {
		padding: clamp(48px,7vw,96px) clamp(24px,4vw,48px) clamp(40px,5vw,64px);
	}
	.ge-hero::before { opacity: .38; }
	.ge-hero-scrim {
		background: linear-gradient(to top, rgba(10,16,30,.97) 0%, rgba(10,16,30,.7) 55%, rgba(10,16,30,.45) 100%);
	}
	.ge-breadcrumb { font-size: 12px; }
	.ge-hero-title {
		font-size: calc(clamp(34px, 5vw, 72px) * var(--ge-heading-scale, 1));
		line-height: 1.02;
		letter-spacing: -.02em;
		max-width: 940px;
		margin-top: 20px;
	}
	.ge-hero-deck {
		font-size: calc(clamp(18px,1.5vw,22px) * var(--ge-body-scale, 1));
		max-width: 720px;
		margin-top: 26px;
	}
	.ge-byline {
		gap: clamp(18px,3vw,40px);
		margin-top: 40px;
		padding-top: 28px;
	}
	.ge-byline-avatar { width: 46px; height: 46px; }
	.ge-byline-name { font-size: 15px; }
	.ge-byline-meta { width: auto; margin-top: 0; font-size: 12px; }

	.ge-body-wrap {
		display: grid;
		grid-template-columns: var(--ge-content-width, 70%) 1fr;
		align-items: start;
		padding: clamp(40px,5vw,72px) clamp(24px,4vw,48px) clamp(56px,7vw,100px);
		gap: clamp(32px,5vw,80px);
	}
	.ge-article { min-width: 0; }
	.ge-aside {
		min-width: 0;
		position: sticky;
		top: 120px;
		align-self: start;
	}
	.ge-series-card,
	.ge-newsletter,
	.ge-sidebar-custom,
	.ge-share-save { order: 0; }
	.ge-newsletter { order: 1; }
	.ge-sidebar-custom { order: 2; padding: 0; }
	.ge-share-save { order: 3; }

	.ge-article > p:first-of-type { font-size: calc(clamp(20px,1.7vw,24px) * var(--ge-body-scale, 1)); }
	.ge-article p { font-size: calc(17.5px * var(--ge-body-scale, 1)); line-height: 1.8; margin-top: 24px; }
	.ge-article h2 { font-size: calc(clamp(28px,2.6vw,40px) * var(--ge-heading-scale, 1)); margin: clamp(40px,4vw,56px) 0 20px; }
	.ge-article h3 { font-size: calc(26px * var(--ge-heading-scale, 1)); margin: 36px 0 14px; }
	.ge-article ul, .ge-article ol { font-size: calc(17.5px * var(--ge-body-scale, 1)); line-height: 1.8; }

	.ge-article figure,
	.ge-figure {
		margin: clamp(32px,4vw,48px) 0;
		aspect-ratio: 16/9;
	}
	.ge-article figcaption { margin-left: 0; margin-right: 0; }

	.ge-article blockquote {
		margin: clamp(40px,4vw,56px) 0;
		padding-left: clamp(20px,3vw,34px);
	}
	.ge-article blockquote p { font-size: calc(clamp(24px,2.3vw,33px) * var(--ge-heading-scale, 1)); }

	.ge-vote-panel {
		margin: 40px 0 0;
		padding: 26px clamp(22px,3vw,30px);
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
	.ge-vote-buttons { flex-shrink: 0; }
	.ge-vote-btn { flex: 0 0 auto; min-height: auto; padding: 13px 26px; }

	.ge-series-card {
		border: 1px solid rgba(26,43,73,.18);
		padding: 26px 24px;
	}
	.ge-series-link { padding: 16px 0; min-height: auto; }
	.ge-series-arrow { display: none; }

	.ge-newsletter { padding: 28px 24px; margin: 0; }
	.ge-newsletter-form { gap: 0; }
	.ge-newsletter-input { margin-bottom: 10px; }

	.ge-share-save { padding: 0; }
	.ge-share-row { gap: 12px; }
	.ge-share-btn, .ge-save-btn { width: 64px; height: 64px; }

	.ge-read-next { padding: clamp(48px,6vw,88px) 0; }
	.ge-read-next-inner { padding: 0 clamp(24px,4vw,48px); }
	.ge-read-next-header h2 { font-size: calc(clamp(28px,3vw,46px) * var(--ge-heading-scale, 1)); }
	.ge-read-next-subheading {
		font-size: calc(20px * var(--ge-heading-scale, 1));
		margin: 48px 0 0;
	}
	.ge-read-next-subheading:first-of-type { margin-top: 40px; }
	.ge-read-next-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
		gap: clamp(24px,3vw,40px);
		margin-top: 24px;
	}
	.ge-read-next-card {
		display: block;
		overflow: hidden;
	}
	.ge-read-next-image {
		width: 100%;
		aspect-ratio: 3/2;
		transition: transform .8s cubic-bezier(.25,1,.5,1);
	}
	.ge-read-next-card:hover .ge-read-next-image { transform: scale(1.06); }
	.ge-read-next-text { display: contents; }
	.ge-read-next-category {
		display: block;
		font-size: 11px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .2em;
		color: var(--ge-deep-gold);
		margin: 18px 0 6px;
	}
	.ge-read-next-title {
		display: block;
		-webkit-line-clamp: unset;
		overflow: visible;
		font-size: calc(clamp(21px,1.7vw,27px) * var(--ge-heading-scale, 1));
		margin: 0 0 6px;
	}
	.ge-read-next-card:hover .ge-read-next-title { color: var(--ge-deep-gold); }
	.ge-read-next-readtime {
		display: block;
		font-size: 12px;
		font-weight: 300;
		color: rgba(26,43,73,.55);
		margin: 0;
	}
	.ge-read-next-cta { display: none; }
}

/* -------------------------------------------------------- */
/* Reduced motion                                              */
/* -------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.ge-progress-bar { display: none; }
	.ge-read-next-image,
	.ge-share-btn,
	.ge-save-btn,
	.ge-vote-btn,
	.ge-newsletter-submit,
	.ge-article a {
		transition: none !important;
	}
	.ge-read-next-card:hover .ge-read-next-image { transform: none; }
}