@charset "UTF-8";
/* =========================================================================
   CAROLINA FLAG FOOTBALL FACTORY - DESIGN SYSTEM
   =========================================================================
   The only stylesheet on the site. No framework, no parent theme CSS.
   Everything is namespaced .cfff-* so nothing here can leak into the admin,
   WPBakery's editor UI, or a future plugin's markup.

   CONTENTS
     01  Design tokens
     02  Base and reset
     03  Utilities
     04  Typography
     05  Layout: container, section
     06  Buttons
     07  Global header
     08  Primary navigation (desktop)
     09  Mobile navigation
     10  Global footer
     11  Components
     12  WPBakery integration
     13  Blog and generic templates
     14  Motion, print, forced colors
   ========================================================================= */


/* =========================================================================
   01  DESIGN TOKENS
   ========================================================================= */

:root {

	/* --- Brand ---------------------------------------------------------- */
	--cfff-navy: #193963;
	--cfff-navy-900: #0E2440;   /* Footer, deepest surface */
	--cfff-navy-700: #22497A;   /* Hover state for navy */
	--cfff-navy-050: #EDF1F7;   /* Tint for quiet surfaces */

	--cfff-gold: #F4B93F;
	--cfff-gold-600: #DA9E1E;   /* Hover state for gold */

	/*
	 * Gold on white is 1.77:1. It fails WCAG for text at any size.
	 * Use --cfff-gold only as a surface, rule, or icon accent on light
	 * backgrounds. When you need gold-flavoured TEXT on white, use
	 * --cfff-gold-ink (6.9:1). Gold text on navy is fine at 6.6:1.
	 */
	--cfff-gold-ink: #7A5200;

	--cfff-white: #FFFFFF;

	/* --- Neutrals ------------------------------------------------------- */
	--cfff-text: #1B2430;       /* 14.8:1 on white */
	--cfff-muted: #54637A;      /* 6.1:1 on white */
	--cfff-line: #DDE4ED;
	--cfff-surface: #F5F7FA;
	--cfff-surface-2: #EBF0F6;

	/* On-dark neutrals */
	--cfff-on-dark: rgba(255, 255, 255, 0.88);
	--cfff-on-dark-muted: rgba(255, 255, 255, 0.68);
	--cfff-on-dark-line: rgba(255, 255, 255, 0.16);

	/* --- Typography ----------------------------------------------------- */
	/*
	 * System stack by default: zero network requests, zero layout shift,
	 * no third-party font privacy questions. To move to a brand face later,
	 * self-host a variable font and change only these two lines.
	 * Suggested pairing if you do: Archivo (display) + Inter (body).
	 */
	--cfff-font-display: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--cfff-font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	--cfff-fs-display: clamp(2.5rem, 1.55rem + 4.2vw, 4.5rem);
	--cfff-fs-h1: clamp(2.125rem, 1.45rem + 3vw, 3.5rem);
	--cfff-fs-h2: clamp(1.75rem, 1.3rem + 2vw, 2.625rem);
	--cfff-fs-h3: clamp(1.1875rem, 1.05rem + 0.6vw, 1.4375rem);
	--cfff-fs-lead: clamp(1.0625rem, 1rem + 0.28vw, 1.1875rem);
	--cfff-fs-body: 1rem;
	--cfff-fs-sm: 0.9375rem;
	--cfff-fs-xs: 0.8125rem;

	--cfff-lh-tight: 1.04;
	--cfff-lh-snug: 1.2;
	--cfff-lh-body: 1.65;

	--cfff-tracking-display: -0.02em;
	--cfff-tracking-eyebrow: 0.14em;

	/* --- Spacing -------------------------------------------------------- */
	--cfff-space-1: 0.25rem;
	--cfff-space-2: 0.5rem;
	--cfff-space-3: 0.75rem;
	--cfff-space-4: 1rem;
	--cfff-space-5: 1.5rem;
	--cfff-space-6: 2rem;
	--cfff-space-7: 2.5rem;
	--cfff-space-8: 3rem;
	--cfff-space-9: 4rem;
	--cfff-space-10: 5rem;

	/* Vertical rhythm for full sections; shrinks on small screens */
	--cfff-section-y: clamp(3.5rem, 2rem + 6vw, 6.5rem);
	--cfff-section-y-tight: clamp(2.5rem, 1.5rem + 4vw, 4rem);

	/* --- Layout --------------------------------------------------------- */
	--cfff-container: 1200px;
	--cfff-container-wide: 1360px;
	--cfff-container-narrow: 760px;
	--cfff-gutter: clamp(1.125rem, 0.75rem + 1.5vw, 2rem);
	--cfff-grid-gap: clamp(1.25rem, 0.9rem + 1.4vw, 2rem);

	--cfff-header-h: 76px;
	--cfff-header-h-mobile: 62px;

	/* --- Borders, radius, shadow ---------------------------------------- */
	--cfff-radius: 4px;
	--cfff-radius-lg: 8px;
	--cfff-radius-pill: 999px;
	--cfff-border: 1px solid var(--cfff-line);

	--cfff-shadow-sm: 0 1px 2px rgba(14, 36, 64, 0.06);
	--cfff-shadow-md: 0 6px 20px rgba(14, 36, 64, 0.09);
	--cfff-shadow-lg: 0 18px 44px rgba(14, 36, 64, 0.14);

	/* --- Interaction ---------------------------------------------------- */
	--cfff-focus: 3px solid var(--cfff-gold);
	--cfff-focus-offset: 2px;
	--cfff-transition: 160ms ease;
	--cfff-tap: 48px; /* Minimum touch target */

	--cfff-z-header: 100;
	--cfff-z-menu: 110;
	--cfff-z-skip: 200;
}


/* =========================================================================
   02  BASE AND RESET
   ========================================================================= */

html {
	scroll-behavior: smooth;
	/* Stops sticky header covering in-page anchor targets */
	scroll-padding-top: calc(var(--cfff-header-h) + 12px);
}

