/*
Theme Name: RICBT
Theme URI: https://www.ricbt.org
Author: Mindease Limited
Author URI: https://www.ricbt.org
Description: Block child theme for the Register of Integrative Cognitive Behavioural Therapists.
Template: twentytwentyfive
Version: 1.4.0
Requires at least: 6.6
Requires PHP: 8.0
Text Domain: ricbt
*/

/* ==========================================================================
   RICBT component styles.
   Every colour is a preset custom property generated from theme.json.
   No hex values below this comment block.
   ========================================================================== */

/* ---- Hero band ----
   The hero is alignfull, so the gradient spans the viewport. Its own
   constrained layout would cap the inner content at the 720px prose measure,
   which leaves the headline floating in the middle of the band. Lift the inner
   content to the wide size and cap the headline and lead separately, so the
   hero text lines up with the cards below it. */
.ricbt-hero.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.ricbt-hero-plain.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: var(--wp--style--global--wide-size);
}

.ricbt-hero h1 {
	max-width: 18ch;
}

.ricbt-hero > p {
	max-width: 58ch;
}

.ricbt-hero-plain h1,
.ricbt-hero-plain > p {
	max-width: 34ch;
}

/* ---- Hero (gradient) ---- */
.ricbt-hero {
	background: var(--wp--preset--gradient--brand);
	color: var(--wp--preset--color--white);
	padding-top: var(--wp--preset--spacing--80);
	padding-bottom: var(--wp--preset--spacing--80);
	padding-left: var(--wp--preset--spacing--60);
	padding-right: var(--wp--preset--spacing--60);
}

.ricbt-hero h1 {
	color: var(--wp--preset--color--white);
	font-size: clamp(2.2rem, 4vw, 3.2rem);
	line-height: 1.08;
}

.ricbt-hero p {
	color: rgba(255, 255, 255, 0.86);
}

.ricbt-hero .ricbt-eyebrow {
	color: rgba(255, 255, 255, 0.72);
}

@media (max-width: 782px) {
	.ricbt-hero {
		padding-top: var(--wp--preset--spacing--60);
		padding-bottom: var(--wp--preset--spacing--60);
		padding-left: var(--wp--preset--spacing--40);
		padding-right: var(--wp--preset--spacing--40);
	}
}

/* ---- Hero, plain (paper) variant for sub-pages ---- */
.ricbt-hero-plain {
	background: var(--wp--preset--color--paper-2);
	padding-top: var(--wp--preset--spacing--70);
	padding-bottom: var(--wp--preset--spacing--70);
	padding-left: var(--wp--preset--spacing--60);
	padding-right: var(--wp--preset--spacing--60);
}

.ricbt-hero-plain h1 {
	color: var(--wp--preset--color--ink);
	font-size: clamp(2rem, 3.4vw, 2.6rem);
}

@media (max-width: 782px) {
	.ricbt-hero-plain {
		padding-top: var(--wp--preset--spacing--50);
		padding-bottom: var(--wp--preset--spacing--50);
		padding-left: var(--wp--preset--spacing--40);
		padding-right: var(--wp--preset--spacing--40);
	}
}

/* ---- Eyebrow ---- */
.ricbt-eyebrow {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--teal-700);
	margin-bottom: var(--wp--preset--spacing--20);
}

/* ---- Breadcrumbs ---- */
.ricbt-breadcrumbs {
	padding-top: var(--wp--preset--spacing--50);
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--grey-500);
	margin-bottom: var(--wp--preset--spacing--30);
}

.ricbt-breadcrumbs a {
	color: var(--wp--preset--color--teal-700);
	text-decoration: none;
}

.ricbt-breadcrumbs a:hover {
	text-decoration: underline;
}

/* ---- Primary CTA button ---- */
.ricbt-hero .wp-block-button__link {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--forest);
	box-shadow: var(--wp--custom--shadow--md);
}

.ricbt-hero .wp-block-button__link:hover {
	background: var(--wp--preset--color--paper-2);
	color: var(--wp--preset--color--forest);
}

.ricbt-cta-primary .wp-block-button__link {
	font-size: var(--wp--preset--font-size--md);
	padding: 15px 30px;
	border-radius: var(--wp--custom--radius--pill);
}

/* ---- Two column text ---- */
.ricbt-two-col {
	gap: var(--wp--preset--spacing--60);
}

@media (max-width: 782px) {
	.ricbt-two-col {
		flex-direction: column;
	}
}

/* ---- Card grid ---- */
.ricbt-card-grid {
	gap: var(--wp--preset--spacing--50);
	flex-wrap: wrap;
}

