/*
 * PELA theme styles.
 *
 * v1 reproduces the original Bricks + Automatic CSS design. The fluid sizes below are
 * the same clamp() formulas Automatic CSS generated, so type and spacing scale identically.
 * Breakpoints (max-width): 991px tablet, 767px phone landscape, 478px phone portrait.
 */

/* ---------- Fonts (self-hosted, Latin subset) ---------- */

@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/open-sans-400.woff2) format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: italic; font-weight: 400; font-display: swap; src: url(../fonts/open-sans-400-italic.woff2) format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: italic; font-weight: 300; font-display: swap; src: url(../fonts/open-sans-300-italic.woff2) format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/open-sans-700.woff2) format("woff2"); }
@font-face { font-family: "Open Sans"; font-style: italic; font-weight: 700; font-display: swap; src: url(../fonts/open-sans-700-italic.woff2) format("woff2"); }
/* The original site mapped weight 800 to Open Sans Condensed ExtraBold (the "Philosophy"/"Application" labels). */
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/open-sans-condensed-800.woff2) format("woff2"); }
@font-face { font-family: "Crimson Pro"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/crimson-pro-400.woff2) format("woff2"); }
@font-face { font-family: "Crimson Pro"; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/crimson-pro-700.woff2) format("woff2"); }
@font-face { font-family: "Crimson Pro"; font-style: italic; font-weight: 500; font-display: swap; src: url(../fonts/crimson-pro-500-italic.woff2) format("woff2"); }

/* ---------- Tokens ---------- */

:root {
	/* Brand (style guide) */
	--primary: #144f8f;
	--primary-hover: #185ca5;
	--primary-ultra-light: #e9f2fc;
	--primary-ultra-dark: #06192d;
	--secondary: #a21d21;
	--secondary-hover: #ba2126;
	--secondary-dark: #6c1316;
	--secondary-ultra-light: #fbe9ea;
	--base: #222945;
	--neutral: #ede6dc;
	--tertiary: #ebbf80;
	--cream: #f6f3ee;
	--muted: #4a5070;
	--line: #e3e5ee;
	--form-button: #205493;
	--form-required: #b00;

	/* Type */
	--font-body: "Open Sans", system-ui, sans-serif;
	--font-heading: "Crimson Pro", Georgia, serif;
	--text-m: clamp(1rem, calc(0.1988071571vw + 0.9552683897rem), 1.125rem);
	--text-xl: clamp(1.44rem, calc(0.8890658052vw + 1.2399601938rem), 1.999000125rem);
	--h1: clamp(1.944rem, calc(1.6170835726vw + 1.5801561962rem), 2.9607412962rem);
	--h2: clamp(1.62rem, calc(0.9560417495vw + 1.4048906064rem), 2.22111125rem);
	--h3: clamp(1.35rem, calc(0.5029821074vw + 1.2368290258rem), 1.66625rem);
	--h4: clamp(1.125rem, calc(0.1988071571vw + 1.0802683897rem), 1.25rem);

	/* Space */
	--content-width: 1100px;
	--gutter: clamp(1.25rem, calc(3.9761431412vw + 0.3553677932rem), 3.75rem);
	--section-space: clamp(3rem, calc(4.1749502982vw + 2.0606361829rem), 5.625rem);
	--space-xs: clamp(0.8441720333rem, calc(-0.0172384889vw + 0.8480506933rem), 0.8333333333rem);
	--space-s: clamp(1.1252813203rem, calc(0.1983597291vw + 1.0806503813rem), 1.25rem);
	--space-m: clamp(1.5rem, calc(0.5964214712vw + 1.365805169rem), 1.875rem);
	--space-l: clamp(1.9995rem, calc(1.2930417495vw + 1.7085656064rem), 2.8125rem);
	--space-xl: clamp(2.6653335rem, calc(2.4706425447vw + 2.1094389274rem), 4.21875rem);
	--space-xxl: clamp(3.5528895555rem, calc(4.4138933511vw + 2.5597635515rem), 6.328125rem);
	--content-gap: var(--space-m);
	--container-gap: var(--space-xl);
	--radius: 5px;
}

/* ---------- Base ---------- */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
/* Glide to in-page links (About's "On this page" menu, a session's Register button). Only on those pages,
   and not for people who've asked their device for less motion. */
@media (prefers-reduced-motion: no-preference) {
	html:has(.about-toc, .session-page) { scroll-behavior: smooth; }
}

body {
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	font-family: var(--font-body);
	font-size: var(--text-m);
	/* Computed once here (in px) and inherited, as on the original site. */
	line-height: calc(6px + 2ex);
	color: #000;
	background: #fff;
	-webkit-font-smoothing: antialiased;
	/* Avoid one-word last lines, as the original site did. */
	text-wrap: pretty;
}

.site-main { flex-grow: 1; }

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-family: var(--font-heading);
	font-weight: 700;
	line-height: calc(4px + 2ex);
}
h1 { font-size: var(--h1); }
h2 { font-size: var(--h2); }
h3 { font-size: var(--h3); }
h4 { font-size: var(--h4); }

p, ul, ol, li, figure, blockquote { margin: 0; }

img { max-width: 100%; height: auto; }

a {
	color: var(--primary);
	text-decoration: none;
	transition: color 0.3s ease-in-out;
}
a:hover { color: var(--primary-hover); }