body.cfff {
	margin: 0;
	background: var(--cfff-white);
	color: var(--cfff-text);
	font-family: var(--cfff-font-body);
	font-size: var(--cfff-fs-body);
	line-height: var(--cfff-lh-body);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

.cfff-page {
	display: flex;
	min-height: 100vh;
	flex-direction: column;
}

.cfff-main {
	flex: 1 0 auto;
}

/* Never leave a focused element invisible. */
.cfff a:focus-visible,
.cfff button:focus-visible,
.cfff input:focus-visible,
.cfff select:focus-visible,
.cfff textarea:focus-visible,
.cfff summary:focus-visible,
.cfff [tabindex]:focus-visible {
	outline: var(--cfff-focus);
	outline-offset: var(--cfff-focus-offset);
	border-radius: 2px;
}

/* Skip link: visible the moment it receives focus. */
.cfff-skip {
	position: absolute;
	z-index: var(--cfff-z-skip);
	top: 0;
	left: 0;
	padding: 0.75rem 1.25rem;
	transform: translateY(-120%);
	border-radius: 0 0 var(--cfff-radius) 0;
	background: var(--cfff-gold);
	color: var(--cfff-navy);
	font-weight: 700;
	text-decoration: none;
	transition: transform var(--cfff-transition);
}

.cfff-skip:focus {
	transform: translateY(0);
}

.cfff img,
.cfff svg,
.cfff video {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

.cfff-icon {
	display: inline-block;
	width: 1.25em;
	height: 1.25em;
	flex: none;
}


/* =========================================================================
   03  UTILITIES
   ========================================================================= */

.cfff-u-visually-hidden {
	position: absolute !important;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	white-space: nowrap;
	border: 0;
}

.cfff-u-center {
	text-align: center;
}

.cfff-u-measure {
	max-width: 62ch;
}

.cfff-u-measure-tight {
	max-width: 48ch;
}

.cfff-u-center .cfff-u-measure,
.cfff-u-center .cfff-u-measure-tight {
	margin-inline: auto;
}

.cfff-u-mt-4 {
	margin-top: var(--cfff-space-4);
}

.cfff-u-mt-6 {
	margin-top: var(--cfff-space-6);
}

.cfff-u-mt-8 {
	margin-top: var(--cfff-space-8);
}

/* Reset any of our list-based components that WPBakery content wraps. */
.cfff-trust,
.cfff-steps,
.cfff-benefits,
.cfff-metrics,
.cfff-quotes,
.cfff-checklist,
.cfff-pills,
.cfff-logowall {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cfff-menu-notice {
	margin: 0;
	padding: 0.5rem 0.75rem;
	border: 1px dashed var(--cfff-gold-600);
	color: var(--cfff-gold-ink);
	font-size: var(--cfff-fs-xs);
}


/* =========================================================================
   04  TYPOGRAPHY
   ========================================================================= */

.cfff-display,
.cfff-h1,
.cfff-h2,
.cfff-h3 {
	margin: 0 0 var(--cfff-space-4);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	text-wrap: balance;
}

.cfff-display {
	font-size: var(--cfff-fs-display);
	font-weight: 900;
	line-height: var(--cfff-lh-tight);
	letter-spacing: var(--cfff-tracking-display);
	text-transform: uppercase;
}

.cfff-h1 {
	font-size: var(--cfff-fs-h1);
	font-weight: 900;
	line-height: var(--cfff-lh-tight);
	letter-spacing: var(--cfff-tracking-display);
	text-transform: uppercase;
}

.cfff-h2 {
	font-size: var(--cfff-fs-h2);
	font-weight: 800;
	line-height: var(--cfff-lh-snug);
	letter-spacing: -0.01em;
	text-transform: uppercase;
}

.cfff-h3 {
	font-size: var(--cfff-fs-h3);
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
}

/*
 * Eyebrow. Note the colour: --cfff-gold-ink on light, plain gold on dark.
 * This is the accessibility fix for the old prototype, which used #F4B93F
 * eyebrow text on white at 1.77:1.
 */
.cfff-eyebrow {
	display: flex;
	align-items: center;
	margin: 0 0 var(--cfff-space-3);
	color: var(--cfff-gold-ink);
	font-size: var(--cfff-fs-xs);
	font-weight: 800;
	line-height: 1.4;
	letter-spacing: var(--cfff-tracking-eyebrow);
	text-transform: uppercase;
	gap: 0.625rem;
}

.cfff-eyebrow::before {
	width: 28px;
	height: 3px;
	flex: none;
	border-radius: 2px;
	background: var(--cfff-gold);
	content: "";
}

.cfff-u-center .cfff-eyebrow {
	justify-content: center;
}

.cfff-lead {
	margin: 0 0 var(--cfff-space-5);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-lead);
	line-height: 1.6;
	text-wrap: pretty;
}

.cfff-body {
	margin: 0 0 var(--cfff-space-4);
}

.cfff-body:last-child,
.cfff-lead:last-child {
	margin-bottom: 0;
}

/* Dark-section inversions */
.cfff-invert .cfff-display,
.cfff-invert .cfff-h1,
.cfff-invert .cfff-h2,
.cfff-invert .cfff-h3 {
	color: var(--cfff-white);
}

.cfff-invert .cfff-eyebrow {
	color: var(--cfff-gold);
}

.cfff-invert,
.cfff-invert .cfff-body {
	color: var(--cfff-on-dark);
}

.cfff-invert .cfff-lead {
	color: var(--cfff-on-dark-muted);
}


/* =========================================================================
   05  LAYOUT
   ========================================================================= */

.cfff-container {
	width: 100%;
	max-width: var(--cfff-container);
	margin-inline: auto;
	padding-inline: var(--cfff-gutter);
}

.cfff-container--wide {
	max-width: var(--cfff-container-wide);
}

.cfff-container--narrow {
	max-width: var(--cfff-container-narrow);
}

/* Applied to WPBakery rows via el_class */
.cfff-section {
	position: relative;
	padding-block: var(--cfff-section-y);
}

.cfff-section--tight {
	padding-block: var(--cfff-section-y-tight);
}

.cfff-section--flush-top {
	padding-top: 0;
}

.cfff-section--flush-bottom {
	padding-bottom: 0;
}

.cfff-section--surface {
	background: var(--cfff-surface);
}

.cfff-section--navy {
	background: var(--cfff-navy);
}

.cfff-section--navy-deep {
	background: var(--cfff-navy-900);
}

/* A single hairline of gold at the top of a dark band. Restrained, brand-owned. */
.cfff-section--rule-gold::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	background: var(--cfff-gold);
	content: "";
}

.cfff-sectionhead {
	margin-bottom: var(--cfff-space-8);
}

.cfff-sectionhead--center {
	text-align: center;
}

.cfff-sectionhead--center .cfff-lead {
	max-width: 64ch;
	margin-inline: auto;
}


/* =========================================================================
   06  BUTTONS
   ========================================================================= */

.cfff-btn {
	display: inline-flex;
	min-height: var(--cfff-tap);
	align-items: center;
	justify-content: center;
	padding: 0.8125rem 1.5rem;
	border: 2px solid transparent;
	border-radius: var(--cfff-radius);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-sm);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	cursor: pointer;
	gap: 0.5rem;
	transition: background-color var(--cfff-transition), border-color var(--cfff-transition), color var(--cfff-transition), transform var(--cfff-transition);
}

