/*
Theme Name: CAC Collegiate
Theme URI: https://customacademiccoaching.com
Author: Custom Academic Coaching
Description: Block theme for Custom Academic Coaching, built from design option C "Collegiate": a navy shell around lemon-cream fields, with Crimson Pro headlines over Archivo body text. Includes a flip-card block for coach bios and patterns for every section on the site.
Version: 0.1.0
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cac-collegiate
*/

/* ==========================================================================
   Colors and fonts come from theme.json (Appearance > Editor > Styles), so
   changes made there flow through. The tints below are the fixed extras
   from the Collegiate design that don't belong in the editor palette.
   ========================================================================== */

:root {
	--cream: var(--wp--preset--color--cream);
	--cream-deep: var(--wp--preset--color--cream-deep);
	--paper: var(--wp--preset--color--paper);
	--navy: var(--wp--preset--color--navy);
	--navy-deep: var(--wp--preset--color--navy-deep);
	--blue: var(--wp--preset--color--blue);
	--ink: var(--wp--preset--color--ink);
	--muted: var(--wp--preset--color--muted);

	--rule: #002D5D2B;
	--card-rule: #002D5D1F;
	--band-ink: #2A3441;
	--ph-stripe: #002D5D2B;
	--ph-rule: #002D5D38;
	--ph-ink: #46525F;
	--invert-ink: #DDE5EF;
	--invert-eyebrow: #93B8DE;
	--invert-muted: #AFC0D3;
	--footer-ink: #C2CEDC;

	--font-display: var(--wp--preset--font-family--display);
	--font-body: var(--wp--preset--font-family--body);
	--quote-size: clamp(1.25rem, 1.9vw, 1.55rem);
	--section-pad: clamp(3.5rem, 8vw, 7rem);
}

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

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-wrap: pretty; }
h1, h2, h3, h4 { text-wrap: balance; }
a { text-underline-offset: 0.18em; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
[id] { scroll-margin-top: 96px; }

/* Header, main, footer and page sections butt against each other. */
body .wp-site-blocks > * { margin-block: 0; }
.wp-block-post-content > section.wp-block-group,
.wp-block-post-content > div.wp-block-group.alignfull { margin-block: 0; }

/* --- Type helpers (Advanced > Additional CSS class) ---------------------- */

.eyebrow {
	font-family: var(--font-body);
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--blue);
}
.lede { font-size: var(--wp--preset--font-size--lede); line-height: 1.5; color: var(--ink); }
.small { font-size: 0.875rem; }
.muted { color: var(--muted); }
.fine { font-size: 0.8125rem; line-height: 1.5; color: var(--muted); }
.measure { max-width: 34em; }
.lede.is-spaced { margin-block-start: 1.25rem; }
/* The design keeps a lede-sized gap after a lede. */
p.wp-block-paragraph.lede + * { margin-block-start: var(--wp--preset--font-size--lede); }

/* --- Sections ------------------------------------------------------------ */
/* Every page section is a full-width Group (tag: section) holding one inner
   Group that carries the content, the equivalent of the design's .wrap. */

section.wp-block-group { padding-block: var(--section-pad); }
section.wp-block-group + section.wp-block-group { padding-top: 0; }
/* Restore breathing room where the background changes between sections. */
section.hero + section.wp-block-group { padding-top: clamp(2.5rem, 5vw, 4rem); }
.band + section.wp-block-group,
section.band + section.wp-block-group,
section.band--invert + section.wp-block-group { padding-top: clamp(3rem, 6vw, 5rem); }
section.wp-block-group + section.band,
section.wp-block-group + section.band--invert { padding-top: clamp(2.75rem, 5vw, 4.5rem); }
.section-pad { padding-top: var(--section-pad) !important; }
.pt-0 { padding-top: 0 !important; }

.band { background: var(--cream); color: var(--band-ink); padding-block: clamp(3rem, 6vw, 5rem); }
section.wp-block-group.band { padding-bottom: var(--section-pad); }
section.wp-block-group.band:first-child { padding-top: var(--section-pad); }
.band h1, .band h2, .band h3 { color: var(--navy); }
.band .eyebrow { color: var(--blue); }
.band a:not(.wp-block-button__link) { color: var(--navy); }