strong, b { font-weight: 700; }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.skip-link {
	position: absolute;
	top: -100px;
	left: 1rem;
	z-index: 1001;
	padding: 0.5em 1em;
	background: #fff;
	color: var(--primary);
}
.skip-link:focus { top: 1rem; }

/* Rich text: space between paragraphs, lists. */
.pela-flow > * + * { margin-top: 1em; }
.pela-flow ul, .pela-flow ol { margin-block: 1em; padding-left: 2em; }
.pela-flow li + li { margin-top: 0.5em; }

/* ---------- Buttons ---------- */

.wp-block-button__link {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	min-inline-size: 8.75rem;
	padding: 0.5em 1.25em;
	border: 2px solid var(--secondary);
	border-radius: var(--radius);
	background: var(--secondary);
	color: var(--secondary-ultra-light);
	font-size: var(--text-m);
	font-weight: 400;
	line-height: 1;
	text-align: center;
	transition: background 0.3s ease-in-out, color 0.3s ease-in-out, border 0.3s ease-in-out;
}
.wp-block-button__link:hover {
	background: var(--secondary-hover);
	border-color: var(--secondary-hover);
	color: var(--secondary-ultra-light);
}

.is-style-primary .wp-block-button__link,
.is-style-large-primary .wp-block-button__link {
	background: var(--primary);
	border-color: var(--primary);
	color: var(--primary-ultra-light);
}
.is-style-primary .wp-block-button__link:hover,
.is-style-large-primary .wp-block-button__link:hover {
	background: var(--primary-hover);
	border-color: var(--primary-hover);
	color: var(--primary-ultra-light);
}

.is-style-large-primary .wp-block-button__link { font-size: var(--text-xl); }

.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 1rem; }

/* "Outline" button style (block editor): blue outline, for a second action beside a red button. */
.is-style-outline .wp-block-button__link {
	background: transparent;
	border-color: var(--primary);
	color: var(--primary);
}
.is-style-outline .wp-block-button__link:hover {
	background: var(--primary-ultra-light);
	border-color: var(--primary-hover);
	color: var(--primary-hover);
}

/* ---------- Header ---------- */

.site-header {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0 var(--gutter) var(--space-xs);
	background: var(--base);
}

.site-header__inner {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	justify-items: flex-start;
	gap: var(--content-gap);
	width: 100%;
	max-width: var(--content-width);
	padding: var(--space-xs) var(--space-m);
	border-radius: 0 0 30px 30px;
	background: #fff;
}

.site-header__logo { display: flex; justify-content: center; }
.site-header__logo img {
	display: block;
	width: 250px;
	aspect-ratio: 2;
	object-fit: cover;
}

.site-nav {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 100%;
}

.site-nav__menu {
	display: flex;
	align-items: center;
	gap: var(--content-gap);
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}
.site-nav__menu > li { max-width: fit-content; }
.site-nav__menu > li:first-child,
.site-nav__menu > li:last-child { margin-inline-start: auto; }

.site-nav__menu a {
	display: flex;
	justify-content: center;
	padding: 1.5em 0;
	color: var(--primary);
	transition: background 0.3s ease-in-out, color 0.3s ease-in-out, border 0.3s ease-in-out;
}
.site-nav__menu a:hover { color: var(--primary-hover); }
.site-nav__menu .current-menu-item > a { color: var(--secondary); }

/* Menu item with the CSS class "nav-button" (the Contact link). */
.site-nav__menu .nav-button > a {
	min-inline-size: 8.75rem;
	padding: 0.5em 1.25em;
	border: 2px solid var(--secondary);
	border-radius: var(--radius);
	background: var(--secondary);
	color: #fff;
	line-height: 1;
	text-align: center;
}
.site-nav__menu .nav-button > a:hover {
	background: var(--secondary-hover);
	border-color: var(--secondary-hover);
	color: #fff;
}
.site-nav__menu .nav-button.current-menu-item > a {
	border-color: var(--secondary-dark);
	color: #fff;
}

.site-nav__toggle { display: none; }