.cfff-btn:hover {
	transform: translateY(-1px);
	text-decoration: none;
}

.cfff-btn:active {
	transform: translateY(0);
}

/* Primary parent action */
.cfff-btn--gold {
	border-color: var(--cfff-gold);
	background: var(--cfff-gold);
	color: var(--cfff-navy);
}

.cfff-btn--gold:hover,
.cfff-btn--gold:focus {
	border-color: var(--cfff-gold-600);
	background: var(--cfff-gold-600);
	color: var(--cfff-navy);
}

/* Primary school action on light backgrounds */
.cfff-btn--navy {
	border-color: var(--cfff-navy);
	background: var(--cfff-navy);
	color: var(--cfff-white);
}

.cfff-btn--navy:hover,
.cfff-btn--navy:focus {
	border-color: var(--cfff-navy-700);
	background: var(--cfff-navy-700);
	color: var(--cfff-white);
}

.cfff-btn--outline {
	border-color: var(--cfff-navy);
	background: transparent;
	color: var(--cfff-navy);
}

.cfff-btn--outline:hover,
.cfff-btn--outline:focus {
	background: var(--cfff-navy);
	color: var(--cfff-white);
}

/* On navy backgrounds */
.cfff-btn--ghost {
	border-color: rgba(255, 255, 255, 0.55);
	background: transparent;
	color: var(--cfff-white);
}

.cfff-btn--ghost:hover,
.cfff-btn--ghost:focus {
	border-color: var(--cfff-white);
	background: var(--cfff-white);
	color: var(--cfff-navy);
}

.cfff-btn--sm {
	min-height: 42px;
	padding: 0.5rem 1.125rem;
	font-size: var(--cfff-fs-xs);
}

.cfff-btn--lg {
	min-height: 54px;
	padding: 0.9375rem 1.875rem;
	font-size: var(--cfff-fs-body);
}

.cfff-btn--full {
	width: 100%;
}

.cfff-btnrow {
	display: flex;
	flex-wrap: wrap;
	margin-top: var(--cfff-space-6);
	gap: var(--cfff-space-3);
}

.cfff-btnrow--center {
	justify-content: center;
}

/* Text link with a chevron, for tertiary actions inside cards. */
.cfff-textlink {
	display: inline-flex;
	align-items: center;
	color: var(--cfff-navy);
	font-size: var(--cfff-fs-sm);
	font-weight: 700;
	text-decoration: none;
	gap: 0.375rem;
}

.cfff-textlink::after {
	content: "\203A";
	font-size: 1.25em;
	line-height: 1;
	transition: transform var(--cfff-transition);
}

.cfff-textlink:hover::after {
	transform: translateX(3px);
}

.cfff-invert .cfff-textlink {
	color: var(--cfff-gold);
}


/* =========================================================================
   07  GLOBAL HEADER
   ========================================================================= */

.cfff-header {
	position: sticky;
	z-index: var(--cfff-z-header);
	top: 0;
	border-bottom: 1px solid var(--cfff-line);
	background: var(--cfff-white);
	transition: box-shadow var(--cfff-transition);
}

/* .is-stuck is added by cfff-site.js once the page scrolls. */
.cfff-header.is-stuck {
	box-shadow: var(--cfff-shadow-md);
}

.cfff-header__inner {
	display: flex;
	min-height: var(--cfff-header-h);
	align-items: center;
	gap: var(--cfff-space-5);
}

.cfff-header__brand {
	flex: none;
	margin-right: auto;
}

.cfff-logo {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
}

.cfff-logo__img {
	display: block;
	width: auto;
	max-height: 52px;
}

.cfff-logo__text {
	max-width: 15ch;
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: 1.0625rem;
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.01em;
	text-transform: uppercase;
}

.cfff-header__collapse {
	display: flex;
	align-items: center;
	gap: var(--cfff-space-6);
}

.cfff-header__actions {
	display: flex;
	align-items: center;
	gap: var(--cfff-space-3);
}


/* =========================================================================
   08  PRIMARY NAVIGATION (DESKTOP)
   ========================================================================= */

.cfff-nav {
	display: flex;
	min-width: 0;
	align-items: center;
}

.cfff-nav__list,
.cfff-nav__sub {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cfff-nav__list {
	align-items: center;
	gap: var(--cfff-space-1);
}

.cfff-nav__item {
	position: relative;
	display: flex;
	align-items: center;
}

.cfff-nav__link {
	display: inline-flex;
	align-items: center;
	padding: 0.625rem 0.75rem;
	border-radius: var(--cfff-radius);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-sm);
	font-weight: 700;
	text-decoration: none;
	transition: color var(--cfff-transition), background-color var(--cfff-transition);
}

.cfff-nav__label {
	position: relative;
	display: inline-block;
	padding-bottom: 2px;
}

/* Underline grows from the left. One small motion cue, no library. */
.cfff-nav__label::after {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 2px;
	background: var(--cfff-gold);
	content: "";
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--cfff-transition);
}

.cfff-nav__item--top:hover > .cfff-nav__link .cfff-nav__label::after,
.cfff-nav__item.is-current > .cfff-nav__link .cfff-nav__label::after,
.cfff-nav__item.is-ancestor > .cfff-nav__link .cfff-nav__label::after,
.cfff-nav__link:focus-visible .cfff-nav__label::after {
	transform: scaleX(1);
}

/* Submenu disclosure button sits next to the parent link, not inside it. */
.cfff-nav__toggle {
	display: inline-flex;
	width: 30px;
	height: 30px;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: var(--cfff-radius);
	margin-left: -0.375rem;
	background: transparent;
	color: var(--cfff-navy);
	cursor: pointer;
}

.cfff-nav__chev {
	width: 12px;
	height: 8px;
	transition: transform var(--cfff-transition);
}

.cfff-nav__toggle[aria-expanded="true"] .cfff-nav__chev {
	transform: rotate(180deg);
}

.cfff-nav__sub {
	position: absolute;
	z-index: var(--cfff-z-menu);
	top: 100%;
	left: 0;
	min-width: 240px;
	flex-direction: column;
	padding: 0.5rem;
	border: var(--cfff-border);
	border-top: 3px solid var(--cfff-gold);
	border-radius: 0 0 var(--cfff-radius-lg) var(--cfff-radius-lg);
	background: var(--cfff-white);
	box-shadow: var(--cfff-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--cfff-transition), transform var(--cfff-transition), visibility var(--cfff-transition);
}

