/*
 * Research Fundamentals reusable component system.
 *
 * Important architectural rule: no component depends on a single page-root
 * class. Copying the complete outer Group for a hero or section preserves the
 * design on any Blocksy page because every component carries its own tokens.
 */

:where(.rf-design-system, .rf-component, .rf-section, .rf-form-card) {
	--rf-ink: var(--theme-palette-color-4, #18203a);
	--rf-ink-soft: var(--theme-palette-color-3, #243154);
	--rf-accent: var(--theme-palette-color-1, #ff6a3d);
	--rf-accent-dark: #dc4f27;
	--rf-paper: var(--theme-palette-color-8, #f6f3ec);
	--rf-paper-soft: #ece8df;
	--rf-white: #fffef9;
	--rf-yellow: #f5e86b;
	--rf-blue: #b8d8ff;
	--rf-muted: #686b74;
	--rf-line: color-mix(in srgb, currentColor 18%, transparent);
	--rf-content-width: var(--container-max-width, 1290px);
	--rf-gutter: clamp(1.25rem, 4vw, 3rem);
	font-family: "Raleway", sans-serif;
	line-height: 1.68;
	letter-spacing: 0;
}

.ct-container-narrow :where(.rf-design-system, .rf-component, .rf-section) {
	--rf-content-width: var(--narrow-container-max-width, 750px);
}

:where(.rf-design-system, .rf-component, .rf-section, .rf-form-card)
	:where(h1, h2, h3, h4, h5, h6, .wp-block-button__link, label, legend) {
	font-family: "Montserrat", sans-serif;
}

:where(.rf-design-system, .rf-component, .rf-section) :where(h1, h2, h3) {
	color: inherit;
	text-wrap: balance;
	word-break: normal;
	overflow-wrap: normal;
	hyphens: none;
}

:where(.rf-design-system, .rf-component, .rf-section) :where(p, li) {
	text-wrap: pretty;
}

/*
 * Seamless section stack.
 *
 * WordPress flow/constrained layouts implement blockGap as margin-block-start
 * on child blocks, not only as the CSS gap property. Reset both mechanisms so
 * separately inserted full-width components touch cleanly.
 */
.rf-waitlist-page,
.is-style-rf-seamless-stack {
	--wp--style--block-gap: 0px !important;
	gap: 0 !important;
	row-gap: 0 !important;
	column-gap: 0 !important;
	margin-block: 0 !important;
	padding-block: 0 !important;
	overflow: clip;
}

.rf-waitlist-page > *,
.is-style-rf-seamless-stack > *,
.rf-waitlist-page > * + *,
.is-style-rf-seamless-stack > * + * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

body.rf-components-active {
	--theme-content-vertical-spacing: 0px;
	overflow-x: clip;
}

/*
 * Full-bleed page stack.
 *
 * When separately inserted sections are wrapped in a Group, Gutenberg treats
 * their alignfull setting relative to that Group. If the parent Group remains
 * inside Blocksy's normal content container, section backgrounds stop at the
 * container edge. The page-root stack therefore breaks out to the viewport,
 * while each component's .rf-component__inner remains container constrained.
 */
.rf-waitlist-page,
.is-style-rf-seamless-stack {
	box-sizing: border-box;
	width: 100vw;
	max-width: none !important;
	margin-left: calc(50% - 50vw) !important;
	margin-right: calc(50% - 50vw) !important;
}

@supports (width: 100dvw) {
	.rf-waitlist-page,
	.is-style-rf-seamless-stack {
		width: 100dvw;
		margin-left: calc(50% - 50dvw) !important;
		margin-right: calc(50% - 50dvw) !important;
	}
}

.rf-waitlist-page > .rf-section,
.is-style-rf-seamless-stack > .rf-section,
.rf-waitlist-page > .alignfull,
.is-style-rf-seamless-stack > .alignfull {
	width: 100%;
	max-width: none !important;
	margin-inline: 0 !important;
}

/* A component section owns its spacing; inline Gutenberg spacing overrides it. */
.rf-section,
.is-style-rf-section-shell {
	box-sizing: border-box;
	padding-block: clamp(4.5rem, 8vw, 7rem);
	scroll-margin-top: 5rem;
	container-type: inline-size;
}

.rf-component__inner,
.rf-section__inner {
	box-sizing: border-box;
	width: 100%;
	max-width: var(--rf-content-width);
	margin-inline: auto;
	padding-inline: var(--rf-gutter);
	container-type: inline-size;
}

.rf-component__columns,
.rf-section__columns,
.rf-hero__columns {
	gap: clamp(2.25rem, 5vw, 5.5rem);
}

.is-style-rf-gap-compact { gap: clamp(1rem, 2.4vw, 2rem) !important; }
.is-style-rf-gap-spacious { gap: clamp(3rem, 7vw, 7rem) !important; }

/*
 * Consistent component typography.
 *
 * The first component release made typography mostly opt-in. As a result,
 * styled hero copy used the RF scale while ordinary H2 and paragraph blocks
 * could fall back to Blocksy's global defaults. These defaults now apply to
 * every RF component, while native Gutenberg font-size controls still win
 * when a block is manually customised.
 */
:where(.rf-design-system, .rf-component, .rf-section, .rf-form-card) {
	--rf-font-display: clamp(4rem, 8cqi, 6.25rem);
	--rf-font-section: clamp(2.8rem, 5.2cqi, 4.25rem);
	--rf-font-card: clamp(1.28rem, 2.05cqi, 1.65rem);
	--rf-font-lead: clamp(1.22rem, 1.75cqi, 1.45rem);
	--rf-font-body: clamp(1.05rem, 1.35cqi, 1.18rem);
	--rf-font-small: .78rem;
}

/* Hero/display hierarchy. */
:where(.rf-hero, .rf-design-system) h1,
.wp-block-heading.is-style-rf-display,
.rf-hero__title {
	margin-block: .5rem 1.75rem;
	font-size: var(--rf-font-display);
	font-weight: 700;
	line-height: .96;
	letter-spacing: -.045em;
}

/* Section headings are large by default, not only when a block style is set. */
:where(.rf-section, .rf-component) h2,
.wp-block-heading.is-style-rf-section-heading,
.rf-section__title {
	font-size: var(--rf-font-section);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -.035em;
}

/* Card and row headings. */
:where(.rf-section, .rf-component) h3,
.wp-block-heading.is-style-rf-card-heading {
	font-size: var(--rf-font-card);
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -.02em;
}

/* Standard reading text throughout every component. */
:where(.rf-section, .rf-component) :where(p, li) {
	font-size: var(--rf-font-body);
	line-height: 1.68;
}

p.is-style-rf-kicker {
	margin-bottom: 1rem;
	font-family: "Montserrat", sans-serif;
	font-size: .72rem;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: .14em;
	text-transform: uppercase;
}

p.is-style-rf-kicker::before {
	content: "";
	display: inline-block;
	width: 2rem;
	height: 2px;
	margin-right: .7rem;
	vertical-align: .22em;
	background: currentColor;
	opacity: .75;
}

p.is-style-rf-lead,
.rf-hero__lede {
	max-width: 39rem;
	font-size: var(--rf-font-lead);
	line-height: 1.55;
}

p.is-style-rf-muted,
.rf-hero__audience,
.rf-hero__note {
	color: var(--rf-muted);
}

.rf-cohort-line {
	margin-top: 1.5rem;
	font-family: "Montserrat", sans-serif;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .055em;
	text-transform: uppercase;
}

/* Optional, removable visual block styles. */
.is-style-rf-tone-paper { background: var(--rf-paper); color: var(--rf-ink); }
.is-style-rf-tone-soft { background: var(--rf-paper-soft); color: var(--rf-ink); }
.is-style-rf-tone-dark { background: var(--rf-ink); color: var(--rf-white); }
.is-style-rf-tone-blue { background: var(--rf-blue); color: var(--rf-ink); }

.is-style-rf-shadow-button .wp-block-button__link { box-shadow: 7px 7px 0 var(--rf-blue); }
.is-style-rf-shadow-button .wp-block-button__link:hover { box-shadow: 9px 9px 0 var(--rf-accent); }

.wp-block-image.is-style-rf-media-framed img {
	border: 1px solid color-mix(in srgb, var(--rf-ink) 24%, transparent);
}
.wp-block-image.is-style-rf-media-soft img {
	box-shadow: 0 18px 50px rgba(24, 32, 58, .16);
}
.wp-block-image.is-style-rf-media-large,
.wp-block-image.is-style-rf-media-bleed {
	position: relative;
	z-index: 2;
	max-width: none;
	margin-left: auto;
}
.wp-block-image.is-style-rf-media-large {
	width: min(125%, 760px);
	margin-right: clamp(-3.5rem, -4vw, -1rem);
}
.wp-block-image.is-style-rf-media-bleed {
	width: min(145%, 900px);
	margin-right: clamp(-9rem, -8vw, -3rem);
}
.wp-block-image.is-style-rf-media-large img,
.wp-block-image.is-style-rf-media-bleed img {
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
}

.is-style-rf-card-offset {
	border: 1px solid currentColor;
	box-shadow: 12px 12px 0 var(--rf-accent);
}
.is-style-rf-card-soft {
	border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
	box-shadow: 0 18px 50px rgba(24, 32, 58, .14);
}

/* Reusable content components. */
.rf-numbered-item {
	padding: 1.25rem 0;
	border-top: 1px solid var(--rf-line);
}
.rf-numbered-item strong {
	color: var(--rf-accent-dark);
	font-family: "Montserrat", sans-serif;
	font-size: .7rem;
	letter-spacing: .08em;
}

ul.is-style-rf-outcome-list,
.rf-outcome-list {
	counter-reset: rf-outcome;
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid color-mix(in srgb, currentColor 42%, transparent);
}
ul.is-style-rf-outcome-list li,
.rf-outcome-list li {
	position: relative;
	min-height: 5.4rem;
	padding: 1.4rem 0 1.4rem 4rem;
	border-bottom: 1px solid color-mix(in srgb, currentColor 17%, transparent);
	counter-increment: rf-outcome;
	font-size: clamp(1.02rem, 1.7cqw, 1.28rem);
	font-weight: 600;
	line-height: 1.35;
}
ul.is-style-rf-outcome-list li::before,
.rf-outcome-list li::before {
	content: counter(rf-outcome, decimal-leading-zero);
	position: absolute;
	left: .25rem;
	top: 1.75rem;
	color: var(--rf-accent);
	font-family: "Montserrat", sans-serif;
	font-size: .67rem;
	font-weight: 800;
}

ul.is-style-rf-check-list,
.rf-check-list {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.is-style-rf-check-list li,
.rf-check-list li {
	position: relative;
	padding: 1rem 0 1rem 2rem;
	border-top: 1px solid var(--rf-line);
	font-weight: 600;
}
ul.is-style-rf-check-list li::before,
.rf-check-list li::before {
	content: "✓";
	position: absolute;
	left: .15rem;
	color: var(--rf-accent-dark);
	font-weight: 900;
}

.rf-phase-grid { gap: 0; border: 1px solid currentColor; }
.rf-phase-card {
	min-height: 20rem;
	padding: clamp(1.35rem, 2vw, 1.8rem);
	border-right: 1px solid currentColor;
}
.rf-phase-card:last-child { border-right: 0; }
.rf-phase-card > p:first-child {
	font-family: "Montserrat", sans-serif;
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.rf-phase-card .wp-block-separator { width: 2.2rem; margin: 2rem 0 4rem; }

.rf-logistics-list { border-top: 1px solid currentColor; }
.rf-logistics-row { gap: 1.5rem; padding: 1.4rem 0; border-bottom: 1px solid var(--rf-line); }
.rf-logistics-row :where(p, h3) { margin: 0; }
.rf-logistics-row p {
	color: var(--rf-muted);
	font-family: "Montserrat", sans-serif;
	font-size: .67rem;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
}

/* Form component. */
.rf-form-card {
	padding: clamp(1.35rem, 3vw, 2.25rem);
	background: var(--rf-white);
	color: var(--rf-ink);
}
.rf-priority-form { display: grid; gap: 1.15rem; }
.rf-priority-form label { display: grid; gap: .48rem; }
.rf-priority-form label > span,
.rf-priority-form legend {
	font-family: "Montserrat", sans-serif;
	font-size: .66rem;
	font-weight: 800;
	letter-spacing: .075em;
	line-height: 1.4;
	text-transform: uppercase;
}
.rf-priority-form input,
.rf-priority-form select,
.rf-priority-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: .9rem .85rem;
	border: 1px solid rgba(24, 32, 58, .32);
	border-radius: 0;
	background: #fff;
	color: var(--rf-ink);
	font-family: "Raleway", sans-serif;
	font-size: .88rem;
}
.rf-priority-form input:focus,
.rf-priority-form select:focus,
.rf-priority-form textarea:focus {
	outline: 3px solid color-mix(in srgb, var(--rf-accent) 25%, transparent);
	border-color: var(--rf-accent-dark);
}
.rf-priority-form textarea { min-height: 6rem; resize: vertical; }
.rf-priority-form fieldset { margin: 0; padding: 0; border: 0; }
.rf-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.rf-radio-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.rf-radio-option { position: relative; }
.rf-radio-option input { position: absolute; opacity: 0; pointer-events: none; }
.rf-radio-option span {
	display: grid;
	min-height: 3rem;
	place-items: center;
	padding: .45rem;
	border: 1px solid rgba(24, 32, 58, .32);
	font-family: "Raleway", sans-serif !important;
	font-size: .75rem !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-align: center;
	text-transform: none !important;
	cursor: pointer;
}
.rf-radio-option input:checked + span { background: var(--rf-ink); color: var(--rf-white); }
.rf-form-submit {
	width: 100%;
	min-height: 3.6rem;
	border: 1px solid var(--rf-ink);
	border-radius: 0;
	background: var(--rf-accent);
	color: var(--rf-ink);
	box-shadow: 6px 6px 0 var(--rf-ink);
	font-family: "Montserrat", sans-serif;
	font-weight: 800;
	cursor: pointer;
}
.rf-form-success { min-height: 28rem; display: grid; place-content: center; justify-items: center; text-align: center; }
.rf-form-success__mark {
	display: grid;
	width: 4rem;
	height: 4rem;
	margin-bottom: 1.5rem;
	place-items: center;
	border: 1px solid currentColor;
	background: var(--rf-yellow);
	box-shadow: 5px 5px 0 currentColor;
	font-size: 1.7rem;
}
.rf-form-error { padding: .8rem; border: 1px solid #a50000; color: #8b0000; }
.rf-honeypot { position: absolute !important; left: -9999px !important; }

/* Progressive enhancement. */
.rf-scroll-progress {
	position: fixed;
	z-index: 9999;
	top: 0;
	left: 0;
	width: 100%;
	height: 3px;
	pointer-events: none;
	background: var(--rf-accent, #ff6a3d);
	transform: scaleX(0);
	transform-origin: left center;
}
.wp-block-button__link,
.rf-form-submit { transition: transform .2s ease, box-shadow .2s ease; }
.wp-block-button__link:hover,
.rf-form-submit:hover { transform: translateY(-2px); }
.is-style-rf-tilt {
	transform: perspective(1100px) rotateX(var(--rf-tilt-x, 0deg)) rotateY(var(--rf-tilt-y, 0deg));
	transition: transform .18s ease-out;
	transform-style: preserve-3d;
}
.rf-motion-ready .is-style-rf-reveal,
.rf-motion-ready .is-style-rf-stagger > * {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity .62s ease, transform .62s cubic-bezier(.2,.72,.2,1);
	transition-delay: var(--rf-delay, 0ms);
}
.rf-motion-ready .is-style-rf-reveal.is-visible,
.rf-motion-ready .is-style-rf-stagger > *.is-visible {
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 1000px) {
	.rf-hero__columns,
	.rf-section__columns,
	.rf-component__columns { flex-wrap: wrap !important; }
	.rf-hero__columns > .wp-block-column,
	.rf-section__columns > .wp-block-column,
	.rf-component__columns > .wp-block-column { flex-basis: 100% !important; }
	.wp-block-image.is-style-rf-media-large,
	.wp-block-image.is-style-rf-media-bleed { width: min(100%, 720px); margin-inline: auto; }
	.rf-phase-grid { flex-wrap: wrap !important; }
	.rf-phase-grid > .wp-block-column { flex-basis: 50% !important; }
	.rf-phase-card:nth-child(2) { border-right: 0; }
	.rf-phase-card:nth-child(-n+2) { border-bottom: 1px solid currentColor; }
}

@media (max-width: 700px) {
	.rf-section,
	.is-style-rf-section-shell { padding-block: 4.25rem; }
	.wp-block-heading.is-style-rf-display,
	.rf-hero__title { font-size: clamp(3.25rem, 15vw, 4.6rem); }
	:where(.rf-section, .rf-component) h2,
	.wp-block-heading.is-style-rf-section-heading,
	.rf-section__title { font-size: clamp(2.45rem, 10vw, 3.35rem); }
	.rf-phase-grid > .wp-block-column { flex-basis: 100% !important; }
	.rf-phase-card { min-height: 14rem; border-right: 0; border-bottom: 1px solid currentColor; }
	.rf-phase-card:last-child { border-bottom: 0; }
	.rf-form-row,
	.rf-radio-grid { grid-template-columns: 1fr; }
	.rf-logistics-row { flex-wrap: nowrap !important; }
	.rf-logistics-row > .wp-block-column:first-child { flex-basis: 38% !important; }
	.rf-logistics-row > .wp-block-column:last-child { flex-basis: 62% !important; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
	.is-style-rf-reveal,
	.is-style-rf-stagger > * { opacity: 1 !important; transform: none !important; }
}