bplist00ÑXUTI-DataÑ[public.htmlO †¨/* ===================================
Scott Morris — Bootstrap 5.3 Overrides
Custom brand colors, typography, and components
=================================== */
/* ===== CSS VARIABLES (Brand Colors) ===== */
:root {
/* Primary Colors */
--primary: #1e4d32;
--primary-light: #2d6a4a;
--primary-dark: #143d28;
/* Secondary/Accent */
--secondary: #7d5c3e;
--accent: #c4763a;
--accent-soft: #e8a574;
/* Backgrounds */
--bg-light: #f4efe8;
--bg-cream: #faf7f2;
--bg-white: #ffffff;
/* Text */
--text-dark: #1a1814;
--text-medium: #4a4540;
--text-light: #7a736b;
/* Borders & UI */
--border-light: #ddd4c8;
--radius: 14px;
--radius-sm: 10px;
/* Shadows */
--shadow-sm: 0 2px 12px rgba(26, 24, 20, 0.06);
--shadow-md: 0 12px 40px rgba(26, 24, 20, 0.08);
/* Typography */
--font-serif: 'Fraunces', Georgia, serif;
--font-sans: 'DM Sans', Inter, -apple-system, BlinkMacSystemFont, sans-serif;
}
/* ===== GLOBAL RESET & BASE ===== */
html {
scroll-behavior: smooth;
}
body {
font-family: var(--font-sans);
color: var(--text-dark);
background: var(--bg-light);
line-height: 1.75;
font-size: 1.05rem;
-webkit-font-smoothing: antialiased;
}
/* ===== TYPOGRAPHY ===== */
h1, h2, h3, h4, h5, h6 {
font-family: var(--font-serif);
line-height: 1.15;
font-weight: 500;
letter-spacing: -0.02em;
}
h1.display-5 {
font-size: clamp(2rem, 4vw, 2.85rem);
color: var(--primary-dark);
}
h1.display-3 {
font-size: clamp(2.25rem, 5vw, 3.75rem);
}
h2 {
font-size: clamp(1.75rem, 3vw, 2.35rem);
color: var(--primary-dark);
margin-bottom: 0.75rem;
margin-top: 2.5rem;
}
h2:first-child {
margin-top: 0;
}
h3 {
font-size: clamp(1.25rem, 2vw, 1.55rem);
color: var(--primary);
margin-bottom: 0.5rem;
margin-top: 1.75rem;
}
h4 {
font-size: 1.15rem;
font-weight: 600;
color: var(--primary-dark);
}
p {
margin-bottom: 1.25rem;
color: var(--text-medium);
}
a {
color: var(--primary-light);
text-decoration: none;
transition: color 0.25s ease;
}
a:hover {
color: var(--accent);
}
ul, ol {
margin-bottom: 1.25rem;
padding-left: 1.35rem;
}
li {
color: var(--text-medium);
margin-bottom: 0.45rem;
}
li::marker {
color: var(--accent);
}
/* ===== CONTAINERS ===== */
.container {
max-width: 1140px;
margin: 0 auto;
padding: 0 1.5rem;
}
.max-w-600 {
max-width: 600px;
}
.max-w-720 {
max-width: 720px;
}
.max-w-780 {
max-width: 780px;
}
/* ===== BOOTSTRAP BUTTON OVERRIDES ===== */
.btn {
padding: 0.85rem 1.75rem;
border-radius: 999px;
font-weight: 600;
font-size: 0.95rem;
font-family: var(--font-sans);
transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
border: none;
cursor: pointer;
}
.btn-primary {
background-color: var(--primary);
border-color: var(--primary);
color: white;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
background-color: var(--primary-light);
border-color: var(--primary-light);
color: white;
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(30, 77, 50, 0.25);
}
.btn-secondary {
background-color: transparent;
color: var(--primary);
border-color: var(--primary);
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
background-color: var(--primary);
color: white;
border-color: var(--primary);
}
.btn-outline-light:hover {
background-color: rgba(255, 255, 255, 0.12);
}
.btn-lg {
padding: 1rem 2rem;
}
/* ===== NAVBAR ===== */
.navbar {
background: rgba(250, 247, 242, 0.92) !important;
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
}
.navbar-brand {
font-family: var(--font-serif);
font-size: 1.15rem;
font-weight: 600;
color: var(--primary-dark) !important;
letter-spacing: -0.03em;
}
.navbar-brand .text-muted {
color: var(--text-light) !important;
font-family: var(--font-sans);
font-size: 0.85rem;
}
.nav-link {
font-size: 0.875rem !important;
font-weight: 500;
color: var(--text-medium) !important;
padding: 0.45rem 0.75rem !important;
border-radius: 999px;
transition: background 0.25s ease, color 0.25s ease !important;
}
.nav-link:hover {
color: var(--primary-dark) !important;
background: rgba(30, 77, 50, 0.08) !important;
}
.nav-link.active {
color: var(--primary-dark) !important;
background: rgba(30, 77, 50, 0.12) !important;
}
.navbar-toggler {
border: none;
}
.navbar-toggler:focus {
box-shadow: none;
}
/* ===== HERO SECTIONS ===== */
.hero-home {
min-height: 720px;
}
.hero-home h1 {
color: white;
}
.hero-home .lead {
color: rgba(250, 247, 242, 0.82);
}
.page-hero h1 {
color: var(--primary-dark);
}
.hero-eyebrow {
font-size: 0.8rem;
letter-spacing: 0.12em;
text-transform: uppercase;
}
/* ===== CARDS ===== */
.card {
border-radius: var(--radius);
border-color: var(--border-light);
box-shadow: var(--shadow-sm);
background-color: var(--bg-white);
}
.card-body {
color: var(--text-medium);
}
.card-header,
.card-footer {
background-color: var(--bg-cream);
border-color: var(--border-light);
}
/* ===== METHODOLOGY CARDS (Custom) ===== */
.methodology-card::before {
content: '';
display: block;
width: 2.5rem;
height: 3px;
background: linear-gradient(90deg, var(--primary), var(--accent));
margin-bottom: 1.25rem;
border-radius: 2px;
}
.framework-note {
font-size: 0.82rem;
color: var(--text-light);
font-style: italic;
}
/* ===== IMAGE CONTAINERS ===== */
.img-container {
border-radius: var(--radius);
overflow: hidden;
box-shadow: var(--shadow-md);
}
.img-container img {
display: block;
}
/* ===== CONTACT CTA BOX ===== */
.contact-cta-box {
background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary) 100%);
color: white;
}
.contact-cta-box h3 {
color: white;
}
.contact-cta-box p {
color: rgba(255, 255, 255, 0.88);
}
.contact-cta-box .btn-light {
background: white;
color: var(--primary-dark);
}
.contact-cta-box .btn-light:hover {
background: var(--bg-cream);
color: var(--primary-dark);
}
/* ===== CTA BAND ===== */
.cta-band {
background: var(--bg-white);
border-radius: var(--radius);
border: 1px solid var(--border-light);
}
/* ===== LIST GROUPS ===== */
.list-group-item {
color: var(--text-medium);
border-color: var(--border-light);
}
.list-group-item strong {
color: var(--primary-dark);
}
/* ===== FIGURES & CAPTIONS ===== */
figcaption {
font-size: 0.85rem;
color: var(--text-light);
font-style: italic;
margin-top: 0.65rem;
line-height: 1.5;
}
/* ===== BADGES ===== */
.badge {
font-weight: 500;
border-radius: 999px;
}
.bg-success {
background-color: var(--primary) !important;
}
.bg-warning {
background-color: var(--accent) !important;
}
/* ===== ALTERNATE BACKGROUND SECTIONS ===== */
.alt-bg {
background-color: var(--bg-white);
}
.section-title {
text-align: center;
color: var(--primary-dark);
}
.section-subtitle {
text-align: center;
color: var(--text-light);
}
/* ===== REVEAL ANIMATION (Preserve from main.js) ===== */
.reveal {
opacity: 0;
transform: translateY(20px);
transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
opacity: 1;
transform: translateY(0);
}
/* ===== FOOTER ===== */
footer {
background-color: var(--primary-dark);
color: rgba(255, 255, 255, 0.65);
}
footer strong {
color: white;
}
footer a {
color: rgba(255, 255, 255, 0.7);
}
footer a:hover {
color: var(--accent-soft);
}
/* ===== SOCIAL PROOF SECTION ===== */
.social-proof {
background-color: var(--bg-white);
}
.social-proof .badge {
background-color: var(--bg-light);
color: var(--text-medium);
border-color: var(--border-light);
}
/* ===== PAGE BAND SECTION ===== */
.page-band {
background-color: var(--bg-white);
}
/* ===== RESPONSIVE ADJUSTMENTS ===== */
@media (max-width: 992px) {
h1.display-3 {
font-size: 2.5rem;
}
h1.display-5 {
font-size: 2.25rem;
}
}
@media (max-width: 768px) {
.hero-home {
min-height: auto;
padding: 3rem 0;
}
.card-body.p-5 {
padding: 2rem !important;
}
.page-hero {
padding: 2.5rem 0 2rem;
}
section.py-5 {
padding: 3rem 0;
}
}
@media (max-width: 576px) {
.container {
padding: 0 1rem;
}
.btn {
padding: 0.75rem 1.5rem;
}
}
/* ===== UTILITY HELPERS ===== */
.ls-1 {
letter-spacing: 0.1em;
}
.ls-2 {
letter-spacing: 0.2em;
}
.text-primary-emphasis {
color: var(--primary) !important;
}
.text-success-emphasis {
color: var(--primary) !important;
}
.text-warning-emphasis {
color: var(--accent) !important;
}
.max-w-600 {
max-width: 600px;
}
.object-fit-cover {
object-fit: cover;
}
.object-fit-contain {
object-fit: contain;
}
/* ===== PRINT STYLES ===== */
@media print {
.navbar,
footer {
display: none;
}
body {
background: white;
color: black;
}
.card {
box-shadow: none;
border: 1px solid #ccc;
}
}
/* ===== ACCESSIBILITY ===== */
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
.reveal {
opacity: 1;
transform: none;
transition: none;
}
.btn {
transition: none;
}
}
# †Ñ