/* The Resume Ready: brand tokens, base typography and buttons. Loaded on every page. */
:root {
	--rr-navy: #0f2147;
	--rr-navy-2: #16295a;
	--rr-blue: #1652e6;
	--rr-blue-hover: #1044c2;
	--rr-blue-50: #eef3fd;
	--rr-blue-100: #dbe5fb;
	--rr-hl-on-dark: #8fb3ff;
	--rr-ink: #111a2e;
	--rr-text: #3b4459;
	--rr-muted: #667085;
	--rr-line: #e3e8f2;
	--rr-soft: #f5f8fe;
	--rr-white: #fff;
	--rr-serif: "DM Serif Display", Georgia, "Times New Roman", serif;
	--rr-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--rr-radius: 10px;
	--rr-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 8px 24px rgba(16, 24, 40, .08);
	--rr-container: 1200px;
	--rr-gutter: 24px;
}

body {
	font-family: var(--rr-sans);
	color: var(--rr-text);
	background: var(--rr-white);
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

body a { color: var(--rr-blue); }
body a:hover, body a:focus { color: var(--rr-blue-hover); }

h1, h2, h3, h4, h5, h6 { color: var(--rr-navy); }

.rr-container {
	width: 100%;
	max-width: calc(var(--rr-container) + var(--rr-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--rr-gutter);
	box-sizing: border-box;
}

.rr-hl { color: var(--rr-blue); }

.rr-eyebrow {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--rr-text);
}

.rr-h2 {
	margin: 0 0 14px;
	font-family: var(--rr-serif);
	font-weight: 400;
	font-size: clamp(30px, 3.4vw, 42px);
	line-height: 1.1;
	color: var(--rr-navy);
}

.rr-lead { margin: 0 0 16px; font-size: 17px; color: var(--rr-text); }

.rr-icon { flex: none; display: inline-block; vertical-align: middle; }

/* Buttons */
body .rr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 22px;
	border: 1.5px solid transparent;
	border-radius: 8px;
	font-family: var(--rr-sans);
	font-size: 16px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
	box-sizing: border-box;
}
body .rr-btn:focus-visible { outline: 3px solid var(--rr-blue-100); outline-offset: 2px; }
body .rr-btn--lg { padding: 16px 28px; font-size: 18px; }
body .rr-btn--sm { padding: 9px 18px; font-size: 15px; }
body .rr-btn--block { display: flex; width: 100%; }

body .rr-btn--primary { background: var(--rr-blue); color: var(--rr-white); }
body .rr-btn--primary:hover, body .rr-btn--primary:focus { background: var(--rr-blue-hover); color: var(--rr-white); }

body .rr-btn--outline { background: var(--rr-white); color: var(--rr-navy); border-color: var(--rr-navy-2); }
body .rr-btn--outline:hover, body .rr-btn--outline:focus { background: var(--rr-blue-50); color: var(--rr-navy); border-color: var(--rr-blue); }

body .rr-btn--white { background: var(--rr-white); color: var(--rr-navy); }
body .rr-btn--white:hover, body .rr-btn--white:focus { background: var(--rr-blue-50); color: var(--rr-navy); }

body .rr-btn--ghost { background: transparent; color: var(--rr-white); border-color: rgba(255, 255, 255, .45); }
body .rr-btn--ghost:hover, body .rr-btn--ghost:focus { background: rgba(255, 255, 255, .1); color: var(--rr-white); border-color: var(--rr-white); }

body .rr-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 600;
	text-decoration: none;
}
body .rr-link-arrow:hover .rr-icon { transform: translateX(3px); }
body .rr-link-arrow .rr-icon { transition: transform .15s; }

@media (max-width: 767px) {
	:root { --rr-gutter: 16px; }
}