/* TMC Corporate — baseline styles for Phase 1 scaffold. */
:root {
	--tmc-navy: #102D46;
	--tmc-teal: #087F8C;
	--tmc-white: #FFFFFF;
	--tmc-grey: #F4F7F9;
	--tmc-slate: #344054;
	--tmc-radius: 6px;
	--tmc-container: 1200px;
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
	margin: 0;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--tmc-slate);
	background: var(--tmc-white);
	line-height: 1.6;
}

a { color: var(--tmc-teal); text-decoration: none; }
a:hover, a:focus { text-decoration: underline; }
a:focus-visible, button:focus-visible { outline: 2px solid var(--tmc-teal); outline-offset: 2px; }

.tmc-container {
	width: 100%;
	max-width: var(--tmc-container);
	margin: 0 auto;
	padding: 0 1.25rem;
}

.screen-reader-text {
	position: absolute !important;
	clip: rect(1px, 1px, 1px, 1px);
	width: 1px; height: 1px;
	overflow: hidden;
	white-space: nowrap;
}

.tmc-skip-link:focus {
	position: fixed;
	top: 0.5rem; left: 0.5rem;
	background: var(--tmc-navy);
	color: var(--tmc-white);
	padding: 0.5rem 1rem;
	z-index: 9999;
	clip: auto; width: auto; height: auto;
}

/* Header */
.tmc-header { background: var(--tmc-navy); color: var(--tmc-white); }
.tmc-header-inner { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; gap: 1rem; flex-wrap: wrap; }
.tmc-brand-text { color: var(--tmc-white); font-weight: 700; font-size: 1.15rem; letter-spacing: 0.02em; }
.tmc-nav-list { display: flex; gap: 1.25rem; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.tmc-nav-list a { color: var(--tmc-white); font-weight: 500; }
.tmc-nav-list a:hover, .tmc-nav-list a:focus { color: #b8ecf2; }

/* Main content */
.tmc-main { min-height: 60vh; }
.tmc-content { padding: 2.5rem 1.25rem 3.5rem; }

/* Hero */
.tmc-hero { background: linear-gradient(135deg, var(--tmc-navy) 0%, #1a466b 100%); color: var(--tmc-white); }
.tmc-hero .tmc-container { padding: 4rem 1.25rem; }
.tmc-hero-title { font-size: 2.25rem; margin: 0 0 0.5rem; line-height: 1.2; }
.tmc-hero-tagline { font-size: 1.15rem; color: #d3ecf0; margin: 0 0 1.5rem; }
.tmc-hero-notice { font-size: 0.95rem; color: #c5d6e0; max-width: 60ch; }

/* Buttons */
.tmc-btn {
	display: inline-block;
	background: var(--tmc-teal);
	color: var(--tmc-white);
	padding: 0.65rem 1.25rem;
	border-radius: var(--tmc-radius);
	font-weight: 600;
	border: 0;
	cursor: pointer;
}
.tmc-btn:hover, .tmc-btn:focus { background: #066a75; color: var(--tmc-white); text-decoration: none; }

/* Footer */
.tmc-footer { background: var(--tmc-grey); color: var(--tmc-slate); padding: 2rem 0; border-top: 3px solid var(--tmc-teal); }
.tmc-footer .tmc-container { display: flex; flex-direction: column; gap: 0.75rem; }
.tmc-footer-brand { font-weight: 600; margin: 0; color: var(--tmc-navy); }
.tmc-footer-list { display: flex; gap: 1rem; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.tmc-footer-copy { font-size: 0.875rem; color: var(--tmc-slate); margin: 0; }

/* Responsive */
@media (max-width: 720px) {
	.tmc-hero-title { font-size: 1.75rem; }
	.tmc-hero .tmc-container { padding: 2.5rem 1.25rem; }
}

.tmc-skip-link:focus {
	position: fixed;
	top: 0.5rem;
	left: 0.5rem;
	background: var(--tmc-navy, #102D46);
	color: var(--tmc-white, #FFFFFF);
	padding: 0.5rem 1rem;
	z-index: 9999;
	clip: auto;
	width: auto;
	height: auto;
	text-decoration: none;
	border-radius: 4px;
}