@media (max-width: 767px) {
	.site-nav__toggle {
		display: block;
		position: relative;
		z-index: 1000;
		flex-shrink: 0;
		width: 20px;
		height: 16px;
		padding: 0;
		border: 0;
		background: none;
		color: #000;
		cursor: pointer;
	}
	/* Bigger tap area than the 20px icon, without moving it. */
	.site-nav__toggle::after { content: ""; position: absolute; inset: -14px -12px; }
	.site-nav__bar {
		position: absolute;
		left: 0;
		width: 20px;
		height: 2px;
		background: currentColor;
		transition: transform 0.2s, opacity 0.2s, top 0.2s;
	}
	.site-nav__bar:nth-child(1) { top: 0; }
	.site-nav__bar:nth-child(2) { top: 7px; }
	.site-nav__bar:nth-child(3) { top: 14px; }

	.site-nav.is-open .site-nav__toggle { color: #fff; }
	.site-nav.is-open .site-nav__bar:nth-child(1) { top: 7px; transform: rotate(45deg); }
	.site-nav.is-open .site-nav__bar:nth-child(2) { opacity: 0; }
	.site-nav.is-open .site-nav__bar:nth-child(3) { top: 7px; transform: rotate(-45deg); }

	.site-nav__menu {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		z-index: 999;
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		width: 500px;
		max-width: 100%;
		padding-block: var(--space-xxl);
		overflow-y: auto;
		background: #23282d;
		visibility: hidden;
		transform: translateX(-100%);
		transition: transform 0.2s, visibility 0.2s;
	}
	.site-nav.is-open .site-nav__menu { visibility: visible; transform: none; }
	.site-nav.is-open::before {
		content: "";
		position: fixed;
		inset: 0;
		z-index: 998;
		background: rgba(0, 0, 0, 0.25);
	}

	.site-nav__menu > li,
	.site-nav__menu > li:first-child,
	.site-nav__menu > li:last-child { max-width: none; margin: 0; }

	.site-nav__menu a,
	.site-nav__menu .current-menu-item > a,
	.site-nav__menu .nav-button > a,
	.site-nav__menu .nav-button > a:hover {
		display: block;
		min-inline-size: 0;
		padding: 0.5em 1.5em 0.5em 1em;
		border: 0;
		border-radius: 0;
		background: none;
		color: var(--neutral);
		line-height: inherit;
		text-align: left;
	}
}

/* ---------- Page sections (block editor groups) ---------- */

.pela-section {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: var(--section-space) var(--gutter);
}

.pela-inner {
	display: flex;
	flex-direction: column;
	gap: var(--content-gap);
	width: 100%;
	max-width: var(--content-width);
}

/* Home: hero */
.pela-hero__text {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	width: 66%;
}
.pela-hero h1 { font-size: 3.6rem; color: var(--primary); }
@media (max-width: 767px) {
	.pela-hero__text { width: 100%; }
}
/* Phones: the 3.6rem heading ran to five lines. */
@media (max-width: 478px) {
	.pela-hero h1 { font-size: 2.6rem; }
}

/* Home: light-blue band */
.pela-band { background: var(--primary-ultra-light); }
.pela-band .pela-inner { gap: 1rem; }
.pela-band h2 { color: var(--base); }

.home-hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 25rem;
	gap: var(--space-xxl);
	align-items: center;
}
.home-hero:not(:has(.next-card)) { grid-template-columns: minmax(0, 1fr); }
.home-hero__main { display: flex; flex-direction: column; gap: 1.75rem; }
.home-hero .pela-hero__text { width: auto; }

.home-progress { padding-top: 0; }

.home-apply {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 32.5rem;
	gap: var(--space-xxl);
	align-items: start;
}
.home-apply__text { display: flex; flex-direction: column; gap: 1rem; }
.home-apply .pela-form {
	padding: 2rem;
	border-radius: 1rem;
	background: #fff;
}
.home-apply .pela-form__title { font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; line-height: 1.2; }