.band--invert { background: var(--navy); color: var(--invert-ink); }
.band--invert h1, .band--invert h2, .band--invert h3 { color: var(--cream); }
.band--invert .eyebrow { color: var(--invert-eyebrow); }
.band--invert .muted, .band--invert .fine { color: var(--invert-muted); }
.band--invert a:not(.wp-block-button__link) { color: var(--cream); }

.wp-block-group.section-head + * { margin-block-start: clamp(2rem, 4vw, 3rem); }
.wp-block-group.section-head > .eyebrow { margin-block-start: 0.75rem; }
.wp-block-group.section-head > p:not(.eyebrow) { margin-block-start: 0.75rem; color: var(--muted); max-width: 46em; }
.band .wp-block-group.section-head > .eyebrow { margin-block-start: 0.75rem; }
.wp-block-group.section-head > p:not(.eyebrow) { color: var(--band-ink); }

/* --- Grids --------------------------------------------------------------- */

.wp-block-group.grid { display: grid; gap: clamp(1.25rem, 2.5vw, 2rem); }
.wp-block-group.grid > * { margin: 0; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wp-block-group.grid--split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(2rem, 5vw, 4rem); }
.wp-block-group.grid.is-spaced { margin-block-start: clamp(2.5rem, 5vw, 3.5rem); }

.wp-block-group.stack { display: grid; gap: 1rem; justify-items: start; align-content: start; }
.wp-block-group.stack > * { margin: 0; }

.wp-block-group.row { margin-block-start: 2.5rem; }

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

.wp-site-blocks > header.wp-block-template-part {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 50;
}
@media (max-width: 600px) {
	.wp-site-blocks > header.wp-block-template-part { top: 0; }
}

.site-header {
	background: var(--navy);
	border-bottom: 2px solid var(--navy);
	box-shadow: 0 2px 0 rgba(26, 103, 174, 0.55), 0 10px 20px -8px rgba(26, 103, 174, 0.40);
}
.wp-block-group.site-header__inner { min-height: 78px; gap: 2rem; }

.wordmark {
	margin: 0 auto 0 0 !important;
	max-width: 12ch;
	font-family: var(--font-display);
	font-weight: 600;
	font-size: 1.0625rem;
	line-height: 1.15;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}
.wordmark a, .wordmark a:hover { color: var(--cream); text-decoration: none; }

.site-header .wp-block-navigation { gap: clamp(1rem, 2.2vw, 2rem); }
.site-header .wp-block-navigation .wp-block-navigation-item__content {
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--cream);
	padding: 0.35rem 0;
	border-bottom: 2px solid transparent;
}
.site-header .wp-block-navigation .wp-block-navigation-item__content:hover { text-decoration: none; border-bottom-color: var(--cream); }
.site-header .wp-block-navigation .wp-block-navigation-item__content[aria-current="page"] { border-bottom-color: var(--cream); }
.site-header .wp-block-navigation__responsive-container.is-menu-open {
	background: var(--navy); color: var(--cream);
	padding: 1.25rem clamp(1.25rem, 4vw, 2.5rem) 2rem;
}
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { align-items: flex-start; }
.site-header .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item .wp-block-navigation-item__content {
	font-family: var(--font-display); font-size: 1.6rem; font-weight: 600;
}
.site-header .wp-block-navigation__responsive-container-open,
.site-header .wp-block-navigation__responsive-container-close { color: var(--cream); }

/* The design drops the inline menu below 900px; WordPress switches to the
   menu button at 600px. Extend the menu button up to 900px. */