.cfff-nav__item--has-sub.is-open > .cfff-nav__sub {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.cfff-nav__sublink {
	display: block;
	padding: 0.625rem 0.75rem;
	border-radius: var(--cfff-radius);
	color: var(--cfff-text);
	font-size: var(--cfff-fs-sm);
	font-weight: 600;
	text-decoration: none;
	transition: background-color var(--cfff-transition), color var(--cfff-transition);
}

.cfff-nav__sublink:hover,
.cfff-nav__sublink:focus {
	background: var(--cfff-navy-050);
	color: var(--cfff-navy);
}

/*
 * Hover-open on real pointer devices only. Touch devices get the button,
 * which prevents the classic "first tap opens, second tap navigates" trap.
 */
@media (hover: hover) and (pointer: fine) {

	.cfff-nav__item--has-sub:hover > .cfff-nav__sub,
	.cfff-nav__item--has-sub:focus-within > .cfff-nav__sub {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}
}

.cfff-navtoggle {
	display: none;
}


/* =========================================================================
   09  MOBILE NAVIGATION
   ========================================================================= */

@media (max-width: 1023px) {

	.cfff-header__inner {
		min-height: var(--cfff-header-h-mobile);
	}

	.cfff-logo__img {
		max-height: 40px;
	}

	.cfff-navtoggle {
		display: inline-flex;
		min-width: var(--cfff-tap);
		min-height: var(--cfff-tap);
		align-items: center;
		justify-content: center;
		padding: 0 0.5rem;
		border: 1px solid var(--cfff-line);
		border-radius: var(--cfff-radius);
		background: var(--cfff-white);
		color: var(--cfff-navy);
		cursor: pointer;
		gap: 0.5rem;
	}

	.cfff-navtoggle__bars {
		display: flex;
		width: 20px;
		height: 14px;
		flex-direction: column;
		justify-content: space-between;
	}

	.cfff-navtoggle__bars span {
		display: block;
		height: 2px;
		border-radius: 2px;
		background: currentColor;
		transition: transform var(--cfff-transition), opacity var(--cfff-transition);
	}

	.cfff-navtoggle[aria-expanded="true"] .cfff-navtoggle__bars span:nth-child(1) {
		transform: translateY(6px) rotate(45deg);
	}

	.cfff-navtoggle[aria-expanded="true"] .cfff-navtoggle__bars span:nth-child(2) {
		opacity: 0;
	}

	.cfff-navtoggle[aria-expanded="true"] .cfff-navtoggle__bars span:nth-child(3) {
		transform: translateY(-6px) rotate(-45deg);
	}

	.cfff-navtoggle__label {
		font-family: var(--cfff-font-display);
		font-size: var(--cfff-fs-xs);
		font-weight: 800;
		letter-spacing: 0.06em;
		text-transform: uppercase;
	}

	/*
	 * Closed panel uses visibility:hidden, which removes its links from the
	 * tab order without any JS. No aria-hidden juggling required.
	 */
	.cfff-header__collapse {
		position: fixed;
		z-index: var(--cfff-z-menu);
		top: var(--cfff-header-h-mobile);
		right: 0;
		left: 0;
		display: block;
		max-height: calc(100dvh - var(--cfff-header-h-mobile));
		padding: var(--cfff-space-4) var(--cfff-gutter) var(--cfff-space-8);
		border-top: 1px solid var(--cfff-line);
		background: var(--cfff-white);
		box-shadow: var(--cfff-shadow-lg);
		opacity: 0;
		overflow-y: auto;
		overscroll-behavior: contain;
		visibility: hidden;
		transform: translateY(-8px);
		transition: opacity var(--cfff-transition), transform var(--cfff-transition), visibility var(--cfff-transition);
	}

	.cfff-header__collapse.is-open {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
	}

	.cfff-nav__list {
		display: block;
	}

	.cfff-nav__item--top {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		border-bottom: 1px solid var(--cfff-line);
	}

	.cfff-nav__link {
		flex: 1;
		min-height: var(--cfff-tap);
		padding: 0.875rem 0.25rem;
		font-size: 1.0625rem;
	}

	.cfff-nav__label::after {
		display: none;
	}

	.cfff-nav__toggle {
		width: var(--cfff-tap);
		height: var(--cfff-tap);
		margin-left: 0;
		border: 1px solid var(--cfff-line);
	}

	.cfff-nav__chev {
		width: 16px;
		height: 10px;
	}

	/* Accordion, not a flyout. */
	.cfff-nav__sub {
		position: static;
		display: none;
		width: 100%;
		min-width: 0;
		padding: 0 0 var(--cfff-space-3) var(--cfff-space-4);
		border: 0;
		border-left: 3px solid var(--cfff-gold);
		border-radius: 0;
		margin-bottom: var(--cfff-space-3);
		background: transparent;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.cfff-nav__item--has-sub.is-open > .cfff-nav__sub {
		display: block;
	}

	.cfff-nav__sublink {
		min-height: var(--cfff-tap);
		display: flex;
		align-items: center;
		font-size: 1rem;
	}

	.cfff-header__actions {
		display: block;
		margin-top: var(--cfff-space-5);
	}

	.cfff-header__actions .cfff-btn {
		width: 100%;
		min-height: 52px;
		font-size: var(--cfff-fs-sm);
	}

	/* Set by JS while the panel is open, to stop the page behind scrolling. */
	body.cfff-menu-open {
		overflow: hidden;
	}
}

@media (min-width: 1024px) {

	.cfff-header__collapse {
		/* Guarantee the panel is never left hidden by a stale mobile class. */
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
	}
}


/* =========================================================================
   10  GLOBAL FOOTER
   ========================================================================= */

.cfff-footer {
	position: relative;
	padding-block: var(--cfff-space-9) var(--cfff-space-6);
	background: var(--cfff-navy-900);
	color: var(--cfff-on-dark-muted);
	font-size: var(--cfff-fs-sm);
}

.cfff-footer::before {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 4px;
	background: var(--cfff-gold);
	content: "";
}

.cfff-footer__grid {
	display: grid;
	gap: var(--cfff-space-7) var(--cfff-grid-gap);
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
}

/* min-width:0 stops long menu labels blowing out the grid track. */
.cfff-footer__col {
	min-width: 0;
}

.cfff-footer__col--brand {
	max-width: 320px;
}

.cfff-footer .cfff-logo__img {
	max-height: 56px;
	margin-bottom: var(--cfff-space-4);
}

.cfff-footer .cfff-logo__text {
	color: var(--cfff-white);
	margin-bottom: var(--cfff-space-4);
}

.cfff-footer__statement {
	margin: 0 0 var(--cfff-space-4);
	line-height: 1.6;
}

.cfff-footer__parent {
	margin: 0;
	color: var(--cfff-on-dark-muted);
	font-size: var(--cfff-fs-xs);
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.cfff-footer__parent a,
.cfff-footer__parent span {
	color: var(--cfff-gold);
	font-weight: 700;
	text-decoration: none;
}

.cfff-footer__parent a:hover {
	text-decoration: underline;
}

.cfff-footer__heading {
	margin: 0 0 var(--cfff-space-4);
	color: var(--cfff-white);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-xs);
	font-weight: 800;
	letter-spacing: var(--cfff-tracking-eyebrow);
	text-transform: uppercase;
}

.cfff-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cfff-footer__list li + li {
	margin-top: 0.125rem;
}

.cfff-footer__list a {
	display: inline-flex;
	min-height: 40px;
	align-items: center;
	color: var(--cfff-on-dark-muted);
	text-decoration: none;
	transition: color var(--cfff-transition);
}

.cfff-footer__list a:hover,
.cfff-footer__list a:focus {
	color: var(--cfff-white);
	text-decoration: underline;
}

.cfff-social {
	display: flex;
	margin: var(--cfff-space-4) 0 0;
	padding: 0;
	list-style: none;
	gap: var(--cfff-space-2);
}

.cfff-social__link {
	display: inline-flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--cfff-on-dark-line);
	border-radius: var(--cfff-radius);
	color: var(--cfff-on-dark);
	transition: background-color var(--cfff-transition), color var(--cfff-transition), border-color var(--cfff-transition);
}

.cfff-social__link:hover,
.cfff-social__link:focus {
	border-color: var(--cfff-gold);
	background: var(--cfff-gold);
	color: var(--cfff-navy-900);
}

.cfff-footer__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	padding-top: var(--cfff-space-5);
	border-top: 1px solid var(--cfff-on-dark-line);
	margin-top: var(--cfff-space-8);
	gap: var(--cfff-space-3);
}

