:root {

	/* ENTRY LAYOUT */
	--entry-max-width: var(--max-width-wide);
	--entry-outer-margin: 0 auto;
	--entry-outer-padding: 0 var(--gutter-width);

	/* ENTRY CONTENT HEADINGS */
	--entry-heading-font: var(--heading-x-small);
	--entry-heading-weight: var(--typeface-weight-body-bold);
	--entry-heading-margin-top: var(--space-xlarge);

	/* ENTRY CONTENT LINKS */
	--entry-link-color: var(--color-primary);
	--entry-link-decoration: underline;

	/* FEATURED IMAGE */
	--singular-featured-image-margin: var(--space-large);

	/* ENTRY HEADER */
	--singular-entry-header-gap: var(--space-xsmall);
	--singular-entry-title-font: var(--heading-medium);

	/* CAPTIONS */
	--caption-text-margin: 0.8075em;

	/* CLASSIC GALLERY */
	--gallery-margin-bottom: var(--space-large);
	--gallery-item-gap: 10px;
	--gallery-image-border: 2px solid var(--color-border-soft);

	/* GALLERY SLIDER */
	--gallery-slider-control-size: 1.125em;

	/* ARCHIVE GRID */
	--archive-posts-wrapper-padding: 0 var(--gutter-width);
	--archive-grid-row-gap: var(--space-large);
	--archive-grid-col-gap: var(--space-large);
	--archive-grid-cols-mobile: 2;
	--archive-grid-cols-tablet: 2;
	--archive-grid-cols-desktop: 3;

	/* ARCHIVE ENTRY */
	--archive-entry-title-font: var(--title-small);
	--archive-entry-title-weight: var(--typeface-weight-bold);

	/* Framework-level token overrides */
	--ftps-gutter-width: 0;
	--ftps-header-rule-content: "";
	--ftps-header-text-align: center;
	--ftps-section-title-font: var(--body-large);
	--ftps-actions-link-font: var(--body-small);
	--ftps-section-title-transform: uppercase;

	/* Hero block tokens */
	--ftps-hero-title-font: var(--label-medium);
	--ftps-hero-title-font-weight: var(--typeface-weight-body-medium-bold, 600);
	--ftps-hero-heading-font: var(--display-large);
	--ftps-hero-heading-font-weight: var(--typeface-weight-display-medium, 400);
	--ftps-hero-body-font: var(--body-small);
	--ftps-hero-body-font-weight: var(--typeface-weight-body-medium, 400);

}

/* DO NOT EDIT BELOW THIS LINE — these are the actual styles using the above tokens. */

/* Site uses breadcrumbs on some pages */
.site-breadcrumbs {
	margin: var(--space-xsmall) 0;
	padding: 0 var(--gutter-width);
}

.site-breadcrumbs-inner {
	margin: 0 auto;
	max-width: 1200px;
}

.site-breadcrumbs a {
	text-decoration: none;
}

.site-main {
	max-width: var(--max-width-wide);
	margin: auto;
}

.single-post .site-main,
.single-ambassador .entry-content {
	max-width: var(--max-width-article);
}

.single-post .entry-header {
	flex-direction: column;
	gap: var(--space-xsmall);
	margin: 0;

	.entry-title {
		margin: 0;
	}
}

.post-type-archive-catalog .page-section-banner {
	color: var(--color-white);

	.banner-content {
		padding: 0;
	}
}

/* ===== ENTRY OUTER CONTAINERS ===== */

.entry-header,
.entry-content,
.entry-footer {
	margin: var(--entry-outer-margin) auto;
	padding: var(--entry-outer-padding);
}

/*
 * When WordPress renders wp:post-content inside a classic PHP template that
 * already wraps the output in <div class="entry-content">, the block renderer
 * adds its own "entry-content" class to the wp-block-post-content element.
 * This creates double padding (outer .entry-content + inner .entry-content)
 * that constrains page-section blocks to ~912px instead of the expected 1200px.
 *
 * Counteract by giving ftm/page-section blocks for "post_grid" and
 * "media_content" layouts negative side margins equal to the double gutter so
 * they span the full site-main width, matching the legacy PHP-rendered sections.
 *
 * "hero" and other breakout layouts are intentionally excluded — they carry
 * their own full-viewport breakout CSS and must not receive additional offset.
 */
.entry-content > .entry-content.wp-block-post-content
	:is(.page-section-post-grid, .page-section-media-content) {
	margin-left: calc(-2 * var(--gutter-width));
	margin-right: calc(-2 * var(--gutter-width));
}

/* ===== ENTRY INNER WRAPPERS ===== */

.entry-header-wrapper,
.entry-content-wrapper,
.entry-footer-wrapper {
	margin: auto;
	max-width: var(--entry-max-width);
	width: 100%;
}

/* ===== ENTRY CONTENT: PROSE ===== */