@media (min-width: 600px) and (max-width: 899px) {
	.site-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.site-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
@media (max-width: 620px) {
	.wp-block-group.site-header__inner { gap: 1rem; min-height: 68px; }
	.site-header .btn--sm .wp-block-button__link { padding: 0.5rem 0.8rem; font-size: 0.8125rem; }
}

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

.wp-block-button__link { transition: background-color 0.15s, color 0.15s, border-color 0.15s; }
.wp-block-button__link:hover { text-decoration: none; }

.wp-block-button.is-style-ghost .wp-block-button__link { background: transparent; color: var(--navy); border-color: var(--navy); }
.wp-block-button.is-style-ghost .wp-block-button__link:hover { background: var(--navy); color: var(--cream); border-color: var(--navy); }

/* "On navy": for feature cards and navy bands. */
.wp-block-button.is-style-on-navy .wp-block-button__link { background: var(--cream); color: var(--navy); border-color: var(--cream); }
.wp-block-button.is-style-on-navy .wp-block-button__link:hover { background: transparent; color: var(--cream); border-color: var(--cream); }
/* Same button on a cream band. */
.band .wp-block-button.is-style-on-navy .wp-block-button__link { background: var(--navy); color: var(--cream); border-color: var(--navy); }
.band .wp-block-button.is-style-on-navy .wp-block-button__link:hover { background: transparent; color: var(--navy); border-color: var(--navy); }
.card--feature .wp-block-button.is-style-on-navy .wp-block-button__link,
.band--invert .wp-block-button.is-style-on-navy .wp-block-button__link { background: var(--cream); color: var(--navy); border-color: var(--cream); }
.card--feature .wp-block-button.is-style-on-navy .wp-block-button__link:hover,
.band--invert .wp-block-button.is-style-on-navy .wp-block-button__link:hover { background: transparent; color: var(--cream); border-color: var(--cream); }

.wp-block-button.btn--sm .wp-block-button__link { padding: 0.6rem 1.1rem; font-size: 0.875rem; letter-spacing: 0.05em; }

.link-arrow { font-weight: 600; font-size: 0.9375rem; }
.link-arrow a { color: var(--navy); }
.link-arrow a::after { content: " \2192"; }

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

section.wp-block-group.hero {
	background: var(--cream);
	border-bottom: 1px solid var(--rule);
	padding-block: clamp(3rem, 7vw, 6rem) clamp(3rem, 6vw, 5rem);
}
.hero h1 { max-width: 20ch; }
.hero .lede { margin-block-start: 1.5rem; max-width: 30em; }
.hero .lede.is-wide { max-width: 34em; }
.hero .wp-block-group.row { margin-block-start: 2.25rem; }
.hero .hero__narrow { max-width: 780px; }

/* Hero with photo: the Image block is stretched behind the copy and faded
   out toward the left; a cream veil keeps the headline legible. */
section.wp-block-group.hero--photo { position: relative; overflow: hidden; isolation: isolate; }
.hero--photo::before {
	content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: linear-gradient(to right,
		rgba(255, 252, 209, 0.90) 0%, rgba(255, 252, 209, 0.90) 34%, rgba(255, 252, 209, 0.55) 58%, transparent 82%);
}
.hero--photo > .wp-block-image.hero__media {
	position: absolute; inset: 0; z-index: 0;
	max-width: none !important; margin: 0 !important;
	-webkit-mask-image: linear-gradient(to right, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.10) 26%, rgba(0,0,0,0.55) 52%, rgba(0,0,0,1) 76%);
	mask-image: linear-gradient(to right, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.10) 26%, rgba(0,0,0,0.55) 52%, rgba(0,0,0,1) 76%);
}
.hero--photo > .hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 32%; }
.hero--photo > .wp-block-group { position: relative; z-index: 2; margin-block-start: 0; }
.wp-block-group.hero__copy {
	min-height: clamp(360px, 42vw, 520px);
	display: flex; flex-direction: column; justify-content: center;
}
/* Copy sits in the left column of the design's two-column split. */
.wp-block-group.hero__copy > * { max-width: calc((100% - clamp(2rem, 5vw, 4rem)) / 2); }

/* --- Image placeholders -------------------------------------------------- */

.wp-block-group.ph {
	position: relative;
	background-color: var(--cream);
	background-image: repeating-linear-gradient(135deg, transparent 0 9px, var(--ph-stripe) 9px 10px);
	border: 1px solid var(--ph-rule);
	aspect-ratio: 4 / 3;
	display: grid; place-items: center;
	overflow: hidden;
}
.wp-block-group.ph > * { margin: 0; }
.ph--wide { aspect-ratio: 16 / 7 !important; }
.ph--tall { aspect-ratio: 3 / 4 !important; }
.ph__label {
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ph-ink);
	background: var(--paper);
	border: 1px solid var(--ph-rule);
	padding: 0.4rem 0.7rem;
	text-align: center;
	max-width: 80%;
}

.wp-block-image.portrait img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	object-position: center top;
	border: 1px solid var(--ph-rule);
}

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