.cfff-footer__copy {
	margin: 0;
	color: rgba(255, 255, 255, 0.5);
	font-size: var(--cfff-fs-xs);
}

.cfff-footer__legal {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
	gap: var(--cfff-space-4);
}

.cfff-footer__legal a {
	color: rgba(255, 255, 255, 0.5);
	font-size: var(--cfff-fs-xs);
	text-decoration: none;
}

.cfff-footer__legal a:hover,
.cfff-footer__legal a:focus {
	color: var(--cfff-white);
	text-decoration: underline;
}

@media (max-width: 900px) {

	.cfff-footer__grid {
		grid-template-columns: 1fr 1fr;
	}

	.cfff-footer__col--brand {
		max-width: none;
		grid-column: 1 / -1;
	}
}

@media (max-width: 520px) {

	.cfff-footer__grid {
		grid-template-columns: 1fr;
	}

	.cfff-footer__bar {
		flex-direction: column;
		align-items: flex-start;
	}
}


/* =========================================================================
   11  COMPONENTS
   ========================================================================= */

/* --- 11.1 Media frames ------------------------------------------------- */

/*
 * Fixed aspect ratios stop the page reflowing while images load, which is
 * the single biggest CLS win on an image-led marketing site.
 */
.cfff-media {
	position: relative;
	overflow: hidden;
	border-radius: var(--cfff-radius-lg);
	background: var(--cfff-surface-2);
}

.cfff-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cfff-media--4x3 {
	aspect-ratio: 4 / 3;
}

.cfff-media--16x10 {
	aspect-ratio: 16 / 10;
}

.cfff-media--square {
	aspect-ratio: 1 / 1;
}

/* Gold corner accent, used sparingly on hero and split imagery. */
.cfff-media--accent::after {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 96px;
	height: 8px;
	background: var(--cfff-gold);
	content: "";
}

/* --- 11.2 Hero --------------------------------------------------------- */

.cfff-hero {
	padding-block: clamp(2.5rem, 1.5rem + 4vw, 5rem);
	background: var(--cfff-white);
}

.cfff-hero__copy {
	max-width: 34rem;
}

.cfff-hero__title {
	margin-bottom: var(--cfff-space-4);
}

.cfff-hero__title em {
	display: block;
	color: var(--cfff-navy);
	font-style: normal;
}

.cfff-hero__note {
	display: flex;
	align-items: center;
	margin: var(--cfff-space-5) 0 0;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-xs);
	gap: 0.5rem;
}

.cfff-hero__note svg {
	color: var(--cfff-navy);
}

/* --- 11.3 Trust strip -------------------------------------------------- */

.cfff-trust {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(4, 1fr);
	background: var(--cfff-on-dark-line);
}

.cfff-trust__item {
	display: flex;
	flex-direction: column;
	padding: var(--cfff-space-6) var(--cfff-space-5);
	background: var(--cfff-navy);
	gap: var(--cfff-space-3);
}

.cfff-trust__icon {
	display: flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border: 1px solid rgba(244, 185, 63, 0.5);
	border-radius: var(--cfff-radius);
	color: var(--cfff-gold);
}

.cfff-trust__icon svg {
	width: 22px;
	height: 22px;
}

.cfff-trust__title {
	margin: 0;
	color: var(--cfff-white);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-sm);
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.cfff-trust__text {
	margin: 0;
	color: var(--cfff-on-dark-muted);
	font-size: var(--cfff-fs-xs);
	line-height: 1.6;
}

@media (max-width: 900px) {

	.cfff-trust {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 520px) {

	.cfff-trust {
		grid-template-columns: 1fr;
	}

	.cfff-trust__item {
		flex-direction: row;
		align-items: flex-start;
		padding: var(--cfff-space-5) var(--cfff-space-4);
		gap: var(--cfff-space-4);
	}

	.cfff-trust__icon {
		width: 38px;
		height: 38px;
		flex: none;
	}
}

/* --- 11.4 Program cards ------------------------------------------------ */

.cfff-card__media {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: var(--cfff-surface-2);
}

.cfff-card__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 400ms ease;
}

/*
 * WPBakery renders [vc_column_text] as
 *   .wpb_text_column (carries el_class)  >  .wpb_wrapper  >  your HTML
 * so the flex chain has to pass through .wpb_wrapper for margin-top:auto on
 * .cfff-card__foot to push the button to the bottom of every card.
 */
.cfff-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: var(--cfff-space-6) var(--cfff-space-5) var(--cfff-space-5);
}

