/******************************************************************************
 *
 * CRDM Shared Theme
 *
 * Shared design tokens and reusable components for the CRDM staff and public
 * experiences. These styles capture the established CRDM visual language
 * without changing legacy selectors.
 *
 ******************************************************************************/

:root {
	/* Brand and typography */
	--crdm-font-brand: "Palatino Linotype", Georgia, "Times New Roman", serif;
	--crdm-font-ui: Arial, Verdana, sans-serif;
	--crdm-brand-gold: #d6b47b;
	--crdm-brand-tan: #d2c3a1;
	--crdm-brand-bronze: #af6e30;
	--crdm-brand-button: #74482b;
	--crdm-brand-button-hover: #603913;
	--crdm-brand-button-border: #977660;

	/* Application surfaces */
	--crdm-page: #221d1a;
	--crdm-background: #191513;
	--crdm-surface: #1d1917;
	--crdm-surface-embedded: #221e1b;
	--crdm-surface-raised: #241f1b;
	--crdm-surface-featured: #231e1b;
	--crdm-surface-hover: #302822;
	--crdm-surface-control: #2c2520;
	--crdm-surface-control-hover: #392e27;
	--crdm-border: #4c423a;
	--crdm-border-hover: #5a4d44;
	--crdm-border-strong: #6a5a50;

	/* Text hierarchy */
	--crdm-text: #aaa49d;
	--crdm-text-strong: #eee8e3;
	--crdm-text-value: #f8f3ef;
	--crdm-text-label: #9f9690;
	--crdm-text-muted: #918982;
	--crdm-text-subtle: #8f8781;
	--crdm-text-faint: #817973;

	/* Semantic accents */
	--crdm-neutral: #7d8793;
	--crdm-neutral-rgb: 125, 135, 147;
	--crdm-info: #6fa4ff;
	--crdm-info-rgb: 111, 164, 255;
	--crdm-info-light: #8ebcff;
	--crdm-success: #57d66f;
	--crdm-success-rgb: 87, 214, 111;
	--crdm-warning: #f0d157;
	--crdm-warning-rgb: 240, 209, 87;
	--crdm-note: #f4d35e;
	--crdm-danger: #cc0000;
	--crdm-danger-soft: #ff6565;
	--crdm-danger-soft-rgb: 255, 101, 101;
	--crdm-purple: #b27cff;
	--crdm-purple-rgb: 178, 124, 255;
	--crdm-purple-light: #c99cff;

	/* Shape, spacing and motion */
	--crdm-radius-sm: 7px;
	--crdm-radius-md: 11px;
	--crdm-radius-lg: 12px;
	--crdm-radius-pill: 999px;
	--crdm-space-1: 4px;
	--crdm-space-2: 8px;
	--crdm-space-3: 10px;
	--crdm-space-4: 12px;
	--crdm-space-5: 14px;
	--crdm-space-6: 16px;
	--crdm-space-7: 20px;
	--crdm-space-8: 24px;
	--crdm-transition-fast: .18s ease;
	--crdm-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, .025);
	--crdm-shadow-raised: 0 5px 18px rgba(0, 0, 0, .2);
	--crdm-shadow-popover: 0 8px 24px rgba(0, 0, 0, .25);

	/* High-contrast picker surface */
	--crdm-picker-surface: #fff;
	--crdm-picker-text: #333;
	--crdm-picker-text-strong: #111827;
	--crdm-picker-border: #e5e5e5;
	--crdm-picker-hover: #e6e6e6;
}

/******************************************************************************
 * Shared guest-facing brand header
 ******************************************************************************/

.crdm-guest-brand {
	display: flex;
	min-height: 220px;
	padding: 0 48px 24px;
	align-items: flex-start;
	gap: 32px;
	background: linear-gradient(180deg, rgba(255, 255, 255, .018), transparent);
	text-align: center;
}

.crdm-guest-brand__home {
	display: block;
	line-height: 0;
	flex: 0 0 auto;
}

.crdm-guest-brand img {
	width: 230px;
	height: auto;
	flex: 0 0 auto;
}

.crdm-guest-brand p {
	margin: 42px 0 0;
	color: var(--crdm-brand-gold);
	font: italic 27px/1.25 Georgia, "Times New Roman", serif;
	flex: 1;
}

.crdm-guest-brand span,
.crdm-guest-brand strong {
	display: block;
}

.crdm-guest-brand strong {
	margin: 5px 0;
	color: var(--crdm-text-value);
	font-size: 32px;
	font-weight: 400;
}

@media (max-width: 800px) {
	.crdm-guest-brand {
		min-height: 180px;
		padding: 0 24px 20px;
	}

	.crdm-guest-brand img {
		width: 180px;
	}

	.crdm-guest-brand p {
		margin-top: 31px;
		font-size: 21px;
	}

	.crdm-guest-brand strong {
		font-size: 26px;
	}
}

@media (max-width: 560px) {
	.crdm-guest-brand {
		min-height: 145px;
		padding: 0 16px 14px;
		gap: 12px;
	}

	.crdm-guest-brand img {
		width: 135px;
	}

	.crdm-guest-brand p {
		margin-top: 23px;
		font-size: 15px;
	}

	.crdm-guest-brand strong {
		font-size: 19px;
	}
}