.wp-block-group.stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-block: 1px solid var(--rule); }
.wp-block-group.stats > *, .wp-block-group.stat > * { margin: 0; }
.stat { padding: clamp(1.75rem, 3vw, 2.5rem) clamp(1.25rem, 3vw, 2.5rem); border-left: 1px solid var(--rule); }
.stat:first-child { border-left: 0; padding-left: 0; }
.stat__figure {
	font-family: var(--font-display);
	font-weight: 600;
	font-size: clamp(2.5rem, 5vw, 3.6rem);
	line-height: 1;
	letter-spacing: -0.005em;
	color: var(--navy);
	margin-bottom: 0.6rem !important;
}
.stat__label { font-size: 0.9375rem; color: var(--muted); max-width: 24em; }

/* --- Cards --------------------------------------------------------------- */

.card {
	background: var(--cream);
	border: 1px solid var(--card-rule);
	padding: clamp(1.5rem, 2.5vw, 2rem);
}
.wp-block-group.card { display: flex; flex-direction: column; gap: 0.85rem; }
.wp-block-group.card > * { margin: 0; }
.wp-block-group.card > p:not(:last-child) { margin-bottom: 1em; }
.wp-block-group.card > h3 + p { margin-top: -0.25rem; }
.wp-block-group.card > .link-arrow,
.wp-block-group.card > .wp-block-buttons { margin-top: auto; align-self: start; }
.card__kicker {
	font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em;
	text-transform: uppercase; color: var(--blue);
}

/* Whole card is clickable when it carries .card--link. */
.card--link { position: relative; }
.card--link .link-arrow a::before { content: ""; position: absolute; inset: 0; }
.card--link:hover h3 { color: var(--blue); }

/* Inverted feature card: the one call to action per section. */
.card.card--feature { background: var(--navy); border-color: var(--navy); color: var(--invert-ink); }
.card--feature h2, .card--feature h3, .card--feature h4 { color: var(--cream); }
.card--feature .eyebrow { color: var(--invert-eyebrow); }
.card--feature .muted, .card--feature .fine { color: var(--invert-muted); }
.card--feature a:not(.wp-block-button__link) { color: var(--cream); }
.card--feature .spec li::before { background: var(--invert-eyebrow); }
.card--feature .tick li::before { color: var(--invert-eyebrow); }

.wp-block-group.cta-feature { padding: clamp(2rem, 5vw, 3.5rem); gap: 1.25rem; }
.cta-feature h2 { max-width: 30ch; }
.wp-block-group.cta-feature > .wp-block-buttons { margin-top: 0.75rem; }
.wp-block-group.is-spaced-top { margin-block-start: clamp(2rem, 4vw, 3rem); }

/* Package card: name / ideal-for / list / price */
.pkg__price {
	font-family: var(--font-display);
	font-weight: 600;
	font-size: 1.75rem;
	letter-spacing: -0.005em;
	color: var(--navy);
}
.wp-block-group.card > .pkg__price { margin-top: auto; }