.cfff-card__body > .wpb_wrapper {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.cfff-card__title {
	margin: 0 0 var(--cfff-space-3);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-h3);
	font-weight: 800;
	line-height: 1.2;
	text-transform: uppercase;
}

.cfff-card__text {
	margin: 0 0 var(--cfff-space-5);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
	line-height: 1.65;
}

.cfff-card__foot {
	margin-top: auto;
}

.cfff-card__tag {
	display: inline-block;
	padding: 0.25rem 0.625rem;
	border: 1px solid var(--cfff-line);
	border-radius: var(--cfff-radius-pill);
	margin-bottom: var(--cfff-space-3);
	background: var(--cfff-surface);
	color: var(--cfff-gold-ink);
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

/* --- 11.5 Numbered steps ----------------------------------------------- */

.cfff-steps {
	display: grid;
	gap: var(--cfff-grid-gap);
	grid-template-columns: repeat(3, 1fr);
	counter-reset: cfff-step;
	list-style: none;
	margin: 0;
	padding: 0;
}

.cfff-step {
	position: relative;
	padding-top: var(--cfff-space-6);
	border-top: 3px solid var(--cfff-line);
	counter-increment: cfff-step;
}

.cfff-step:first-child {
	border-top-color: var(--cfff-gold);
}

.cfff-step::before {
	display: block;
	margin-bottom: var(--cfff-space-3);
	color: var(--cfff-gold);
	content: counter(cfff-step, decimal-leading-zero);
	font-family: var(--cfff-font-display);
	font-size: 2.25rem;
	font-weight: 900;
	line-height: 1;
}

.cfff-step__title {
	margin: 0 0 var(--cfff-space-2);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-h3);
	font-weight: 800;
	line-height: 1.25;
}

.cfff-step__text {
	margin: 0;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
	line-height: 1.65;
}

.cfff-invert .cfff-step {
	border-top-color: var(--cfff-on-dark-line);
}

.cfff-invert .cfff-step:first-child {
	border-top-color: var(--cfff-gold);
}

.cfff-invert .cfff-step__title {
	color: var(--cfff-white);
}

.cfff-invert .cfff-step__text {
	color: var(--cfff-on-dark-muted);
}

@media (max-width: 780px) {

	.cfff-steps {
		grid-template-columns: 1fr;
		gap: var(--cfff-space-6);
	}
}

/* --- 11.6 Benefits ----------------------------------------------------- */

.cfff-benefits {
	display: grid;
	gap: 1px;
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
	padding: 0;
	background: var(--cfff-line);
	border: 1px solid var(--cfff-line);
	border-radius: var(--cfff-radius-lg);
	list-style: none;
	overflow: hidden;
}

.cfff-benefit {
	display: flex;
	flex-direction: column;
	padding: var(--cfff-space-6);
	background: var(--cfff-white);
	gap: var(--cfff-space-3);
	transition: background-color var(--cfff-transition);
}

.cfff-benefit:hover {
	background: var(--cfff-surface);
}

.cfff-benefit__icon {
	color: var(--cfff-navy);
}

.cfff-benefit__icon svg {
	width: 26px;
	height: 26px;
}

.cfff-benefit__title {
	margin: 0;
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: 1.0625rem;
	font-weight: 800;
	line-height: 1.25;
}

.cfff-benefit__text {
	margin: 0;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
	line-height: 1.6;
}

@media (max-width: 900px) {

	.cfff-benefits {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 560px) {

	.cfff-benefits {
		grid-template-columns: 1fr;
	}
}

/* --- 11.7 Checklist ---------------------------------------------------- */

.cfff-checklist {
	margin: 0 0 var(--cfff-space-6);
	padding: 0;
	list-style: none;
}

.cfff-checklist li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: var(--cfff-space-3);
	line-height: 1.55;
}

.cfff-checklist li::before {
	position: absolute;
	top: 0.3em;
	left: 0;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: var(--cfff-gold);
	content: "";
}

.cfff-checklist li::after {
	position: absolute;
	top: 0.55em;
	left: 5px;
	width: 8px;
	height: 4px;
	border-bottom: 2px solid var(--cfff-navy-900);
	border-left: 2px solid var(--cfff-navy-900);
	content: "";
	transform: rotate(-45deg);
}

/* --- 11.8 Audience pills ----------------------------------------------- */

.cfff-pills {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 var(--cfff-space-6);
	padding: 0;
	list-style: none;
	gap: var(--cfff-space-2);
}

.cfff-pills li {
	padding: 0.375rem 0.875rem;
	border: 1px solid var(--cfff-on-dark-line);
	border-radius: var(--cfff-radius-pill);
	color: var(--cfff-on-dark);
	font-size: var(--cfff-fs-xs);
	font-weight: 700;
}

/* --- 11.9 Social proof (placeholder scaffolding) ----------------------- */

.cfff-metrics {
	display: grid;
	gap: var(--cfff-grid-gap);
	grid-template-columns: repeat(3, 1fr);
	margin: 0 0 var(--cfff-space-8);
	padding: 0;
	list-style: none;
}

.cfff-metric {
	padding: var(--cfff-space-5);
	border: var(--cfff-border);
	border-top: 3px solid var(--cfff-gold);
	border-radius: var(--cfff-radius);
	background: var(--cfff-white);
	text-align: center;
}

.cfff-metric__value {
	display: block;
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem);
	font-weight: 900;
	line-height: 1;
}

.cfff-metric__label {
	display: block;
	margin-top: var(--cfff-space-2);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-xs);
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.cfff-quotes {
	display: grid;
	gap: var(--cfff-grid-gap);
	grid-template-columns: repeat(3, 1fr);
	margin: 0;
	padding: 0;
	list-style: none;
}

.cfff-quotes > li {
	display: flex;
}

.cfff-quote {
	display: flex;
	width: 100%;
	flex-direction: column;
	padding: var(--cfff-space-6);
	border: var(--cfff-border);
	border-radius: var(--cfff-radius-lg);
	background: var(--cfff-white);
}

.cfff-quote__mark {
	width: 26px;
	height: 20px;
	margin-bottom: var(--cfff-space-4);
	color: var(--cfff-gold);
}

.cfff-quote blockquote {
	margin: 0 0 var(--cfff-space-5);
	color: var(--cfff-text);
	font-size: var(--cfff-fs-sm);
	line-height: 1.7;
}

.cfff-quote figcaption {
	padding-top: var(--cfff-space-4);
	border-top: var(--cfff-border);
	margin-top: auto;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-xs);
}

.cfff-quote cite {
	display: block;
	color: var(--cfff-navy);
	font-size: var(--cfff-fs-sm);
	font-style: normal;
	font-weight: 700;
}

