/* IAG Expo — templates for non-page views (ex-templates.php): People / Sponsor / News singles, people grids,
   search, 404, generic archives. Builds on ex-site.css (hero, title box, .ex-content, --ex-* variables). The gaps
   BETWEEN the parts of a view (search form, results, tiles, pagination) come from the content flow rules in
   ex-site.css, so the parts here carry no outer vertical margins. */

/* Heroes without an image: a soft band from the card blue, so the title box doesn't float on flat navy. */
.ex-hero--plain {
	min-height: 40vh;
	background: radial-gradient(ellipse at 50% 120%, #1a1c4b 0%, var(--ex-navy) 70%);
}
/* Long titles (news releases) must clear the fixed header: pad the hero by the header's height (logo clamp from
   ex-site.css + bar/pill padding; at least 110 px for the wrapped date on phones). Worth doing in page.php's hero
   too (ex-site.css), where a long page title can slide under the header the same way. */
.ex-list .ex-hero,
.ex-single .ex-hero,
.ex-404 .ex-hero {
	padding-top: max(110px, calc(clamp(48px, 8.9vw, 153px) + 28px));
	padding-bottom: var(--ex-s-4);
}
.ex-list .ex-hero__title,
.ex-single .ex-hero__title,
.ex-404 .ex-hero__title { max-width: min(900px, 100%); margin-top: var(--ex-s-3); box-sizing: border-box; }
@media (max-width: 767px) {
	.ex-list .ex-hero__title,
	.ex-single .ex-hero__title { font-size: 30px; }
}
@media (max-width: 480px) {
	.ex-list .ex-hero__title,
	.ex-single .ex-hero__title { font-size: 26px; }
}

/* Shared bits */
.ex-empty { text-align: center; color: var(--ex-muted); }
.ex-button,
.ex-content a.ex-button {
	display: inline-block;
	padding: 12px 30px;
	background: var(--ex-link);
	border-radius: var(--ex-radius);
	color: var(--ex-navy);
	font-family: var(--ex-display);
	font-size: 1.25rem;
	line-height: 1.2;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.ex-button:hover,
.ex-button:focus,
.ex-content a.ex-button:hover { background: #c9b2d1; color: var(--ex-navy); }

/* ---------- Person ---------- */
.ex-person {
	display: grid;
	grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
	gap: var(--ex-s-5);
	align-items: start;
	max-width: 960px;
	margin: 0 auto;
}
.ex-person__photo img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
}
.ex-content .ex-person__role {
	margin: 0 0 var(--ex-s-1);
	font-family: var(--ex-display);
	font-size: 1.5rem;
	line-height: 1.2;
}
.ex-content .ex-person__tagline { margin: var(--ex-s-3) 0 0; color: var(--ex-muted); font-style: italic; }
.ex-person__bio { margin-top: var(--ex-s-4); }
@media (max-width: 767px) {
	.ex-person { grid-template-columns: minmax(0, 1fr); gap: var(--ex-s-4); text-align: center; }
	.ex-person__photo { max-width: 220px; margin: 0 auto; }
	.ex-person__bio { text-align: left; }
}

/* ---------- Sponsor ---------- */
.ex-sponsor {
	display: grid;
	grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
	gap: var(--ex-s-5);
	align-items: start;
	max-width: 960px;
	margin: 0 auto;
}
.ex-sponsor__logo {
	padding: var(--ex-s-4);
	background: #fff;
	border-radius: 15px;
}
.ex-sponsor__logo img { display: block; width: 100%; height: auto; max-height: 220px; object-fit: contain; }
.ex-content .ex-sponsor__events {
	margin-top: var(--ex-s-4);
	padding-top: var(--ex-s-3);
	border-top: 1px solid rgba(255, 255, 255, 0.15);
	color: var(--ex-muted);
	font-size: 0.9375rem;
}
@media (max-width: 767px) {
	.ex-sponsor { grid-template-columns: minmax(0, 1fr); gap: var(--ex-s-4); }
	.ex-sponsor__logo { max-width: 280px; margin: 0 auto; }
}

/* ---------- News item ---------- */
.ex-news { max-width: 640px; margin: 0 auto; text-align: center; }
.ex-news__image { margin: 0 0 var(--ex-s-4); }
.ex-news__image img { display: inline-block; width: 500px; max-width: 100%; height: auto; }
.ex-content .ex-news__back { margin-top: var(--ex-s-4); }

/* ---------- People grid (archive + Display tags) ---------- */
.ex-tiles {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--ex-gap);
}
@media (max-width: 1024px) { .ex-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .ex-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ex-s-3); } }
.ex-tile {
	padding: var(--ex-pad);
	background: #1a1c4b;
	text-align: center;
}
.ex-tile__link { display: block; color: var(--ex-text); text-decoration: none; }
.ex-tile__link:hover .ex-tile__title,
.ex-tile__link:focus .ex-tile__title { color: var(--ex-link); }
.ex-tile__photo {
	display: block;
	width: 80%;
	height: auto;
	margin: 0 auto var(--ex-s-3);
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
}
.ex-tile__photo--none { background: rgba(255, 255, 255, 0.08); }
.ex-tile__title {
	margin: 0 0 var(--ex-s-1);
	font-size: 1.5rem;
	transition: color 0.2s ease;
}
.ex-content .ex-tile__meta { margin: 0; font-size: 0.875rem; color: var(--ex-muted); line-height: 1.4; }