@media (max-width: 991px) {
	.home-hero,
	.home-apply { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 478px) {
	.home-apply .pela-form { padding: 1.25rem; }
}

/* About: a long read with an "On this page" menu beside it */
.pela-about { color: var(--base); }

.about-layout {
	display: grid;
	grid-template-columns: 15rem minmax(0, 1fr);
	gap: var(--space-xxl);
	align-items: start;
}
.about-toc {
	position: sticky;
	top: 1.5rem;
	padding-top: 0.75rem;
	border-top: 3px solid var(--base);
}
.about-toc__label {
	padding: 0.5rem 0;
	color: var(--muted);
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.about-toc ul { display: flex; flex-direction: column; gap: 0.25rem; padding: 0; list-style: none; }
.about-toc a {
	display: block;
	padding: 0.5rem 0 0.5rem 0.875rem;
	border-left: 3px solid transparent;
	font-size: 1.0625rem;
	transition: border-color 0.25s, color 0.25s;
}
.about-toc a[aria-current] { border-color: var(--secondary); color: var(--base); font-weight: 700; }

.about-article { display: flex; flex-direction: column; gap: var(--space-xl); }
.about-part { display: flex; flex-direction: column; gap: 1.25rem; scroll-margin-top: 1.5rem; }
.about-part--mission h1 { margin-bottom: 0.5rem; font-size: clamp(2.5rem, 3vw + 1.5rem, 4rem); line-height: 1; }
.about-eyebrow {
	color: var(--secondary);
	font-family: var(--font-body);
	font-size: 0.875rem;
	letter-spacing: 0.16em;
	line-height: 1.4;
	text-transform: uppercase;
}
.about-statement {
	font-family: var(--font-heading);
	font-size: clamp(1.75rem, 1.4vw + 1.3rem, 2.375rem);
	font-weight: 700;
	line-height: 1.2;
	color: var(--primary);
}
.about-callout {
	padding: 2rem 2.25rem;
	border-radius: 1rem;
	background: var(--base);
	color: #fff;
	font-family: var(--font-heading);
	font-size: clamp(1.375rem, 1vw + 1.1rem, 2rem);
	line-height: 1.35;
}
.about-callout em { color: var(--tertiary); font-weight: 500; }
.about-lead { font-size: clamp(1.125rem, 0.4vw + 1rem, 1.375rem); line-height: 1.65; }
.about-checks { display: flex; flex-direction: column; gap: 1rem; padding: 0; list-style: none; }
.about-checks li {
	position: relative;
	padding-left: 2.5rem;
	font-size: clamp(1.0625rem, 0.3vw + 1rem, 1.25rem);
	line-height: 1.6;
}
.about-checks li::before {
	content: "";
	position: absolute;
	top: 0.2em;
	left: 0;
	width: 1.5rem;
	height: 1.5rem;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23144f8f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center / contain no-repeat;
}
.about-board { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 2.5rem; }
.about-board p { color: var(--muted); font-size: 1.0625rem; line-height: 1.5; }
.about-board strong {
	display: block;
	margin-bottom: 0.25rem;
	color: var(--base);
	font-family: var(--font-heading);
	font-size: 1.625rem;
	line-height: 1.2;
}
/* Name, line break, affiliation: the name is already its own line. */
.about-board strong + br { display: none; }
.about-note { color: var(--muted); font-size: 0.9375rem; }

@media (max-width: 991px) {
	.about-layout { grid-template-columns: minmax(0, 1fr); }
	/* The sections are short enough on phones and tablets to just scroll. */
	.about-toc { display: none; }
}
@media (max-width: 478px) {
	.about-board { grid-template-columns: minmax(0, 1fr); }
	.about-callout { padding: 1.5rem; }
}

/* Original About layout (cards). Still used until the new layout is applied under Tools → PELA Setup. */

.about-grid { display: grid; gap: 1rem; }
.about-grid--3 { grid-template-columns: 1fr 1fr 1fr; }
.about-grid--2 { grid-template-columns: 1fr 1fr; }

.about-card {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1rem;
	border-radius: 1rem;
	background: var(--base);
	color: #fff;
	box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.5);
}
.about-grid--3 > .about-card:first-child { gap: 1rem; }
/* Card headings are h2 for a correct outline, sized like the original h3s. */
.about-card h2,
.contact-grid h2 { font-size: var(--h3); }

/* Contact */
.contact-grid {
	display: grid;
	grid-template-columns: 1fr 0.05fr 1fr;
	gap: var(--content-gap);
	width: 100%;
}

/* Phones: stack the About cards and let the contact form use the full width.
   (The original kept three squeezed columns, which made the page scroll sideways.) */
@media (max-width: 767px) {
	.about-grid--3,
	.about-grid--2,
	.contact-grid { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- Speaker Series (/curriculum/ and Home) ---------- */

.series-intro__grid {
	display: grid;
	grid-template-columns: 26rem minmax(0, 1fr);
	gap: var(--space-xxl);
	align-items: start;
}
.series-intro__heading { display: flex; flex-direction: column; gap: 0.875rem; }
.series-intro h1 { font-size: clamp(2.25rem, 3vw + 1rem, 3.75rem); line-height: 1.02; color: var(--base); }
.series-intro__sub {
	font-family: var(--font-heading);
	font-size: var(--h3);
	font-style: italic;
	font-weight: 500;
	line-height: 1.3;
	color: var(--primary);
}
.series-intro__lede { font-size: 1.0625rem; line-height: 1.7; color: var(--base); }
.series-parts { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.pela-flow .series-parts > p { margin: 0; padding: 1rem 1.125rem; border-radius: 0.75rem; background: var(--cream); font-size: 1.125rem; }
.series-intro__note { color: var(--muted); }
@media (max-width: 991px) {
	.series-intro__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-m); }
}

.series-section { padding-top: 0; }
.series { display: flex; flex-direction: column; gap: var(--space-xl); color: var(--base); }

/* Buttons: Register (its form or outside sign-up page), Watch, and a ghost style on navy. */
.series-btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	gap: 0.5rem;
	min-height: 2.75rem;
	padding: 0.625rem 1.125rem;
	border: 2px solid var(--primary);
	border-radius: 6px;
	background: #fff;
	color: var(--primary);
	font-weight: 700;
	line-height: 1.2;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.series-btn:hover { background: var(--primary-ultra-light); color: var(--primary-hover); }
.series-btn--register { border-color: var(--secondary); background: var(--secondary); color: #fff; }
.series-btn--register:hover { border-color: var(--secondary-hover); background: var(--secondary-hover); color: #fff; }
.series-btn--ghost { border-color: rgba(255, 255, 255, 0.6); background: transparent; color: #fff; }
.series-btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, 0.08); color: #fff; }
.series-btn--block { display: flex; width: 100%; }

/* "Next up" */
.series-next {
	display: grid;
	grid-template-columns: 18.75rem minmax(0, 1fr);
	overflow: hidden;
	border-radius: 1.25rem;
	background: var(--base);
	color: #fff;
}
.series-next:not(:has(.series-next__photo)) { grid-template-columns: minmax(0, 1fr); }
.series-next__photo { width: 100%; height: 100%; min-height: 20rem; object-fit: cover; object-position: 50% 15%; }
.series-next__body { display: flex; flex-direction: column; gap: 1rem; padding: var(--space-l) var(--space-xl); }
.series-next__eyebrow { color: var(--tertiary); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.series-next__title { font-size: clamp(2rem, 2vw + 1.25rem, 2.875rem); line-height: 1.05; }
.series-next__with { color: #d5e4f7; font-family: var(--font-heading); font-size: 1.375rem; font-style: italic; font-weight: 500; line-height: 1.35; }
.series-next__facts { display: flex; flex-wrap: wrap; gap: 0.75rem 2rem; color: var(--primary-ultra-light); line-height: 1.5; }
.series-next__facts strong { color: #fff; }
.series-next__actions { display: flex; flex-wrap: wrap; gap: 0.875rem; padding-top: 0.5rem; }

/* All sessions */
.series-list__title { margin-bottom: 1rem; font-size: clamp(1.75rem, 1vw + 1.4rem, 2.375rem); color: var(--base); }
.series-list__items { margin: 0; padding: 0; list-style: none; }
.series-row {
	display: grid;
	grid-template-columns: 2.5rem 8rem 3.5rem minmax(0, 1fr) auto;
	grid-template-areas: "num date photo main action";
	gap: 1.25rem;
	align-items: center;
	padding: 1.125rem 0;
	border-bottom: 1px solid var(--line);
}
.series-row:last-child { border-bottom: 0; }
.series-row__num {
	grid-area: num;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--primary);
	color: #fff;
	font-weight: 700;
}
.series-row--upcoming .series-row__num,
.series-row--planned .series-row__num { border: 2px solid var(--primary); background: transparent; color: var(--primary); }
.series-row--tbd .series-row__num { border: 2px dashed #9aa0b8; background: transparent; color: var(--muted); }
.series-row__date { grid-area: date; color: var(--muted); font-size: 0.9375rem; }
.series-row__photo { grid-area: photo; width: 3.5rem; height: 3.5rem; border-radius: 50%; object-fit: cover; object-position: 50% 15%; }
.series-row__photo--empty { display: block; background: #eef0f5; }
.series-row__main { grid-area: main; display: flex; flex-direction: column; gap: 0.125rem; min-width: 0; }
.series-row__title { color: var(--primary); font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; line-height: 1.2; }
span.series-row__title { color: var(--base); }
a.series-row__title:hover { text-decoration: underline; text-underline-offset: 0.15em; }
.series-row__speaker { color: var(--muted); font-size: 0.9375rem; }
.series-row__action { grid-area: action; justify-self: end; }
.series-row__status { color: var(--muted); font-size: 0.875rem; }

/* The next session stands out. */
.series-row.is-next {
	margin: 0.5rem -1rem;
	padding: 1.125rem 1rem;
	border-bottom: 0;
	border-radius: 0.75rem;
	background: var(--secondary-ultra-light);
}
.series-row.is-next .series-row__num { border: 0; background: var(--secondary); color: #fff; }
.series-row.is-next .series-row__date { color: var(--secondary); font-weight: 700; }

@media (max-width: 767px) {
	.series-next { grid-template-columns: minmax(0, 1fr); }
	.series-next__photo { height: 16rem; min-height: 0; }
	.series-next__body { padding: var(--space-m); }
	.series-row {
		grid-template-columns: 2.5rem 3.5rem minmax(0, 1fr);
		grid-template-areas: "num photo date" "num photo main" ". . action";
		gap: 0.25rem 0.875rem;
	}
	.series-row__num,
	.series-row__photo { align-self: start; }
	.series-row__action { justify-self: start; padding-top: 0.5rem; }
	.series-row__title { font-size: 1.3125rem; }
}

/* Home: next-session card */
.next-card {
	overflow: hidden;
	border-radius: 1.125rem;
	background: #fff;
	box-shadow: 0 18px 50px rgba(34, 41, 69, 0.18);
	color: var(--base);
}
.next-card__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1.125rem 1.625rem;
	background: var(--base);
	color: #d5e4f7;
	font-size: 0.875rem;
}
.next-card__eyebrow { color: var(--tertiary); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.next-card__body { display: flex; flex-direction: column; gap: 1.125rem; padding: 1.5rem 1.625rem 1.625rem; }
.next-card__when { display: flex; gap: 1rem; align-items: center; }
.next-card__cal {
	display: flex;
	flex-direction: column;
	flex-shrink: 0;
	width: 4.5rem;
	overflow: hidden;
	border: 1px solid var(--line);
	border-radius: 10px;
	text-align: center;
}
.next-card__month { padding: 0.25rem 0; background: var(--secondary); color: #fff; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.next-card__day { font-family: var(--font-heading); font-size: 2.125rem; font-weight: 700; line-height: 1.25; }
.next-card__title-wrap { display: flex; flex-direction: column; gap: 0.25rem; }
.next-card__title { font-size: 1.75rem; line-height: 1.1; }
.next-card__title a { color: var(--primary); }
.next-card__time { color: var(--muted); font-size: 0.9375rem; }
.next-card__speaker { display: flex; gap: 0.875rem; align-items: center; padding: 0.875rem; border-radius: 0.75rem; background: var(--cream); line-height: 1.4; }
.next-card__speaker strong { display: block; }
.next-card__photo { flex-shrink: 0; width: 3.25rem; height: 3.25rem; border-radius: 50%; object-fit: cover; object-position: 50% 15%; }
.next-card__photo--empty { display: block; background: #e3ddd2; }
.next-card__role { color: var(--muted); font-size: 0.875rem; }
.next-card__place { font-size: 0.9375rem; line-height: 1.5; }

/* Home: series progress */
.progress { display: flex; flex-direction: column; gap: 1.125rem; padding-top: 2.5rem; border-top: 1px solid var(--line); color: var(--base); }
.progress__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.progress__label { color: var(--muted); font-size: 0.8125rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.progress__head a { display: inline-block; padding-block: 0.625rem; margin-block: -0.625rem; font-weight: 700; }
.progress__steps { display: grid; grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; gap: 0.5rem; margin: 0; padding: 0; list-style: none; }
.progress__step { display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.8125rem; line-height: 1.35; }
.progress__bar { height: 6px; border-radius: 3px; background: #d9dcea; }
.progress__step--done .progress__bar { background: var(--primary); }
.progress__step--held .progress__bar { background: #8fb3dc; }
.progress__step--next .progress__bar { background: var(--secondary); }
.progress__name { color: var(--base); }
a.progress__name:hover { color: var(--primary); }
.progress__note { color: var(--muted); font-size: 0.75rem; }
.progress__step--next .progress__note { color: var(--secondary); font-weight: 700; }
@media (max-width: 767px) {
	.progress__steps { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem 0.75rem; }
}

/* ---------- Forms (Jetpack Forms, styled to match the original WS Form look) ---------- */

.pela-form__title { margin-bottom: 10px; font-size: 18px; line-height: 1.4; }

.pela-form .wp-block-jetpack-contact-form {
	display: flex;
	flex-wrap: wrap;
	gap: 0 20px;
	padding: 0;
}
.pela-form .grunion-field-wrap {
	flex: 1 1 100%;
	margin: 0 0 20px;
	padding: 0;
}
.pela-form .grunion-field-wrap.grunion-field-width-50-wrap { flex: 1 1 calc(50% - 10px); }

.pela-form .grunion-field-label {
	display: block;
	margin: 0 0 5px;
	color: #000;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
}
.pela-form .grunion-label-required {
	margin-left: 0.25em;
	color: var(--form-required);
	font-size: inherit;
	font-weight: 700;
	opacity: 1;
}

.pela-form input[type="text"],
.pela-form input[type="email"],
.pela-form input[type="tel"],
.pela-form textarea {
	display: block;
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 8.5px 10px;
	border: 1px solid #000;
	border-radius: 4px;
	background: #fff;
	color: #000;
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.4;
	box-shadow: none;
}
.pela-form textarea { height: calc(4 * 1.4em + 19px); min-height: 0; resize: vertical; }
.pela-form input:focus,
.pela-form textarea:focus { outline: 2px solid var(--form-button); outline-offset: 0; }

.pela-form .contact-form__checkbox-wrap {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	margin-bottom: 10px;
}
.pela-form .contact-form input[type="checkbox"] {
	appearance: none;
	flex-shrink: 0;
	width: 22.4px;
	height: 22.4px;
	min-height: 22.4px;
	margin: 0;
	border: 1px solid #000;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
}
.pela-form .contact-form input[type="checkbox"]:checked {
	background: var(--form-button) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / 80% no-repeat;
	border-color: var(--form-button);
}
.pela-form .contact-form .grunion-field-label.checkbox { margin: 0; padding: 0; }
.pela-form .contact-form__checkbox-wrap .clear-form { display: none; }
/* The original form had a small gap under the message box. */
.pela-form .contact-form .grunion-field-wrap textarea { margin-bottom: 5px; }

.pela-form .wp-block-jetpack-button { flex: 1 1 100%; margin: 0 0 20px; }
.pela-form .wp-block-jetpack-button .wp-block-button__link {
	display: flex;
	width: 100%;
	min-inline-size: 0;
	padding: 8.5px 10px;
	border: 1px solid var(--form-button);
	border-radius: 4px;
	background: var(--form-button);
	color: #fff;
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.4;
	cursor: pointer;
}
.pela-form .wp-block-jetpack-button .wp-block-button__link:hover { background: #1a4578; border-color: #1a4578; }

/* ---------- Session pages (/speaker-series/<slug>/) ---------- */

.session-page { color: var(--base); }

.sp-hero {
	display: flex;
	justify-content: center;
	padding: var(--space-xl) var(--gutter) var(--space-xxl);
	background: var(--base);
	color: #fff;
}
.sp-hero__inner {
	display: flex;
	gap: var(--space-xl);
	align-items: center;
	width: 100%;
	max-width: var(--content-width);
}
.sp-hero__text { display: flex; flex-direction: column; gap: 1rem; flex: 1 1 0; min-width: 0; }

.sp-back { color: #bcd8f5; }
/* Taller tap areas on phones, same look. */
.sp-back,
.sp-arrow-link { display: inline-block; padding-block: 0.625rem; margin-block: -0.625rem; }
.sp-back:hover { color: #fff; }
.sp-eyebrow,
.sp-label {
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	line-height: 1.4;
	text-transform: uppercase;
}
.sp-eyebrow { color: var(--tertiary); }
.sp-label { color: var(--secondary); }
.sp-title { font-size: clamp(2.5rem, 4.5vw + 1rem, 4.5rem); line-height: 1; text-wrap: balance; }
.sp-with {
	font-family: var(--font-heading);
	font-size: var(--h3);
	font-style: italic;
	font-weight: 500;
	color: #d5e4f7;
}
.sp-hero__intro { max-width: 36rem; color: var(--primary-ultra-light); font-size: 1.125rem; line-height: 1.6; }
.sp-flow > * + * { margin-top: 1em; }
.sp-muted { color: var(--muted); }

/* Date card */
.sp-ticket {
	flex: 0 0 23.75rem;
	overflow: hidden;
	border-radius: 1rem;
	background: #fff;
	color: var(--base);
}
.sp-ticket__date {
	display: flex;
	align-items: baseline;
	gap: 0.875rem;
	padding: 1.25rem 1.75rem;
	background: var(--secondary);
	color: #fff;
}
.sp-ticket__day { font-family: var(--font-heading); font-size: 3.5rem; font-weight: 700; line-height: 1; }
.sp-ticket__month {
	display: flex;
	flex-direction: column;
	font-size: 0.9375rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.sp-ticket__month span { font-weight: 400; letter-spacing: 0; text-transform: none; }
.sp-ticket__date--tba { font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; }
.sp-ticket__body {
	display: flex;
	flex-direction: column;
	gap: 0.875rem;
	padding: 1.5rem 1.75rem 1.75rem;
	font-size: 1rem;
	line-height: 1.5;
}
.sp-ticket__body:empty { display: none; }

.sp-button {
	display: block;
	margin-top: 0.375rem;
	padding: 0.875rem;
	border-radius: 6px;
	background: var(--primary);
	color: #fff;
	font-size: 1.125rem;
	font-weight: 700;
	text-align: center;
	transition: background 0.2s;
}
.sp-button:hover { background: var(--primary-hover); color: #fff; }
.sp-button--inline { display: inline-block; padding-inline: 1.75rem; }

/* Topic + sidebar */
.sp-body { display: flex; justify-content: center; padding: var(--space-xl) var(--gutter); }
.sp-body__inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 23.75rem;
	gap: var(--space-xl);
	align-items: start;
	width: 100%;
	max-width: var(--content-width);
}
.sp-content { display: flex; flex-direction: column; gap: var(--space-l); }
.sp-aside { display: flex; flex-direction: column; gap: 1.25rem; }
.sp-aside:empty { display: none; }

.sp-quote {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding-top: 1.75rem;
	border-top: 3px solid var(--tertiary);
}
.sp-quote blockquote {
	font-family: var(--font-heading);
	font-size: clamp(1.5rem, 1.2vw + 1.1rem, 2.125rem);
	font-style: italic;
	font-weight: 500;
	line-height: 1.3;
	color: var(--primary);
}
.sp-quote figcaption { color: var(--muted); font-weight: 700; }
.sp-quote--inline { padding-top: 0; border: 0; }
.sp-quote--inline blockquote { font-size: 1.5rem; color: var(--base); }

.sp-topic { display: flex; flex-direction: column; gap: 0.75rem; }
.sp-topic h2 { font-size: var(--h2); }
.sp-topic .sp-flow,
.sp-fold__body { font-size: 1.125rem; line-height: 1.7; }

/* Speaker box */
.sp-speaker {
	display: flex;
	gap: 1.5rem;
	align-items: center;
	padding: 1.75rem;
	border-radius: 1rem;
	background: var(--cream);
}
.sp-speaker--stack { flex-direction: column; align-items: flex-start; gap: 1rem; padding: 1.5rem; }
.sp-speaker__photo {
	flex-shrink: 0;
	width: 7.5rem;
	height: 9.375rem;
	object-fit: cover;
	object-position: 50% 15%;
	border-radius: 10px;
}
.sp-speaker--stack .sp-speaker__photo { width: 5.5rem; height: 5.5rem; border-radius: 50%; }
.sp-speaker__text { display: flex; flex-direction: column; gap: 0.375rem; }
.sp-speaker__name { font-family: var(--font-heading); font-size: 1.75rem; font-weight: 700; line-height: 1.15; }
.sp-speaker__role { color: var(--muted); line-height: 1.5; }
.sp-arrow-link { font-weight: 700; }

/* "More in the series" */
.sp-series { display: flex; justify-content: center; padding: var(--space-xl) var(--gutter); background: var(--cream); }
.sp-series__inner { display: flex; flex-direction: column; gap: 1.5rem; width: 100%; max-width: var(--content-width); }
.sp-series__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0.5rem 1.5rem; }
.sp-series__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1.5rem;
	padding: 0;
	list-style: none;
}
.sp-series__item {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	padding: 1.5rem;
	border-radius: 0.75rem;
	background: #fff;
}
.sp-series__item .sp-label { color: var(--muted); }
.sp-series__item.is-current { outline: 2px solid var(--primary); }
.sp-series__item.is-current .sp-label { color: var(--secondary); }
.sp-series__title { font-family: var(--font-heading); font-size: 1.5rem; font-weight: 700; line-height: 1.2; color: var(--primary); }
/* The whole card is clickable. */
.sp-series__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.sp-series__item:has(a:hover) { outline: 2px solid var(--primary-hover); }

/* Recorded: video first */
.sp-hero--watch { padding-bottom: var(--space-l); }
.sp-hero--watch .sp-hero__inner { flex-direction: column; align-items: stretch; gap: 1rem; }
.sp-hero--watch .sp-title { font-size: clamp(2.25rem, 3.5vw + 1rem, 3.75rem); }
.sp-watch__top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; }
.sp-pill {
	padding: 0.375rem 0.75rem;
	border-radius: 1.25rem;
	background: var(--tertiary);
	color: var(--base);
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.sp-video {
	position: relative;
	margin-top: 0.5rem;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 1rem;
	background: var(--primary-ultra-dark);
}
.sp-video__poster,
.sp-video iframe { display: block; position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sp-video__poster img { width: 100%; height: 100%; object-fit: cover; }
.sp-video__poster::before { content: ""; position: absolute; inset: 0; background: rgba(6, 25, 45, 0.3); transition: background 0.2s; }
.sp-video__poster:hover::before { background: rgba(6, 25, 45, 0.15); }
.sp-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 6rem;
	height: 6rem;
	margin: -3rem 0 0 -3rem;
	border-radius: 50%;
	background: var(--secondary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M8 5v14l11-7z'/%3E%3C/svg%3E") 55% 50% / 40% no-repeat;
	transition: transform 0.2s;
}
.sp-video__poster:hover .sp-video__play { transform: scale(1.06); }

.sp-content--watch { gap: 1.25rem; }
.sp-lead { font-size: 1.25rem; line-height: 1.65; }
.sp-fold { padding-top: 0.75rem; border-top: 1px solid var(--line); }
.sp-fold:last-child { padding-bottom: 0.75rem; border-bottom: 1px solid var(--line); }
.sp-fold summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-family: var(--font-heading);
	font-size: 1.625rem;
	font-weight: 700;
	color: var(--primary);
	min-height: 2.75rem;
	cursor: pointer;
	list-style: none;
}
.sp-fold summary::-webkit-details-marker { display: none; }
.sp-fold summary::after { content: "+"; font-family: var(--font-body); font-size: 1.5rem; font-weight: 400; }
.sp-fold[open] summary::after { content: "–"; }
.sp-fold__body { display: flex; flex-direction: column; gap: 0.875rem; padding-top: 0.875rem; }

.sp-next {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	padding: 1.5rem;
	border: 1px solid var(--line);
	border-radius: 1rem;
}
.sp-next__title { font-family: var(--font-heading); font-size: 1.375rem; font-weight: 700; line-height: 1.2; }

/* Sign-up form (sidebar) */
.rsvp {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1.75rem;
	border: 1px solid #d9dcea;
	border-radius: 1rem;
	scroll-margin-top: 1.5rem;
}
.rsvp__title { font-size: 1.75rem; }
.rsvp__note { color: var(--muted); font-size: 0.9375rem; line-height: 1.5; }
.rsvp__message { padding: 12px 16px; border-radius: var(--radius); }
.rsvp__message--ok { background: var(--primary-ultra-light); }
.rsvp__message--error { background: var(--secondary-ultra-light); color: var(--secondary); }

@media (max-width: 991px) {
	.sp-hero__inner { flex-direction: column; align-items: stretch; }
	.sp-ticket { flex-basis: auto; }
	.sp-body__inner { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 478px) {
	.sp-speaker--row { flex-direction: column; align-items: flex-start; }
	.sp-video { margin-inline: calc(var(--gutter) * -1); border-radius: 0; }
	.sp-video__play { width: 4rem; height: 4rem; margin: -2rem 0 0 -2rem; }
	.sp-ticket__body, .sp-ticket__date, .rsvp { padding-inline: 1.25rem; }
}

.pela-rsvp { display: flex; flex-wrap: wrap; gap: 0 20px; }
.pela-rsvp__field { flex: 1 1 100%; margin-bottom: 20px; }
.pela-rsvp__field:last-child { margin-bottom: 0; }
.pela-rsvp label {
	display: block;
	margin-bottom: 5px;
	color: #000;
	font-size: 16px;
	line-height: 1.4;
}
.pela-rsvp__req { color: var(--form-required); font-weight: 700; }
.pela-rsvp__optional { color: #555; }
.pela-rsvp__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pela-rsvp__consent { display: flex; align-items: flex-start; gap: 6px; }
.pela-rsvp__consent label { margin: 0; }
.pela-rsvp input[type="checkbox"] {
	appearance: none;
	flex-shrink: 0;
	width: 22.4px;
	height: 22.4px;
	margin: 0;
	border: 1px solid #000;
	border-radius: 4px;
	background: #fff;
	cursor: pointer;
}
.pela-rsvp input[type="checkbox"]:checked {
	background: var(--form-button) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.2' d='M3.5 8.5l3 3 6-7'/%3E%3C/svg%3E") center / 80% no-repeat;
	border-color: var(--form-button);
}
.pela-rsvp__submit {
	width: 100%;
	padding: 8.5px 10px;
	border: 1px solid var(--form-button);
	border-radius: 4px;
	background: var(--form-button);
	color: #fff;
	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.4;
	cursor: pointer;
}
.pela-rsvp__submit:hover { background: #1a4578; border-color: #1a4578; }

/* ---------- Footer ---------- */

.site-footer {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: var(--section-space) var(--gutter);
	background: var(--primary-ultra-dark);
	color: #fff;
}
.site-footer__inner {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	width: 100%;
	max-width: var(--content-width);
}
.site-footer__logo { display: flex; justify-content: center; }
.site-footer__logo img { display: block; width: 300px; max-width: 100%; border-radius: var(--radius); }
.site-footer__bottom { display: flex; justify-content: center; text-align: center; }

/* 404 */
.not-found { align-items: center; justify-content: center; min-height: 40vh; color: var(--base); text-align: center; }