.wp-block-list.spec, .wp-block-list.tick { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.wp-block-list.tick { gap: 0.6rem; }
.spec li, .tick li { position: relative; padding-left: 1.1rem; font-size: 0.9375rem; }
.tick li { padding-left: 1.4rem; }
.spec li::before {
	content: ""; position: absolute; left: 0; top: 0.6em;
	width: 6px; height: 6px; border-radius: 50%; background: var(--blue);
}
.tick li::before { content: "\2713"; position: absolute; left: 0; top: 0; color: var(--blue); font-weight: 700; }
.wp-block-list.spec--2col { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(1.5rem, 4vw, 3rem); }

/* --- Quotes -------------------------------------------------------------- */

blockquote.wp-block-quote.quote { display: grid; gap: 1.25rem; margin: 1em 40px; padding: 0; border: 0; }
.wp-block-quote.quote > * { margin: 0; }
.wp-block-quote.quote p {
	font-family: var(--font-display);
	font-size: var(--quote-size);
	font-style: italic;
	line-height: 1.4;
	letter-spacing: -0.005em;
	color: var(--navy);
}
.wp-block-quote.quote cite { display: block; font-style: normal; font-size: 0.875rem; color: var(--muted); }
.wp-block-quote.quote cite strong { display: block; color: var(--ink); font-weight: 600; }
.wp-block-quote.quote--lead p { font-size: clamp(1.5rem, 3.2vw, 2.35rem); }
.wp-block-group.quote-measure { max-width: calc(44em + 80px); }

.band .wp-block-quote.quote p { color: var(--navy); }
.band .wp-block-quote.quote cite { color: var(--blue); }
.band .wp-block-quote.quote cite strong { color: var(--navy); }
.band--invert .wp-block-quote.quote p { color: var(--cream); }
.band--invert .wp-block-quote.quote cite { color: var(--invert-eyebrow); }
.band--invert .wp-block-quote.quote cite strong { color: var(--cream); }

blockquote.wp-block-quote.pull { border-left: 3px solid var(--navy); padding-left: clamp(1.25rem, 3vw, 2rem); }

/* --- Promise strip ------------------------------------------------------- */

.wp-block-group.promises {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: clamp(0.75rem, 2vw, 1.5rem);
	font-family: var(--font-display);
	font-weight: 600;
	font-size: clamp(1.125rem, 2.2vw, 1.6rem);
	letter-spacing: -0.005em;
	color: var(--navy);
}
.wp-block-group.promises > * { margin: 0; }
.promises > p:not(:last-child)::after {
	content: "\2735";
	margin-left: clamp(0.75rem, 2vw, 1.5rem);
	color: var(--blue);
	font-size: 0.85em;
}

/* --- Accordion (Details block with class "acc") -------------------------- */

.wp-block-details.acc { border-top: 1px solid var(--rule); }
.wp-block-details.acc:last-of-type { border-bottom: 1px solid var(--rule); }
.wp-block-details.acc > summary {
	cursor: pointer; list-style: none;
	padding: 1.1rem 0;
	display: flex; align-items: baseline; gap: 1rem;
	font-family: var(--font-display);
	font-weight: 600;
	font-size: 1.1875rem;
	letter-spacing: -0.005em;
	color: var(--navy);
}
.wp-block-details.acc > summary::-webkit-details-marker { display: none; }
.wp-block-details.acc > summary::after {
	content: "+"; margin-left: auto;
	font-family: var(--font-body); font-weight: 400; color: var(--muted);
	font-size: 1.35rem; line-height: 1;
}
.wp-block-details.acc[open] > summary::after { content: "\2013"; }
.wp-block-details.acc > summary:hover { color: var(--blue); }
.wp-block-details.acc > summary + * { margin-block-start: 0; }
.wp-block-details.acc[open] { padding-bottom: 1.75rem; }
.wp-block-details.acc.is-spaced { margin-block-start: clamp(2rem, 4vw, 3rem); }
.wp-block-details.acc.is-snug { margin-block-start: 1.5rem; }

.wp-block-list.collist {
	list-style: none; margin: 0; padding: 0;
	columns: 3; column-gap: 2rem;
	font-size: 0.9375rem;
}
.collist li { break-inside: avoid; padding: 0.15rem 0; }

/* --- Panel (white box on a tinted field) -------------------------------- */

.wp-block-group.panel {
	background: var(--paper);
	border: 1px solid var(--rule);
	padding: clamp(1.5rem, 3.5vw, 2.5rem);
}
.wp-block-group.panel > * { margin: 0; }
.wp-block-group.panel + * { margin-block-start: clamp(2rem, 4vw, 2.5rem); }
.panel__title { padding-bottom: 0.85rem; border-bottom: 1px solid var(--rule); }
.wp-block-group.panel > .panel__intro { margin: 1.25rem 0; max-width: 46em; }
.panel > .stats { border-block: 0 !important; }
.panel > .stats .stat:first-child { padding-left: 0; }

/* --- Flip cards (Flip card block) ---------------------------------------- */

.wp-block-group.flipgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: clamp(1.25rem, 3vw, 2rem); }
.wp-block-group.flipgrid > * { margin: 0; }