/* ---------- Result list (search, generic archives) ---------- */
.ex-results { max-width: 900px; margin: 0 auto; }
.ex-result {
	display: flex;
	gap: var(--ex-s-4);
	align-items: flex-start;
	padding: var(--ex-s-4) 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.ex-result:first-child { padding-top: 0; }
.ex-result__thumb { flex: 0 0 180px; display: block; }
.ex-result__thumb img { display: block; width: 100%; height: 120px; object-fit: cover; }
.ex-result--people .ex-result__thumb { flex-basis: 120px; }
.ex-result--people .ex-result__thumb img { height: 120px; border-radius: 50%; }
.ex-result--sponsor .ex-result__thumb img { object-fit: contain; background: #fff; padding: 10px; box-sizing: border-box; }
.ex-result__body { flex: 1 1 auto; min-width: 0; }
.ex-content .ex-result__type {
	margin: 0 0 var(--ex-s-1);
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ex-gold);
}
.ex-result__title { margin: 0 0 var(--ex-s-2); font-size: 1.75rem; }
.ex-result__title a { color: var(--ex-text); }
.ex-result__title a:hover,
.ex-result__title a:focus { color: var(--ex-link); }
.ex-content .ex-result__excerpt { margin: 0; color: #d6d6e0; }
@media (max-width: 600px) {
	.ex-result { gap: var(--ex-s-3); }
	.ex-result__thumb,
	.ex-result--people .ex-result__thumb { flex-basis: 90px; }
	.ex-result__thumb img,
	.ex-result--people .ex-result__thumb img { height: 90px; }
	.ex-result__title { font-size: 1.375rem; }
}

/* ---------- Search form ---------- */
.ex-search {
	display: flex;
	max-width: 600px;
	margin: 0 auto;
	border: 2px solid #fff;
	border-radius: var(--ex-radius);
	overflow: hidden;
	background: var(--ex-navy);
}
.ex-search .ex-search__input {
	flex: 1 1 auto;
	min-width: 0;
	padding: 12px 20px;
	border: 0;
	background: transparent;
	color: var(--ex-text);
	font: inherit;
}
.ex-search .ex-search__input::placeholder { color: var(--ex-muted); }
.ex-search .ex-search__input:focus { outline: none; background: rgba(255, 255, 255, 0.05); }
.ex-search .ex-search__button {
	flex: 0 0 auto;
	padding: 0 26px;
	border: 0;
	background: var(--ex-navy-2);
	color: var(--ex-text);
	font-family: var(--ex-display);
	font-size: 1.25rem;
	cursor: pointer;
}
.ex-search .ex-search__button:hover,
.ex-search .ex-search__button:focus { background: #0a1070; }

/* ---------- Pagination ---------- */
.ex-pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--ex-s-2);
	font-family: var(--ex-display);
	font-size: 1.25rem;
}
.ex-pagination .page-numbers {
	display: inline-block;
	min-width: 44px;
	padding: 6px 14px;
	border-radius: var(--ex-radius);
	background: var(--ex-navy-2);
	color: var(--ex-text);
	text-align: center;
	text-decoration: none;
	box-sizing: border-box;
}
.ex-pagination .page-numbers.current { background: #fff; color: #000; }
.ex-pagination a.page-numbers:hover { background: #0a1070; color: #fff; }
.ex-pagination .page-numbers.dots { background: transparent; }

/* ---------- 404 ---------- */
.ex-404 .ex-hero { background-color: var(--ex-navy); box-shadow: inset 0 0 0 100vmax rgba(26, 28, 75, 0.55); }
.ex-404 .ex-content { text-align: center; }
.ex-content .ex-404__note { max-width: 560px; margin: 0 auto; font-size: 1.125rem; }

/* ---------- Password-protected pages (core form and Password Protect WordPress's) ---------- */
.ex-content .post-password-form {
	max-width: 520px;
	margin: 0 auto;
	padding: var(--ex-s-4);
	background: #1a1c4b;
	border-radius: 15px;
	text-align: center;
}
.ex-content .post-password-form input[type="password"] {
	width: 100%;
	margin: var(--ex-s-2) 0;
	padding: 10px 16px;
	border: 1px solid #fff;
	border-radius: var(--ex-radius);
	background: var(--ex-navy);
	color: var(--ex-text);
	box-sizing: border-box;
}
.ex-content .post-password-form input[type="submit"],
.ex-content .post-password-form button {
	padding: 10px 30px;
	border: 0;
	border-radius: var(--ex-radius);
	background: var(--ex-link);
	color: var(--ex-navy);
	font-family: var(--ex-display);
	font-size: 1.125rem;
	cursor: pointer;
}