.ricbt-card-grid > .wp-block-column {
	min-width: 260px;
	display: flex;
}

.ricbt-card-grid > .wp-block-column > .ricbt-card {
	flex: 1;
}

.ricbt-header .ricbt-logo-mark {
	margin: 0;
	line-height: 0;
}

@media (max-width: 782px) {
	.ricbt-card-grid {
		flex-direction: column;
	}
}

.ricbt-card {
	background: var(--wp--preset--color--white);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--lg);
	box-shadow: var(--wp--custom--shadow--xs);
	padding: var(--wp--preset--spacing--50);
}

/* Card type follows the design pack's card composition, not the global heading
   scale: the kit sets the h3 role then overrides the size to text-md, with
   text-sm body. Using the global h3 (text-xl, 28px) makes card headings wrap
   to three and four lines. */
.ricbt-card h3 {
	font-size: var(--wp--preset--font-size--md);
	line-height: 1.3;
	margin-bottom: var(--wp--preset--spacing--20);
}

.ricbt-card p {
	font-size: var(--wp--preset--font-size--sm);
	line-height: 1.55;
}

.ricbt-card--accent {
	border-top: 4px solid transparent;
	border-image: var(--wp--preset--gradient--brand);
	border-image-slice: 1;
}

.ricbt-card h3 {
	margin-top: 0;
}

/* ---- Quote ----
   The theme shipped no quote styling, so quotes inherited Twenty Twenty-Five's
   display-scale default, which reads as shouting next to the rest of the page. */
.wp-block-quote {
	border-left: 3px solid var(--wp--preset--color--teal);
	padding-left: var(--wp--preset--spacing--50);
	margin-top: var(--wp--preset--spacing--70);
	margin-bottom: var(--wp--preset--spacing--70);
	max-width: var(--wp--style--global--content-size);
}

.wp-block-quote p {
	font-size: var(--wp--preset--font-size--lg);
	line-height: 1.45;
	color: var(--wp--preset--color--ink-soft);
}

.wp-block-quote cite {
	display: block;
	margin-top: var(--wp--preset--spacing--30);
	font-size: var(--wp--preset--font-size--sm);
	font-style: normal;
	color: var(--wp--preset--color--grey-500);
}

/* ---- Notices ---- */
.ricbt-notice {
	padding: var(--wp--preset--spacing--50);
	border-radius: var(--wp--custom--radius--md);
	margin-top: var(--wp--preset--spacing--40);
	margin-bottom: var(--wp--preset--spacing--40);
}

.ricbt-notice--info {
	background: var(--wp--preset--color--paper-2);
	border-left: 4px solid var(--wp--preset--color--teal);
}

.ricbt-notice--statutory {
	background: var(--wp--preset--color--forest);
	color: var(--wp--preset--color--white);
}

.ricbt-notice--statutory a {
	color: var(--wp--preset--color--white);
}

/* ---- Policy header and section ---- */
.ricbt-policy-main {
	padding-top: var(--wp--preset--spacing--60);
}

.ricbt-policy-header {
	max-width: var(--wp--style--global--content-size);
}

.ricbt-policy-header h1 {
	font-size: clamp(2rem, 3.4vw, 2.6rem);
	margin-bottom: var(--wp--preset--spacing--20);
}

.ricbt-policy-header > p,
.ricbt-policy-header .ricbt-policy-meta {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--grey-500);
	margin-bottom: var(--wp--preset--spacing--50);
}

.ricbt-policy-header h2 {
	font-size: var(--wp--preset--font-size--sm);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--wp--preset--color--grey-500);
	margin-bottom: var(--wp--preset--spacing--20);
}

.ricbt-policy-header ul,
.ricbt-policy-header .ricbt-policy-contents {
	background: var(--wp--preset--color--paper-2);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--50) var(--wp--preset--spacing--50) var(--wp--preset--spacing--50) var(--wp--preset--spacing--70);
	font-size: var(--wp--preset--font-size--sm);
}

.ricbt-policy-header ul li {
	margin-bottom: var(--wp--preset--spacing--10);
}

.ricbt-policy-header a {
	color: var(--wp--preset--color--teal-700);
	text-decoration: none;
}

.ricbt-policy-header a:hover {
	text-decoration: underline;
}

.ricbt-policy-section {
	max-width: var(--wp--style--global--content-size);
	line-height: 1.7;
}