/*
 * Placeholder state. Deliberately obvious so an empty testimonial can never
 * be mistaken for a real one, and so it is easy to spot before launch.
 */
.cfff-is-placeholder {
	position: relative;
	border-style: dashed;
	border-color: var(--cfff-gold-600);
	background: #FFFBF2;
}

.cfff-is-placeholder::before {
	position: absolute;
	top: 0;
	left: 0;
	padding: 2px 8px;
	background: var(--cfff-gold-600);
	color: var(--cfff-navy-900);
	content: "PLACEHOLDER";
	font-size: 0.625rem;
	font-weight: 800;
	letter-spacing: 0.1em;
}

.cfff-logowall {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	margin: var(--cfff-space-8) 0 0;
	padding: 0;
	list-style: none;
	gap: var(--cfff-space-6);
}

.cfff-logowall li {
	display: flex;
	width: 150px;
	height: 70px;
	align-items: center;
	justify-content: center;
	border: 1px dashed var(--cfff-line);
	border-radius: var(--cfff-radius);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-xs);
	text-align: center;
}

.cfff-logowall img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

@media (max-width: 900px) {

	.cfff-metrics,
	.cfff-quotes {
		grid-template-columns: 1fr;
	}
}

/* --- 11.10 FAQ accordion ----------------------------------------------- */

/*
 * Built on <details>/<summary>. Keyboard operable, screen-reader announced,
 * and findable by in-page browser search, with zero JavaScript.
 */
.cfff-faq {
	display: grid;
	gap: var(--cfff-space-3);
	grid-template-columns: 1fr 1fr;
	align-items: start;
}

.cfff-faq__item {
	overflow: hidden;
	border: var(--cfff-border);
	border-radius: var(--cfff-radius);
	background: var(--cfff-white);
}

.cfff-faq__item[open] {
	border-color: var(--cfff-navy);
}

.cfff-faq__q {
	display: flex;
	min-height: var(--cfff-tap);
	align-items: center;
	justify-content: space-between;
	padding: var(--cfff-space-4) var(--cfff-space-5);
	color: var(--cfff-navy);
	cursor: pointer;
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-sm);
	font-weight: 700;
	gap: var(--cfff-space-4);
	list-style: none;
}

.cfff-faq__q::-webkit-details-marker {
	display: none;
}

.cfff-faq__q:hover {
	background: var(--cfff-surface);
}

.cfff-faq__q::after {
	width: 14px;
	height: 14px;
	flex: none;
	background: currentColor;
	content: "";
	transition: transform var(--cfff-transition);
	-webkit-mask: no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
	mask: no-repeat center / 14px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.cfff-faq__item[open] .cfff-faq__q::after {
	transform: rotate(45deg);
}

.cfff-faq__a {
	padding: 0 var(--cfff-space-5) var(--cfff-space-5);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
	line-height: 1.7;
}

.cfff-faq__a p {
	margin: 0 0 var(--cfff-space-3);
}

.cfff-faq__a p:last-child {
	margin-bottom: 0;
}

@media (max-width: 860px) {

	.cfff-faq {
		grid-template-columns: 1fr;
	}
}

/* --- 11.11 Split CTA panel --------------------------------------------- */

.cfff-cta {
	display: grid;
	overflow: hidden;
	border-radius: var(--cfff-radius-lg);
	grid-template-columns: 1fr 1fr;
	background: var(--cfff-navy);
}

.cfff-cta__panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(2rem, 1.4rem + 2.6vw, 3.5rem);
}

.cfff-cta__panel--gold {
	background: var(--cfff-gold);
}

.cfff-cta__panel--gold .cfff-h2,
.cfff-cta__panel--gold .cfff-eyebrow {
	color: var(--cfff-navy);
}

.cfff-cta__panel--gold .cfff-lead {
	color: rgba(25, 57, 99, 0.82);
}

.cfff-cta__panel--gold .cfff-eyebrow::before {
	background: var(--cfff-navy);
}

@media (max-width: 780px) {

	.cfff-cta {
		grid-template-columns: 1fr;
	}
}


/* =========================================================================
   12  WPBAKERY INTEGRATION
   =========================================================================
   WPBakery renders a column as:
     .vc_column_container  >  .vc_column-inner  >  .wpb_wrapper
   By default the 15px gutter lives on .vc_column-inner. To turn a column into
   a card we move that gutter out to the container so .vc_column-inner can
   become the card surface itself. That keeps the outer geometry identical
   while giving us one clean, self-contained element to style, which is why
   no component here needs an HTML wrapper split across two elements.
   ========================================================================= */

/* WPBakery's default 35px element margin fights our own spacing scale. */
.cfff-section .wpb_content_element,
.cfff-section .vc_row,
.cfff-section .wpb_text_column,
.cfff-hero .wpb_content_element {
	margin-bottom: 0;
}

.cfff-section .wpb_text_column > .wpb_wrapper > *:last-child {
	margin-bottom: 0;
}

/*
 * The page-builder container.
 *
 * The CFFF Full Width template wraps the_content() in .cfff-pagebuilder, so
 * every WPBakery row is centred at our container width by default.
 */
.cfff-pagebuilder {
	width: 100%;
	max-width: var(--cfff-container);
	margin-inline: auto;
	padding-inline: var(--cfff-gutter);
}

/*
 * Full-bleed rows, done in CSS rather than WPBakery's "Stretch row".
 *
 * WPBakery stretches rows with JavaScript after first paint, which produces a
 * visible jump and counts against CLS. This does the same job in CSS, so the
 * band is full width on the very first frame. body has overflow-x: clip, so
 * the 100vw value cannot create a horizontal scrollbar.
 *
 * You can still use WPBakery's own "Stretch row" option on rows you add later;
 * both approaches coexist.
 *
 * Both the margin and the padding percentages resolve against the SAME
 * containing block (.cfff-pagebuilder's content box), so the negative margin
 * breaks the band out to the viewport edge and the matching positive padding
 * puts the content back exactly where it was. No JavaScript, no reflow.
 */
.cfff-bleed {
	margin-inline: calc(50% - 50vw);
	padding-inline: calc(50vw - 50%);
}

/* Equal-height rows: make the card fill the column. */
.vc_row-o-equal-height > .vc_column_container > .vc_column-inner {
	height: 100%;
}

/* --- Column-as-card ----------------------------------------------------- */

.cfff-card {
	display: flex;
	padding-inline: 15px;
}

