/* ==========================================================================
   Source One Maintenance — brand layer over Bootstrap 5.3
   Palette: white canvas · blue primary (#14558F) · red accent (#D7263D)
   Red is reserved for critical CTAs and highlights only.
   ========================================================================== */

:root {
	--so-blue: #14558F;
	--so-blue-dark: #0C3A63;
	--so-blue-light: #EAF1F8;
	--so-red: #D7263D;
	--so-red-dark: #B01E31;
	--so-body: #2B3441;
	--bs-primary: var(--so-blue);
	--bs-primary-rgb: 20, 85, 143;
	--bs-link-color: var(--so-blue);
	--bs-link-hover-color: var(--so-blue-dark);
}

body {
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	color: var(--so-body);
	background-color: #fff;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	font-weight: 700;
	color: var(--so-blue-dark);
}

/* --- Buttons ----------------------------------------------------------- */

.btn-primary {
	--bs-btn-bg: var(--so-blue);
	--bs-btn-border-color: var(--so-blue);
	--bs-btn-hover-bg: var(--so-blue-dark);
	--bs-btn-hover-border-color: var(--so-blue-dark);
	--bs-btn-active-bg: var(--so-blue-dark);
	--bs-btn-active-border-color: var(--so-blue-dark);
	--bs-btn-disabled-bg: var(--so-blue);
	--bs-btn-disabled-border-color: var(--so-blue);
}

.btn-outline-primary {
	--bs-btn-color: var(--so-blue);
	--bs-btn-border-color: var(--so-blue);
	--bs-btn-hover-bg: var(--so-blue);
	--bs-btn-hover-border-color: var(--so-blue);
	--bs-btn-active-bg: var(--so-blue-dark);
	--bs-btn-active-border-color: var(--so-blue-dark);
}

/* The accent button — reserved for the most important calls to action */
.btn-so-red {
	--bs-btn-color: #fff;
	--bs-btn-bg: var(--so-red);
	--bs-btn-border-color: var(--so-red);
	--bs-btn-hover-color: #fff;
	--bs-btn-hover-bg: var(--so-red-dark);
	--bs-btn-hover-border-color: var(--so-red-dark);
	--bs-btn-active-color: #fff;
	--bs-btn-active-bg: var(--so-red-dark);
	--bs-btn-active-border-color: var(--so-red-dark);
	--bs-btn-focus-shadow-rgb: 215, 38, 61;
	font-weight: 600;
}

/* --- Brand utilities ---------------------------------------------------- */

.bg-so-blue   { background-color: var(--so-blue) !important; }
.bg-so-dark   { background-color: var(--so-blue-dark) !important; }
.bg-so-light  { background-color: var(--so-blue-light) !important; }
.text-so-blue { color: var(--so-blue) !important; }
.text-so-red  { color: var(--so-red) !important; }
.border-so-blue { border-color: var(--so-blue) !important; }

.bg-so-blue h1, .bg-so-blue h2, .bg-so-blue h3, .bg-so-blue h4,
.bg-so-dark h1, .bg-so-dark h2, .bg-so-dark h3, .bg-so-dark h4 {
	color: #fff;
}

/* --- Top utility bar ---------------------------------------------------- */

.topbar-link {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}
.topbar-link:hover { color: #fff; }

/* --- Navbar -------------------------------------------------------------- */

.navbar .nav-link {
	font-weight: 600;
	color: var(--so-body);
	padding-left: 0.9rem;
	padding-right: 0.9rem;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus { color: var(--so-blue); }
.navbar .nav-link.active {
	color: var(--so-blue);
	box-shadow: inset 0 -3px 0 var(--so-red);
}
.dropdown-item { font-weight: 500; padding-top: 0.55rem; padding-bottom: 0.55rem; }
.dropdown-item:active,
.dropdown-item:hover { background-color: var(--so-blue-light); color: var(--so-blue-dark); }

/* --- Sections & components ---------------------------------------------- */

.section-padding { padding: 4.5rem 0; }

.section-eyebrow {
	display: inline-block;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--so-red);
	margin-bottom: 0.5rem;
}

.card-service {
	border: 1px solid #dee2e6;
	border-top: 4px solid var(--so-blue);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	height: 100%;
}
.card-service:hover {
	transform: translateY(-4px);
	box-shadow: 0 0.75rem 1.5rem rgba(12, 58, 99, 0.12);
}

.stat-number {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--so-blue);
	line-height: 1;
}

/* Hero with photo background + blue overlay for text contrast */
.hero {
	position: relative;
	background-size: cover;
	background-position: center;
	color: #fff;
}
.hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(rgba(12, 58, 99, 0.82), rgba(12, 58, 99, 0.68));
}
.hero > .container { position: relative; z-index: 1; }
.hero h1 { color: #fff; }

/* Labeled gray box marking where a real work photo should be dropped in */
.img-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding: 1rem;
	background: repeating-linear-gradient(45deg, #e9ecef, #e9ecef 12px, #f8f9fa 12px, #f8f9fa 24px);
	border: 2px dashed #adb5bd;
	border-radius: 0.5rem;
	color: #6c757d;
	font-size: 0.9rem;
	font-weight: 600;
	min-height: 240px;
}

/* --- Footer -------------------------------------------------------------- */

.footer-heading { color: rgba(255, 255, 255, 0.6); letter-spacing: 0.08em; }
.footer-muted   { color: rgba(255, 255, 255, 0.65); }
.footer-rule    { border-color: rgba(255, 255, 255, 0.2); opacity: 1; }
.footer-links li { margin-bottom: 0.4rem; }
.footer-links a {
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
}
.footer-links a:hover { color: #fff; text-decoration: underline; }
.footer-inline-link { color: #fff; }