.ricbt-policy-section h2 {
	font-size: var(--wp--preset--font-size--xl);
	padding-top: var(--wp--preset--spacing--40);
	border-top: 1px solid var(--wp--preset--color--line);
	scroll-margin-top: calc(var(--wp--custom--header-height) + var(--wp--preset--spacing--40));
}

.ricbt-policy-section h3 {
	font-size: var(--wp--preset--font-size--md);
}

/* ---- CTA band ---- */
.ricbt-cta-band {
	background: var(--wp--preset--color--forest);
	color: var(--wp--preset--color--white);
	padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60);
	text-align: center;
}

.ricbt-cta-band .wp-block-buttons {
	justify-content: center;
}

.ricbt-cta-band h2 {
	color: var(--wp--preset--color--white);
}

.ricbt-cta-band .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--white);
	border: 1.5px solid var(--wp--preset--color--white);
}

.ricbt-cta-band .wp-block-button__link:hover {
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--forest);
}

/* ---- Contact / native form ---- */
.ricbt-form label {
	display: block;
	font-weight: 500;
	font-size: var(--wp--preset--font-size--sm);
	margin-bottom: var(--wp--preset--spacing--10);
}

.ricbt-form input,
.ricbt-form select,
.ricbt-form textarea {
	width: 100%;
	font-family: var(--wp--preset--font-family--inter);
	font-size: var(--wp--preset--font-size--base);
	border: 1.5px solid var(--wp--preset--color--line-strong);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
	margin-bottom: var(--wp--preset--spacing--40);
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
}

.ricbt-form input:focus,
.ricbt-form select:focus,
.ricbt-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--teal);
	box-shadow: var(--wp--custom--shadow--focus);
}

.ricbt-form button[type="submit"] {
	font-family: var(--wp--preset--font-family--inter);
	font-weight: 500;
	background: var(--wp--preset--color--teal-700);
	color: var(--wp--preset--color--white);
	border: none;
	border-radius: var(--wp--custom--radius--pill);
	padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--60);
	cursor: pointer;
}

.ricbt-form button[type="submit"]:hover {
	background: var(--wp--preset--color--forest);
}

/* ---- Header ---- */
.ricbt-header {
	position: sticky;
	top: 0;
	z-index: 100;
	height: var(--wp--custom--header-height);
	display: flex;
	align-items: center;
	background: rgba(255, 255, 255, 0.86);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.ricbt-header-inner {
	width: 100%;
	max-width: var(--wp--style--global--wide-size);
	margin: 0 auto;
	padding-left: var(--wp--preset--spacing--40);
	padding-right: var(--wp--preset--spacing--40);
}

.ricbt-header nav.wp-block-navigation a {
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
}

.ricbt-header .wp-block-navigation__submenu-container {
	background: var(--wp--preset--color--white);
	border-radius: var(--wp--custom--radius--md);
	box-shadow: var(--wp--custom--shadow--md);
	border: 1px solid var(--wp--preset--color--line);
}

.ricbt-header .ricbt-contact-button .wp-block-button__link {
	font-size: var(--wp--preset--font-size--sm);
	padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--50);
}

@media (max-width: 782px) {
	.ricbt-header-inner {
		padding-left: var(--wp--preset--spacing--30);
		padding-right: var(--wp--preset--spacing--30);
	}
}

/* ---- Footer ---- */
.ricbt-footer {
	background: var(--wp--preset--color--forest);
	color: rgba(255, 255, 255, 0.78);
	padding-top: var(--wp--preset--spacing--80);
	padding-bottom: var(--wp--preset--spacing--60);
	padding-left: var(--wp--preset--spacing--40);
	padding-right: var(--wp--preset--spacing--40);
}

.ricbt-footer a {
	color: rgba(255, 255, 255, 0.78);
	text-decoration: none;
}

.ricbt-footer a:hover {
	color: var(--wp--preset--color--white);
	text-decoration: underline;
}

.ricbt-footer h2,
.ricbt-footer h3 {
	color: var(--wp--preset--color--white);
	font-weight: 700;
	font-size: var(--wp--preset--font-size--sm);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.ricbt-footer-columns {
	gap: var(--wp--preset--spacing--60);
}

@media (max-width: 782px) {
	.ricbt-footer-columns {
		flex-direction: column;
	}
}

.ricbt-footer-legal {
	border-top: 1px solid rgba(255, 255, 255, 0.16);
	margin-top: var(--wp--preset--spacing--70);
	padding-top: var(--wp--preset--spacing--50);
	font-size: var(--wp--preset--font-size--xs);
	color: var(--wp--preset--color--grey-300);
	line-height: 1.7;
}