.cfff-card > .vc_column-inner {
	display: flex;
	overflow: hidden;
	width: 100%;
	flex-direction: column;
	padding: 0;
	border: var(--cfff-border);
	border-top: 4px solid var(--cfff-gold);
	border-radius: var(--cfff-radius-lg);
	background: var(--cfff-white);
	box-shadow: var(--cfff-shadow-sm);
	transition: box-shadow var(--cfff-transition), transform var(--cfff-transition);
}

.cfff-card > .vc_column-inner > .wpb_wrapper {
	display: flex;
	flex: 1;
	flex-direction: column;
}

.cfff-card:hover > .vc_column-inner {
	box-shadow: var(--cfff-shadow-md);
	transform: translateY(-3px);
}

.cfff-card:hover .cfff-card__media img {
	transform: scale(1.03);
}

/* WPBakery image element inside a card: strip its wrappers' spacing. */
.cfff-card .wpb_single_image,
.cfff-card .wpb_single_image .vc_single_image-wrapper,
.cfff-card .wpb_single_image .vc_figure {
	display: block;
	width: 100%;
	margin: 0;
}

.cfff-card .wpb_single_image img {
	display: block;
	width: 100%;
	height: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 0;
}

/* --- Split rows (image beside copy) ------------------------------------- */

.cfff-split > .vc_column_container > .vc_column-inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.cfff-split .wpb_single_image,
.cfff-split .wpb_single_image .vc_single_image-wrapper,
.cfff-split .wpb_single_image .vc_figure {
	display: block;
	width: 100%;
	margin: 0;
}

.cfff-split .wpb_single_image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--cfff-radius-lg);
}

.cfff-split--media-first > .vc_column_container:first-child {
	order: 2;
}

@media (max-width: 900px) {

	.cfff-split--media-first > .vc_column_container:first-child {
		order: 0;
	}
}

/* Hero image: never lazy, never square-cropped on mobile. */
.cfff-hero-media .wpb_single_image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	border-radius: var(--cfff-radius-lg);
	object-fit: cover;
}

/* Vertical rhythm between stacked WPBakery columns on small screens. */
@media (max-width: 900px) {

	.cfff-section .vc_column_container + .vc_column_container,
	.cfff-hero .vc_column_container + .vc_column_container {
		margin-top: var(--cfff-space-6);
	}

	.cfff-cards .vc_column_container + .vc_column_container {
		margin-top: var(--cfff-grid-gap);
	}
}

/* Reverse stacking so copy leads on mobile in image-left rows. */
@media (max-width: 900px) {

	.cfff-stack-copy-first {
		display: flex;
		flex-direction: column;
	}

	.cfff-stack-copy-first > .cfff-copy-col {
		order: 1;
	}

	.cfff-stack-copy-first > .cfff-media-col {
		order: 2;
		margin-top: var(--cfff-space-6);
	}
}


/* =========================================================================
   13  BLOG AND GENERIC TEMPLATES
   ========================================================================= */

.cfff-pagehead {
	margin-bottom: var(--cfff-space-7);
}

.cfff-pagehead__title {
	margin: 0 0 var(--cfff-space-3);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-h1);
	font-weight: 900;
	line-height: var(--cfff-lh-snug);
}

.cfff-pagehead__meta,
.cfff-pagehead__desc {
	margin: 0;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
}

.cfff-prose {
	color: var(--cfff-text);
}

.cfff-prose h2 {
	margin: var(--cfff-space-8) 0 var(--cfff-space-3);
	color: var(--cfff-navy);
	font-family: var(--cfff-font-display);
	font-size: var(--cfff-fs-h2);
	font-weight: 800;
	line-height: 1.2;
}

.cfff-prose h3 {
	margin: var(--cfff-space-7) 0 var(--cfff-space-3);
	color: var(--cfff-navy);
	font-size: var(--cfff-fs-h3);
	font-weight: 700;
}

.cfff-prose p,
.cfff-prose ul,
.cfff-prose ol {
	margin: 0 0 var(--cfff-space-4);
}

.cfff-prose a {
	color: var(--cfff-navy);
	text-underline-offset: 3px;
}

.cfff-prose__figure {
	margin: 0 0 var(--cfff-space-6);
}

.cfff-prose__figure img {
	border-radius: var(--cfff-radius-lg);
}

.cfff-postgrid {
	display: grid;
	gap: var(--cfff-grid-gap);
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.cfff-postcard {
	display: flex;
	overflow: hidden;
	flex-direction: column;
	border: var(--cfff-border);
	border-radius: var(--cfff-radius-lg);
	background: var(--cfff-white);
}

.cfff-postcard__media img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
}

.cfff-postcard__body {
	padding: var(--cfff-space-5);
}

.cfff-postcard__title {
	margin: 0 0 var(--cfff-space-2);
	font-family: var(--cfff-font-display);
	font-size: 1.125rem;
	font-weight: 800;
	line-height: 1.25;
}

.cfff-postcard__title a {
	color: var(--cfff-navy);
	text-decoration: none;
}

.cfff-postcard__title a:hover {
	text-decoration: underline;
}

.cfff-postcard__meta {
	margin: 0 0 var(--cfff-space-3);
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-xs);
}

.cfff-postcard__excerpt {
	margin: 0;
	color: var(--cfff-muted);
	font-size: var(--cfff-fs-sm);
}

.cfff-pagination {
	margin-top: var(--cfff-space-8);
}

.cfff-pagination .page-numbers {
	display: inline-flex;
	min-width: 44px;
	min-height: 44px;
	align-items: center;
	justify-content: center;
	padding: 0 0.625rem;
	border: var(--cfff-border);
	border-radius: var(--cfff-radius);
	margin-right: 0.375rem;
	color: var(--cfff-navy);
	text-decoration: none;
}

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

.cfff-404__search {
	max-width: 420px;
	margin: var(--cfff-space-8) auto 0;
}


/* =========================================================================
   14  MOTION, PRINT, FORCED COLORS
   ========================================================================= */

@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}

	.cfff *,
	.cfff *::before,
	.cfff *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}

	.cfff-btn:hover,
	.cfff-card:hover > .vc_column-inner {
		transform: none;
	}
}

@media (forced-colors: active) {

	.cfff-btn {
		border: 2px solid ButtonText;
	}

	.cfff-nav__label::after,
	.cfff-eyebrow::before {
		forced-color-adjust: none;
	}
}

@media print {

	.cfff-header,
	.cfff-footer,
	.cfff-skip,
	.cfff-btnrow {
		display: none !important;
	}

	.cfff-section {
		padding-block: 1rem;
	}

	.cfff-faq__item {
		border: 1px solid #000;
	}

	.cfff-faq__a {
		display: block !important;
	}
}