.flip { display: block; width: 100%; perspective: 1400px; background: none; border: 0; padding: 0; text-align: left; font: inherit; color: inherit; cursor: pointer; }
.flip__inner {
	display: block;
	position: relative; width: 100%; aspect-ratio: 3 / 4; min-height: 440px;
	transition: transform 1100ms cubic-bezier(.4, .05, .2, 1);
	transform-style: preserve-3d;
}
.flip[aria-pressed="true"] .flip__inner { transform: rotateY(180deg); }
.flip__face {
	display: block;
	position: absolute; inset: 0;
	-webkit-backface-visibility: hidden; backface-visibility: hidden;
	overflow: hidden;
	border: 1px solid var(--rule);
}
.flip__front {
	background-image: var(--photo, none);
	background-size: cover;
	background-position: var(--photo-pos, center top);
	background-color: var(--cream);
}
.flip__front::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(to top, rgba(0,45,93,0.94) 0%, rgba(0,45,93,0.88) 12%, rgba(0,45,93,0) 20%);
}
.flip__label { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; padding: clamp(1rem, 2.5vw, 1.4rem); }
.flip__name { display: block; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.05rem, 2.2vw, 1.25rem); line-height: 1.2; color: var(--cream); }
.flip__label .flip__role { display: block; margin-top: 0.3rem; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--invert-eyebrow); }
.flip__hint { position: absolute; top: 0.9rem; right: 1rem; z-index: 1; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--cream); opacity: 0; transition: opacity 200ms; text-shadow: 0 1px 6px rgba(0,45,93,0.8); }
.flip:hover .flip__hint, .flip:focus-visible .flip__hint { opacity: 0.9; }
.flip__back {
	transform: rotateY(180deg);
	background: var(--navy); color: var(--invert-ink);
	padding: clamp(1.25rem, 3vw, 1.75rem);
	display: flex; flex-direction: column; gap: 0.7rem; justify-content: center;
}
.flip__back .flip__name { font-size: 1.1rem; }
.flip__back .flip__role { display: block; font-size: 0.78rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--invert-eyebrow); margin-top: -0.5rem; }
.flip__text { display: block; margin: 0; font-size: 0.9rem; line-height: 1.5; }
.flip__text--small { font-size: 0.875rem; opacity: 0.85; }
@media (prefers-reduced-motion: reduce) { .flip__inner { transition: none; } }

/* Editor: fields sit on the card itself; a toolbar button flips it. */
.editor-styles-wrapper .flip [contenteditable] { cursor: text; outline-offset: 2px; }
.editor-styles-wrapper .flip__front:not([style*="--photo"]) .flip__label { top: 0; display: flex; flex-direction: column; justify-content: flex-end; }

/* --- Footnotes ----------------------------------------------------------- */

section.wp-block-group.footnotes { padding-top: 0; padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.wp-block-group.note-list { border-top: 1px solid var(--rule); padding-top: 1.25rem; max-width: 52em; font-size: 0.8125rem; }
.wp-block-group.narrow-center { max-width: 700px; margin-inline: auto; text-align: center; }
.wp-block-group.narrow-center .lede { margin-block-start: 1rem; }
.wp-block-group.narrow-center > .wp-block-buttons { margin-block-start: 2rem; }

/* --- Plain pages (Page template) ----------------------------------------- */

.page-body { padding-block: clamp(2.5rem, 6vw, 5rem); }

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

.site-footer { background: var(--navy-deep); color: var(--footer-ink); padding-block: 2rem; }
.site-footer a { color: var(--footer-ink); }
.site-footer a:hover { color: var(--cream); }
.wp-block-group.legal { font-size: 0.8125rem; gap: 1rem 2rem; }
.wp-block-group.legal > * { margin: 0; }

/* --- Responsive ---------------------------------------------------------- */

@media (max-width: 900px) {
	.grid--3, .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.wp-block-group.grid--split { grid-template-columns: 1fr; }
	.wp-block-list.collist { columns: 2; }
	.wp-block-group.stats { grid-template-columns: 1fr; }
	.stat { border-left: 0; border-top: 1px solid var(--rule); padding-left: 0; }
	.stat:first-child { border-top: 0; }
	.wp-block-group.hero__copy > * { max-width: none; }
}
@media (max-width: 760px) {
	.wp-block-group.hero__copy { min-height: 0; }
	.hero--photo > .hero__media img { object-position: 60% 25%; }
	.hero--photo > .wp-block-image.hero__media {
		-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.12) 55%, rgba(0,0,0,0.85) 100%);
		mask-image: linear-gradient(to bottom, rgba(0,0,0,0.12) 0%, rgba(0,0,0,0.12) 55%, rgba(0,0,0,0.85) 100%);
	}
	.hero--photo::before { background: linear-gradient(to bottom, rgba(255, 252, 209, 0.90) 0%, rgba(255, 252, 209, 0.90) 60%, rgba(255, 252, 209, 0.55) 100%); }
}
@media (max-width: 620px) {
	.grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
	.wp-block-list.collist { columns: 1; }
	.wp-block-list.spec--2col { grid-template-columns: 1fr; }
}
@media print {
	.wp-site-blocks > header.wp-block-template-part { display: none; }
}