/*
 * Subheadings inside entry content intentionally inherit body-large sizing
 * to maintain readable prose rhythm rather than document-style hierarchy.
 * (Single-post width constraint is applied in singular.css.)
 *
 * :where() keeps specificity at (0,0,1) so block and plugin stylesheets
 * can override these defaults without a specificity fight.
 */
:where(.entry-content) h2,
:where(.entry-content) h3,
:where(.entry-content) h4 {
	font: var(--entry-heading-font);
	font-weight: var(--entry-heading-weight);
	margin-bottom: 0;
	margin-top: var(--entry-heading-margin-top);
}

:where(.entry-content) a:not(.button, .wp-element-button, .wp-block-button__link) {
	color: var(--entry-link-color);
	text-decoration: var(--entry-link-decoration);
}

/* ── media.css ──────────────────────────────────────────────────────────────── */

/* Captions, smileys, classic gallery, gallery slider */



/* ===== CAPTIONS ===== */

.wp-caption {
	max-width: 100%;

	img[class*="wp-image-"] {
		display: block;
		margin-inline: auto;
	}
}

.wp-caption-text {
	margin: var(--caption-text-margin) 0;
}

/* ===== SMILEYS ===== */

:is(.page-content, .entry-content, .comment-content) .wp-smiley {
	border: none;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}

/* ===== CLASSIC GALLERY ===== */

.gallery {
	display: grid;
	gap: var(--gallery-item-gap);
	grid-template-columns: repeat(var(--gallery-columns, 1), 1fr);
	margin: auto;
	margin-bottom: var(--gallery-margin-bottom);

	.gallery-item {
		text-align: center;
	}

	img {
		border: var(--gallery-image-border);
		display: block;
		margin-inline: auto;
	}

	.gallery-caption {
		display: block;
		margin-left: 0;
	}

	/* Column count — drives grid-template-columns via --gallery-columns */
	&.gallery-columns-2 { --gallery-columns: 2; }

	&.gallery-columns-3 { --gallery-columns: 3; }

	&.gallery-columns-4 { --gallery-columns: 4; }

	&.gallery-columns-5 { --gallery-columns: 5; }

	&.gallery-columns-6 { --gallery-columns: 6; }

	&.gallery-columns-7 { --gallery-columns: 7; }

	&.gallery-columns-8 { --gallery-columns: 8; }

	&.gallery-columns-9 { --gallery-columns: 9; }

	/* Slider layout resets the grid */
	&.gallery-layout-slider {
		display: block;
		margin: 0;
	}
}

/* ===== ENTRY HEADER ===== */

/*
 * Taxonomy terms display above the post title via column-reverse flex order.
 */

.entry-header {
	display: flex;
	flex-direction: column-reverse;
	gap: var(--singular-entry-header-gap);
}

.entry-title {
	font: var(--singular-entry-title-font);
}

.entry-title a {
	color: inherit;
	text-decoration: none;
}

/* ===== ARTICLE WIDTH CONSTRAINT ===== */

/*
 * On single posts, title and content are capped at article width,
 * not the wider wrapper width.
 */

.single-post .entry-header-wrapper,
.single-post .entry-content-wrapper {
	max-width: var(--max-width-article);
}

/* ===== ENTRY CLEARFIX ===== */

.entry-content::after,
.entry-footer::after {
	content: '';
	display: table;
	clear: both;
}

/* ===== ARCHIVE LAYOUT ===== */

.archive-posts-wrapper {
	padding: var(--archive-posts-wrapper-padding);
}

.archive-posts-inner {
	margin-left: auto;
	margin-right: auto;
	max-width: var(--max-width-wide);
}

.archive-posts {
	display: grid;
	row-gap: var(--archive-grid-row-gap);
	column-gap: var(--archive-grid-col-gap);
	grid-template-columns: repeat(var(--archive-grid-cols-mobile), 1fr);

	@media (min-width: 37.5em) {
		grid-template-columns: repeat(var(--archive-grid-cols-tablet), 1fr);
	}

	@media (min-width: 64em) {
		grid-template-columns: repeat(var(--archive-grid-cols-desktop), 1fr);
	}
}

/* ===== ARCHIVE ENTRY HEADER ===== */

.archive-entry-header {
	display: flex;
	flex-direction: column;
}

/* Move the featured image to the top of the archive card */
.archive-entry-header .wp-block-post-featured-image {
	order: -1;
	margin: var(--space-xsmall) 0;
}

/*
 * In FSE block templates each template part is wrapped in a
 * wp-block-template-part div, which is the actual flex child.
 * Apply order: -1 to that wrapper when it contains the featured image.
 */
.archive-entry-header .wp-block-template-part:has(> .wp-block-post-featured-image) {
	order: -1;
}

.entry-title.archive {
	font: var(--archive-entry-title-font);
	font-weight: var(--archive-entry-title-weight);
	margin: 0;
}

.entry-title.archive a {
	color: inherit;
	text-decoration: none;
}

:is(.archive, .blog) {

	.entry-header .entry-title,
	.archive-entry-header .entry-title {
		margin: 0;
	}
}