/* ==========================================================================
   Change Course blocks
   Colours and spacing come from the theme's theme.json presets, so these blocks
   inherit the design system rather than hard-coding a second copy of it.
   ========================================================================== */

:root {
	--cc-b-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--cc-b-navy: var(--wp--preset--color--navy, #262262);
	--cc-b-teal: var(--wp--preset--color--teal, #00a19b);
	--cc-b-teal-dark: var(--wp--preset--color--teal-dark, #008782);
	--cc-b-teal-deep: var(--wp--preset--color--teal-deep, #006d69);
	--cc-b-gold: var(--wp--preset--color--gold, #fca311);
	--cc-b-gold-deep: var(--wp--preset--color--gold-deep, #a06606);
	--cc-b-slate: var(--wp--preset--color--slate, #3a3753);
	--cc-b-muted: var(--wp--preset--color--muted, #5b5872);
	--cc-b-faint: var(--wp--preset--color--faint, #8a8898);
	--cc-b-line: var(--wp--preset--color--line, #e3e1ec);
	--cc-b-tint: var(--wp--preset--color--tint, #faf9fc);
	--cc-b-teal-tint: var(--wp--preset--color--teal-tint, #e6f6f5);
	--cc-b-gold-tint: var(--wp--preset--color--gold-tint, #fff5e1);
	--cc-b-track: var(--wp--preset--color--track, #eeecf4);
	--cc-b-glass: rgba(255, 255, 255, 0.07);
	--cc-b-glass-line: rgba(255, 255, 255, 0.16);
	--cc-b-on-navy: rgba(255, 255, 255, 0.86);
}

/* Components inherit the page's body rhythm unless the design sets one. The
   design sets leading only on running text, so reset it at each component root
   and let the specific rules below opt back in. */
.cc-stat, .cc-path-card, .cc-icon-card, .cc-phase, .cc-track, .cc-tile,
.cc-person, .cc-press, .cc-media-card, .cc-logo, .cc-download, .cc-progress,
.cc-badge, .cc-photo {
	line-height: var(--cc-lh);
}

.cc-icon { display: block; flex-shrink: 0; }
.cc-arrow { display: inline-block; vertical-align: -2px; }

/* Shared media wells ------------------------------------------------------ */

.cc-media { display: block; overflow: hidden; background: var(--cc-b-tint); }

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

.cc-media--empty {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 16px;
	min-height: 120px;
	background: rgba(127, 127, 127, 0.08);
	border: 1px dashed rgba(127, 127, 127, 0.45);
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
}

/* Stat -------------------------------------------------------------------- */

/* Stat cards often share a row with taller content and centre against it. */
.cc-stat {
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

.cc-stat--card {
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	padding: 28px;
}

/* The headline figures the design sets in their own section sit in a roomier box. */
.cc-stat--card.cc-stat--size-large { padding: 40px; }

.cc-stat--dark {
	background: var(--cc-b-navy);
	border-radius: 16px;
	padding: 28px;
}

.cc-stat--glass {
	background: var(--cc-b-glass);
	border: 1px solid var(--cc-b-glass-line);
	border-radius: 16px;
	padding: 30px;
}

.cc-stat--tint {
	background: var(--cc-b-tint);
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	padding: 36px;
}

.cc-stat--callout {
	display: inline-flex;
	flex-direction: row;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 14px;
	background: rgba(252, 163, 17, 0.13);
	border: 1px solid rgba(252, 163, 17, 0.42);
	border-radius: 12px;
	padding: 20px 26px;
}

.cc-stat__eyebrow {
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 800;
	line-height: 1.3;
	color: var(--cc-b-teal);
}

.cc-stat--dark.cc-stat--eyebrow-auto .cc-stat__eyebrow,
.cc-stat--callout.cc-stat--eyebrow-auto .cc-stat__eyebrow { color: var(--cc-b-gold); }

.cc-stat--glass.cc-stat--eyebrow-auto .cc-stat__eyebrow { color: rgba(255, 255, 255, 0.6); letter-spacing: 0.12em; }

.cc-stat--eyebrow-teal .cc-stat__eyebrow { color: var(--cc-b-teal); }
.cc-stat--eyebrow-gold .cc-stat__eyebrow { color: var(--cc-b-gold); }
.cc-stat--eyebrow-light .cc-stat__eyebrow { color: rgba(255, 255, 255, 0.6); letter-spacing: 0.12em; }

.cc-stat__value {
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	color: var(--cc-b-navy);
	margin-top: 14px;
}

.cc-stat > .cc-stat__value:first-child,
.cc-stat > .cc-stat__compare:first-child { margin-top: 0; }

.cc-stat__value--white { color: #fff; }
.cc-stat__value--gold { color: var(--cc-b-gold); }
.cc-stat__value--teal { color: var(--cc-b-teal); }

.cc-stat--size-small .cc-stat__value { font-size: 40px; letter-spacing: -0.025em; }
.cc-stat--size-medium .cc-stat__value { font-size: 44px; }
.cc-stat--size-default .cc-stat__value { font-size: 52px; }
.cc-stat--size-xl .cc-stat__value { font-size: 58px; letter-spacing: -0.025em; }
.cc-stat--size-large .cc-stat__value { font-size: 64px; letter-spacing: -0.03em; }

.cc-stat--callout .cc-stat__value { margin-top: 0; font-size: 34px; letter-spacing: -0.025em; }

.cc-stat__suffix {
	font-size: 22px;
	font-weight: 700;
	color: var(--cc-b-muted);
	letter-spacing: 0;
}

.cc-stat--dark .cc-stat__suffix,
.cc-stat--glass .cc-stat__suffix { color: rgba(255, 255, 255, 0.7); }

.cc-stat__compare {
	display: flex;
	align-items: baseline;
	gap: 14px;
	margin-top: 14px;
	flex-wrap: wrap;
}

.cc-stat__before {
	font-size: 30px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -0.02em;
	color: rgba(255, 255, 255, 0.42);
}

.cc-stat--card .cc-stat__before,
.cc-stat--tint .cc-stat__before { color: var(--wp--preset--color--line-strong, #cdcad9); }

.cc-stat__arrow {
	width: 20px;
	height: 20px;
	stroke-width: 2.4;
	color: rgba(255, 255, 255, 0.5);
	align-self: center;
}

.cc-stat--card .cc-stat__arrow,
.cc-stat--tint .cc-stat__arrow { color: var(--wp--preset--color--line-strong, #cdcad9); }

.cc-stat__compare .cc-stat__value { margin-top: 0; }

.cc-stat__label {
	font-size: 13px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--cc-b-muted);
	margin-top: 12px;
	line-height: 1.45;
}

.cc-stat--dark .cc-stat__label,
.cc-stat--glass .cc-stat__label { color: rgba(255, 255, 255, 0.7); }

.cc-stat__note {
	font-size: 16px;
	line-height: 1.6;
	color: var(--cc-b-slate);
	margin: 14px 0 0;
}

.cc-stat--dark .cc-stat__note,
.cc-stat--glass .cc-stat__note { color: var(--cc-b-on-navy); }

.cc-stat--callout .cc-stat__note {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	color: #fff;
	flex: 1 1 260px;
}

/* Path card --------------------------------------------------------------- */

.cc-path-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border-radius: 16px;
	padding: 28px;
	text-decoration: none;
	height: 100%;
}

.cc-path-card--elevated {
	box-shadow: 0 12px 32px rgba(38, 34, 98, 0.12), 0 4px 8px rgba(38, 34, 98, 0.06);
}

.cc-path-card--accent-gold { border-top: 4px solid var(--cc-b-gold); }
.cc-path-card--accent-teal { border-top: 4px solid var(--cc-b-teal); }

.cc-path-card--dark { background: var(--cc-b-navy); box-shadow: none; }

.cc-path-card__icon { color: var(--cc-b-teal); display: block; }
.cc-path-card--dark .cc-path-card__icon { color: var(--cc-b-gold); }

.cc-path-card__title {
	font-size: 22px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin: 18px 0 8px;
	letter-spacing: -0.01em;
}

.cc-path-card--dark .cc-path-card__title { color: #fff; }

.cc-path-card__text {
	font-size: 15px;
	line-height: 1.55;
	color: var(--cc-b-muted);
	margin: 0 0 20px;
	flex: 1;
}

.cc-path-card--dark .cc-path-card__text { color: rgba(255, 255, 255, 0.72); }

.cc-path-card__link {
	font-size: 15px;
	font-weight: 700;
	color: var(--cc-b-teal-dark);
	display: inline-flex;
	align-items: center;
	gap: 7px;
}

.cc-path-card--dark .cc-path-card__link { color: var(--cc-b-gold); }

a.cc-path-card:hover { text-decoration: none; }

/* Icon card --------------------------------------------------------------- */

.cc-icon-card {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	height: 100%;
}

.cc-icon-card--bordered {
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	padding: 30px;
}

.cc-icon-card--tint {
	background: var(--cc-b-tint);
	border-radius: 16px;
	padding: 28px;
}

.cc-icon-card--dark {
	background: var(--cc-b-navy);
	border-radius: 16px;
	padding: 30px;
}

.cc-icon-card--plain { padding: 0; }

.cc-icon-card__icon { color: var(--cc-b-teal); display: block; }
.cc-icon-card--dark .cc-icon-card__icon { color: var(--cc-b-gold); }

.cc-icon-card__eyebrow {
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--cc-b-teal);
	margin-bottom: 10px;
}

.cc-icon-card__title {
	font-size: 21px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin: 18px 0 8px;
	letter-spacing: -0.005em;
}

.cc-icon-card--tint .cc-icon-card__title,
.cc-icon-card--plain .cc-icon-card__title { font-size: 18px; margin: 16px 0 7px; }

.cc-icon-card--plain .cc-icon-card__title { font-size: 19px; margin-top: 0; }

.cc-icon-card:not(:has(.cc-icon-card__icon)) .cc-icon-card__title { margin-top: 0; }

.cc-icon-card--dark .cc-icon-card__title { color: #fff; }

.cc-icon-card__text {
	font-size: 15px;
	line-height: 1.6;
	color: var(--cc-b-muted);
	margin: 0 0 18px;
	flex: 1;
}

.cc-icon-card--tint .cc-icon-card__text,
.cc-icon-card--plain .cc-icon-card__text { margin-bottom: 0; }

.cc-icon-card--dark .cc-icon-card__text { color: rgba(255, 255, 255, 0.72); }

.cc-icon-card__link {
	font-size: 15px;
	font-weight: 700;
	color: var(--cc-b-teal-dark);
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: auto;
}

.cc-icon-card--dark .cc-icon-card__link { color: var(--cc-b-gold); }

a.cc-icon-card:hover { text-decoration: none; }

/* Phase / step ------------------------------------------------------------ */

.cc-phase { height: 100%; }

.cc-phase--border-top { padding-top: 26px; border-top: 4px solid var(--cc-b-teal); }
.cc-phase--border-top.cc-phase--accent-gold { border-top-color: var(--cc-b-gold); }

.cc-phase__step {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.1em;
	color: var(--cc-b-teal);
	text-transform: uppercase;
}

.cc-phase--accent-gold .cc-phase__step { color: var(--cc-b-gold-deep); }

.cc-phase__chip {
	width: 38px;
	height: 38px;
	border-radius: 8px;
	background: var(--cc-b-teal-tint);
	color: var(--cc-b-teal-deep);
	font-weight: 800;
	font-size: 16px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cc-phase--accent-gold .cc-phase__chip {
	background: var(--cc-b-gold-tint);
	color: var(--cc-b-gold-deep);
}

.cc-phase__title {
	font-size: 24px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin: 12px 0 12px;
	letter-spacing: -0.01em;
}

.cc-phase--chip .cc-phase__title { font-size: 19px; margin: 16px 0 7px; }
.cc-phase--plain .cc-phase__title { font-size: 20px; margin: 12px 0 8px; }

.cc-phase__text {
	font-size: 16px;
	line-height: 1.65;
	color: var(--cc-b-slate);
	margin: 0 0 16px;
}

.cc-phase--chip .cc-phase__text,
.cc-phase--plain .cc-phase__text {
	font-size: 15px;
	line-height: 1.6;
	color: var(--cc-b-muted);
	margin-bottom: 0;
}

.cc-phase__meta {
	font-size: 14px;
	line-height: 1.7;
	color: var(--cc-b-muted);
}

/* Track card -------------------------------------------------------------- */

.cc-track {
	display: block;
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
}

a.cc-track:hover { text-decoration: none; }

.cc-track--large .cc-track__media { height: 210px; }
.cc-track--large .cc-track__body { padding: 26px 28px 28px; }
.cc-track--large .cc-track__title { font-size: 23px; margin-bottom: 8px; letter-spacing: -0.01em; }
.cc-track--large .cc-track__text { font-size: 15px; line-height: 1.6; margin-bottom: 16px; }
.cc-track--large { box-shadow: 0 4px 12px rgba(38, 34, 98, 0.08); border-color: transparent; }

.cc-track__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 15px;
	font-weight: 700;
	color: var(--cc-b-teal-dark);
	margin-top: 4px;
}

.cc-track__media { height: 150px; }
.cc-track__media.cc-media--empty { border: none; border-bottom: 1px dashed var(--wp--preset--color--line-strong, #cdcad9); }

.cc-track__body { padding: 22px 24px 24px; }

.cc-track__badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--cc-b-gold-deep);
	background: var(--cc-b-gold-tint);
	padding: 4px 9px;
	border-radius: 999px;
	margin-bottom: 10px;
}

.cc-track__title {
	font-size: 19px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin: 0 0 7px;
	line-height: 1.3;
}

.cc-track__text {
	font-size: 15px;
	line-height: 1.55;
	color: var(--cc-b-muted);
	margin: 0;
}

/* Link tile --------------------------------------------------------------- */

.cc-tile {
	display: block;
	text-decoration: none;
	height: 100%;
}

a.cc-tile:hover { text-decoration: none; }

.cc-tile__title {
	display: block;
	font-size: 16px;
	font-weight: 800;
	color: var(--cc-b-navy);
}

.cc-tile__text {
	display: block;
	font-size: 14px;
	color: var(--cc-b-muted);
	margin-top: 5px;
	line-height: 1.5;
}

.cc-tile--plain { background: #fff; padding: 22px 20px; }
a.cc-tile--plain:hover { background: var(--cc-b-tint); }

.cc-tile--bordered {
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 12px;
	padding: 18px 22px;
}

.cc-tile--tint {
	background: var(--cc-b-tint);
	border-radius: 12px;
	padding: 24px;
}

.cc-tile--tint .cc-tile__title { font-size: 18px; }
.cc-tile--tint .cc-tile__text { font-size: 15px; line-height: 1.6; margin-top: 7px; }

.cc-tile--glass,
.cc-tile--glass-lg {
	background: var(--cc-b-glass);
	border: 1px solid var(--cc-b-glass-line);
	border-radius: 10px;
	padding: 18px 22px;
}

.cc-tile--glass-lg {
	border-radius: 16px;
	padding: 26px;
}

.cc-tile__link {
	display: block;
	font-size: 15px;
	font-weight: 700;
	color: var(--cc-b-teal-dark);
	margin-top: 16px;
}

.cc-tile--glass .cc-tile__link,
.cc-tile--glass-lg .cc-tile__link { color: var(--cc-b-gold); }
.cc-tile--glass .cc-tile__title,
.cc-tile--glass-lg .cc-tile__title { font-size: 20px; margin-bottom: 8px; }
.cc-tile--glass .cc-tile__title,
.cc-tile--glass-lg .cc-tile__title { color: #fff; }
.cc-tile--glass .cc-tile__text,
.cc-tile--glass-lg .cc-tile__text { color: rgba(255, 255, 255, 0.7); font-size: 15px; line-height: 1.55; margin-top: 3px; }
a.cc-tile--glass:hover,
a.cc-tile--glass-lg:hover { background: rgba(255, 255, 255, 0.14); }

/* Person ------------------------------------------------------------------ */

.cc-person__media { border-radius: 12px; }

.cc-person__name {
	font-size: 16px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin-top: 14px;
}

.cc-person--text-only .cc-person__name { font-size: 17px; margin-top: 0; }

.cc-person__role {
	font-size: 14px;
	color: var(--cc-b-muted);
	margin-top: 3px;
	line-height: 1.45;
}

/* Press item -------------------------------------------------------------- */

.cc-press {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	background: #fff;
	padding: 22px 26px;
	text-decoration: none;
}

a.cc-press:hover { background: var(--cc-b-tint); text-decoration: none; }

.cc-press__body { display: block; }

.cc-press__kicker {
	display: block;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--cc-b-teal);
}

.cc-press__title {
	display: block;
	font-size: 17px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin-top: 6px;
}

.cc-press__meta {
	display: block;
	font-size: 14px;
	color: var(--cc-b-muted);
	margin-top: 4px;
}

.cc-press__out { color: var(--cc-b-teal-dark); flex-shrink: 0; font-size: 16px; }

/* Video / podcast card ---------------------------------------------------- */

.cc-media-card {
	display: block;
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	overflow: hidden;
	text-decoration: none;
	height: 100%;
}

a.cc-media-card:hover { text-decoration: none; }

.cc-media-card__media { height: 170px; }
.cc-media-card__media.cc-media--empty { border: none; border-bottom: 1px dashed var(--wp--preset--color--line-strong, #cdcad9); }

.cc-media-card__body { padding: 22px 24px 24px; }

.cc-media-card__kicker {
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--cc-b-teal);
}

.cc-media-card__title {
	font-size: 18px;
	font-weight: 800;
	color: var(--cc-b-navy);
	margin: 10px 0 6px;
}

.cc-media-card__meta {
	font-size: 14px;
	color: var(--cc-b-muted);
	margin: 0;
}

/* Partner logo ------------------------------------------------------------ */

.cc-logo {
	background: #fff;
	border: 1px solid var(--cc-b-line);
	border-radius: 12px;
	min-height: 88px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	text-decoration: none;
}

a.cc-logo:hover { border-color: var(--cc-b-teal); text-decoration: none; }

.cc-logo__img { max-width: 100%; max-height: 56px; width: auto; height: auto; display: block; }

.cc-logo__name {
	font-size: 14px;
	font-weight: 700;
	color: var(--cc-b-faint);
	text-align: center;
	line-height: 1.4;
}

/* Brand asset / download card --------------------------------------------- */

.cc-download {
	border: 1px solid var(--cc-b-line);
	border-radius: 16px;
	overflow: hidden;
	background: #fff;
	height: 100%;
	display: flex;
	flex-direction: column;
}

.cc-download__preview {
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	padding: 32px;
}

.cc-download__preview--light { background: var(--cc-b-tint); }
.cc-download__preview--dark { background: var(--cc-b-navy); }
.cc-download__preview--swatches { background: var(--cc-b-tint); }

.cc-download__preview img { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; }
.cc-download__preview--dark img { filter: brightness(0) invert(1); }

.cc-download__empty { color: var(--cc-b-faint); font-size: 13px; font-weight: 700; }
.cc-download__preview--dark .cc-download__empty { color: rgba(255, 255, 255, 0.6); }

.cc-swatch { width: 52px; height: 52px; border-radius: 10px; display: block; }
.cc-swatch--teal { background: var(--cc-b-teal); }
.cc-swatch--navy { background: var(--cc-b-navy); }
.cc-swatch--gold { background: var(--cc-b-gold); }

.cc-download__row {
	padding: 20px 22px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	border-top: 1px solid var(--cc-b-line);
	margin-top: auto;
}

.cc-download__title { display: block; font-size: 16px; font-weight: 800; color: var(--cc-b-navy); }
.cc-download__meta { display: block; font-size: 14px; color: var(--cc-b-muted); margin-top: 2px; }

.cc-download__action {
	font-size: 15px;
	font-weight: 700;
	color: var(--cc-b-teal-dark);
	text-decoration: none;
	flex-shrink: 0;
}

.cc-download__action:hover { text-decoration: underline; }
.cc-download__action--pending { color: var(--cc-b-faint); }

/* Progress bar ------------------------------------------------------------ */

.cc-progress + .cc-progress { margin-top: 18px; }

.cc-progress__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
}

.cc-progress__label { font-size: 15px; font-weight: 800; color: var(--cc-b-navy); }
.cc-progress__value { font-size: 15px; font-weight: 800; color: var(--cc-b-muted); }

.cc-progress__track {
	height: 8px;
	border-radius: 999px;
	background: var(--cc-b-track);
	margin-top: 8px;
	overflow: hidden;
}

.cc-progress__fill { height: 100%; border-radius: 999px; }
.cc-progress__fill--teal { background: var(--cc-b-teal); }
.cc-progress__fill--navy { background: var(--cc-b-navy); }
.cc-progress__fill--gold { background: var(--cc-b-gold); }

/* Badge ------------------------------------------------------------------- */

.cc-badge {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	border-radius: 12px;
	padding: 14px 20px;
	text-decoration: none;
}

.cc-badge--dark {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.14);
}

.cc-badge--light {
	background: #fff;
	border: 1px solid var(--cc-b-line);
}

a.cc-badge:hover { text-decoration: none; }

.cc-badge__icon {
	width: 34px;
	height: 34px;
	border-radius: 7px;
	background: var(--cc-b-teal);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.cc-badge__icon .cc-icon { stroke-width: 2.2; }

.cc-badge__text { display: block; }

.cc-badge__eyebrow {
	display: block;
	font-size: 11px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-weight: 800;
	color: rgba(255, 255, 255, 0.5);
}

.cc-badge--light .cc-badge__eyebrow { color: var(--cc-b-faint); }

.cc-badge__title {
	display: block;
	font-size: 15px;
	font-weight: 800;
	color: #fff;
	margin-top: 2px;
}

.cc-badge--light .cc-badge__title { color: var(--cc-b-navy); }

/* Hover lift, shared with the theme --------------------------------------- */

a.cc-lift, .cc-lift {
	transition: transform 200ms var(--cc-b-ease), box-shadow 200ms var(--cc-b-ease);
}

a.cc-lift:hover, .cc-lift:hover {
	transform: translateY(-3px);
	box-shadow: 0 20px 44px rgba(38, 34, 98, 0.16);
}

/* Small screens ----------------------------------------------------------- */

@media (max-width: 781px) {
	.cc-stat--card, .cc-stat--dark, .cc-stat--glass { padding: 24px; }
	.cc-stat--tint { padding: 28px; }
	.cc-path-card, .cc-icon-card--bordered, .cc-icon-card--dark { padding: 24px; }
	.cc-stat--size-large .cc-stat__value { font-size: 52px; }
	.cc-stat--size-default .cc-stat__value { font-size: 44px; }
	.cc-press { padding: 18px 20px; }
}

/* Photo slot -------------------------------------------------------------- */

.cc-photo {
	margin: 0;
	overflow: hidden;
	display: block;
}

.cc-photo__media { width: 100%; display: block; }
.cc-photo__media.cc-media--empty { min-height: 180px; }

/* Section heading with a leading icon -------------------------------------- */

.cc-section-icon { color: var(--cc-b-teal); display: inline-flex; }

/* The dashed "tracks change" note on the career tracks grid ---------------- */

.cc-track-note {
	background: var(--cc-b-tint);
	border: 1px dashed var(--wp--preset--color--line-strong, #cdcad9);
	border-radius: 16px;
	padding: 28px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
	grid-column: span 2;
}

@media (max-width: 900px) {
	.cc-track-note { grid-column: auto; }
}

/* A hairline rule above a row, used by the Cycle of Community strip. */
.cc-rule-top {
	border-top: 1px solid var(--cc-b-line);
	padding-top: 30px;
}


/* Jump-link row (media library nav) --------------------------------------- */

.cc-icon-card--jump {
	flex-direction: row;
	align-items: center;
	gap: 14px;
	background: var(--cc-b-tint);
	border: 1px solid var(--cc-b-line);
	border-radius: 12px;
	padding: 20px 22px;
	height: auto;
}

.cc-icon-card--jump:hover { border-color: var(--cc-b-teal); }
.cc-icon-card--jump .cc-icon-card__icon .cc-icon { width: 22px; height: 22px; }
.cc-icon-card--jump .cc-icon-card__title {
	font-size: 16px;
	font-weight: 800;
	margin: 0;
}
.cc-icon-card--jump .cc-icon-card__text,
.cc-icon-card--jump .cc-icon-card__link { display: none; }

/* Badge: no-container variant used above the venture headings ------------- */

.cc-badge--plain {
	background: none;
	border: none;
	padding: 0;
	gap: 11px;
}

.cc-badge--plain .cc-badge__icon { width: 36px; height: 36px; border-radius: 8px; }
.cc-badge--plain .cc-badge__icon .cc-icon { width: 19px; height: 19px; stroke-width: 2.2; }

.cc-badge--plain .cc-badge__title {
	font-size: 12px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 800;
	color: var(--cc-b-teal);
	margin-top: 0;
}

.cc-badge--icon-gold .cc-badge__icon { background: var(--cc-b-gold); color: var(--cc-b-navy); }
.cc-badge--icon-gold.cc-badge--plain .cc-badge__title { color: var(--cc-b-gold-deep); }

/* Tiles laid out as a single row (annual report list) --------------------- */

.cc-tile-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 13px 16px;
	border-radius: 8px;
	border: none;
	background: rgba(255, 255, 255, 0.08);
}

a.cc-tile-row:hover { background: rgba(255, 255, 255, 0.16); }

.cc-tile-row .cc-tile__title { font-size: 15px; font-weight: 700; color: #fff; }
.cc-tile-row .cc-tile__text { font-size: 15px; font-weight: 700; margin-top: 0; color: #fff; }

/* Press rows sit inside a hairline stack, which already supplies padding. */
.cc-press-stack > * { padding: 0; }

/* Stat laid out on a single baseline row (e.g. "81% of expenses are people"). */
.cc-stat--inline {
	flex-direction: row;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 14px;
}

.cc-stat--inline .cc-stat__value,
.cc-stat--inline .cc-stat__note,
.cc-stat--inline .cc-stat__label { margin-top: 0; }

.cc-stat--inline .cc-stat__note {
	font-size: 18px;
	font-weight: 800;
	line-height: 1.4;
	flex: 1 1 220px;
}

.cc-stat--inline.cc-stat--glass .cc-stat__note,
.cc-stat--inline.cc-stat--dark .cc-stat__note { color: #fff; }

.cc-stat--inline .cc-stat__eyebrow { flex: 1 1 100%; }

/* Badge title rendered as a heading rather than a small label. */
.cc-badge--title-heading .cc-badge__title {
	font-size: 24px;
	letter-spacing: -0.01em;
	line-height: 1.25;
	text-transform: none;
}

.cc-badge--plain.cc-badge--title-heading .cc-badge__icon { width: 40px; height: 40px; border-radius: 9px; }
.cc-badge--plain.cc-badge--title-heading .cc-badge__icon .cc-icon { width: 21px; height: 21px; }

/* Column layouts default to top alignment, but these cards are designed to
 * fill their row the way the grid they were drawn in does. */
.wp-block-column:has(> .cc-stat),
.wp-block-column:has(> .cc-path-card),
.wp-block-column:has(> .cc-icon-card),
.wp-block-column:has(> .cc-track),
.wp-block-column:has(> .cc-tile),
.wp-block-column:has(> .cc-media-card),
.wp-block-column:has(> .cc-download),
.wp-block-column:has(> .cc-person),
.wp-block-column:has(> .cc-press) {
	align-self: stretch;
}
