:root {
	--font-size: 1rem;
}
::marker {
	color: var(--contrast);
}
h1,h2,h3,h4,h5 {
	margin-bottom: 0.5rem;
}
@media(max-width:1200px) {
	.hide-mobile {
		display: none !important;
	}
}
@media(min-width:1200px) {
	.hide-desktop {
		display: none !important;
	}
}
/*header */
.header {
	background: var(--muted-border-color);
	padding: 1rem 0;
	border-bottom: solid 1px var(--muted-border-color);
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
}
.header-mobile-btn {
	width: 50px;
	height: 50px;
	padding: 0.4rem;
	margin: 0;
}
.header-mobile-btn img {
	width: 100%;
	height: 100%;
	filter: invert(100%)
}
.header-logo {
	margin: 0;
	padding: 0;
	font-size: 1.5rem;
	font-style: italic;
}
.header-grid {
	align-items: center;
}
.header-nav a {
	color: var(--contrast);
}
.header-nav .current a {
	color: #fff;
}
/*added dropdown */
.header-nav li {
	padding: 10px;
}
.header-nav .subMenu {
	position: absolute;
	background: var(--primary-hover);
	max-width: 200px;
	animation: fadeIn 250ms linear;
	border-radius: var(--border-radius);
	display: none;
	flex-direction: column;
	text-align: left;
	padding: 0 !important;
	margin-top: 10px;
	margin-left: 0 !important;
	color:#fff;
}
.header-nav .subMenu li {
	width: 100%;
	margin: 0;
}
.header-nav .subMenu li a {
	width: 100%;
	text-align: left;
	margin: 0;
	padding: 10px;
	color:#fff;
}
.subMenu a:hover {
	background: rgba(0, 0, 0, 0.2)
}
.subMenu li {
	margin: 0;
	padding: 0;
}
.subMenu a {
	margin: 0;
}
@media(max-width:1200px) {
	.header-nav .subMenu {
		position: relative;
		max-width: unset;
		width: 100% !important;
	}
}
@media(min-width:1200px) {
	.header-nav li:hover .subMenu {
		display: flex;
	}
}
@keyframesfadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}
/*end edit */
@media(min-width:1200px) {
	.header {
		padding: 3rem 0;
	}
}
@media(max-width:1200px) {
	.header-grid {
		flex-wrap: wrap;
	}
	.header-nav {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 0;
		margin-right: 0 !important;
		margin-left: 0 !important;
		margin-top: 20px;
	}
	.header-nav li {
		width: 100%;
		padding: 8px 0;
		margin: 0;
		display: flex;
		align-items: center;
		flex-wrap: wrap;
	}
	.header-nav a {
		width: 100%;
		text-align: left;
		padding: 15px;
		margin: 0;
	}
	.header-nav .wSub {
		display: flex;
		padding: 0;
	}
	.header-nav .wSub a {
		width: calc(90% - 12px);
	}
	.header-nav .wSub .showDropdown {
		width: 10%;
		display: flex;
		align-self: center;
		justify-content: center;
		align-items: stretch;
		padding: 14px;
		margin-left: 12px;
	}
	.header-nav a {
		padding: 8px;
	}
	.header-nav .wSub a[role="button"] {
		padding: 8px;
	}
	.header-nav a[role="button"] {
		margin-left: 0;
		margin-right: 0;
		padding: inherit;
		padding: 8px;
	}
}
/*content and aside */
.content {
	padding: 2rem 0;
	padding-bottom: 0;
}
.content-grid {
	display: grid;
	grid-column: 1fr;
	margin: 2rem 0;
	gap: 1.3rem;
}
@media(min-width:1200px) {
	.content-grid {
		grid-template-columns: 9fr 3fr;
	}
}
.content-sidebar ul::marker {
	color: #000;
}
.content-sidebar h2 {
	margin-bottom: 10px;
}
.content-title {
	padding-bottom: 1rem;
	border-bottom: solid 1px var(--muted-border-color);
}
.content-sidebar h2 {
	padding-bottom: 10px;
	border-bottom: solid 1px var(--muted-border-color);
	margin-bottom: 20px;
	display: block;
}
.content-sidebar ul {
	list-style-type: square !important;
	background: var(--primary);
	color: #fff;
	line-height: 1;
	border-radius: 5px;
	list-style-type: square;
}
@media(min-width:1200px) {
	.content-sidebar {
		margin-top: 2.7rem;
	}
}
.content-main img {
	margin-bottom: 1.3rem;
	border-radius: 0.2rem;
}
.content-main nav[aria-label="breadcrumb"] li {
	padding: 0 0.5rem;
}
.content-main nav[aria-label="breadcrumb"] a {
	color: var(--muted-color);
}
/*footer */
.footer-grid {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
@media(max-width:1200px) {
	.footer-grid {
		flex-direction: column;
	}
}
/*grid variant */
@media(min-width:1200px) {
	.content-grid-left {
		grid-template-columns: 3fr 9fr;
	}
	.content-grid-left .content-sidebar {
		order: 1;
	}
	.content-grid-left .content-main {
		order: 2;
	}
	.content-grid-nosidebar {
		grid-template-columns: 1fr;
	}
}
.content-grid-nosidebar .content-sidebar {
	display: none;
}


/* --- FIX DROPDOWN HIDING BEHIND HERO BANNER --- */

/* 1. Force the global navigation bar container to stay on the absolute front layer */
header, .header, .site-header, nav.nav, #nav-menu-container {
    position: relative !important;
    z-index: 999999 !important; /* Forces the entire menu layer to the absolute front */
}

/* 2. Target the specific dropdown list container (your daughter categories) */
nav.nav ul ul, .header-nav ul, .nav-menu-list ul, .nav ul ul {
    position: absolute !important;
    z-index: 1000000 !important; /* Maximum priority so 'Legacy Archive' is always visible */
    display: block;
}

/* 3. Push your custom hero banner container safely to a background layer */
.site-hero-banner, .custom-hero-banner, [class*="hero"], [class*="banner"] {
    position: relative !important;
    z-index: 1 !important; /* Drops the banner layer to the background */
}

/* --- RESPONSIVE MOBILE HERO BANNER SCALING --- */
@media screen and (max-width: 768px) {
    
    /* 1. Scale down the container height smoothly on mobile screens */
    .site-hero-banner, .custom-hero-banner, [class*="hero"], [class*="banner"] {
        min-height: 140px !important; /* Lowers the minimum height for phones */
        height: auto !important;
        background-attachment: scroll !important; /* Prevents mobile scroll distortion */
        background-position: center center !important;
    }
}

@media screen and (min-width: 769px) and (max-width: 1024px) {
    /* 2. Medium scale padding rule specifically for tablets */
    .site-hero-banner, .custom-hero-banner {
        min-height: 220px !important;
    }
}




/* ==========================================================================
   ROUTE: SPECIES PROFILES SECTION (MEDIUM COBALT BLUE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.species-profiles header, 
body.species-profiles .header {
    border-bottom: 4px solid #5C88D6 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.species-profiles main h1, 
body.species-profiles article h1, 
body.species-profiles #content h1,
body.species-profiles .container h1 {
    color: #5C88D6 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}



/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.species-profiles main h1::before, 
body.species-profiles article h1::before, 
body.species-profiles #content h1::before,
body.species-profiles .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #5C88D6 !important;


}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.species-profiles blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #D4E9FE !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.species-profiles #nav li.species-profiles a, 
body.species-profiles .navigation li.species-profiles a { 
    color: #5C88D6 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.species-profiles main a,
body.species-profiles article a,
body.species-profiles #content a,
body.species-profiles #sidebar a,
body.species-profiles .sidebar a,
body.species-profiles .entry-content a {
    color: #5C88D6 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.species-profiles main a:hover,
body.species-profiles article a:hover,
body.species-profiles #content a:hover,
body.species-profiles #sidebar a:hover,
body.species-profiles .sidebar a:hover,
body.species-profiles .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.species-profiles footer a,
body.species-profiles .footer a,
body.species-profiles #footer a {
    color: #5C88D6 !important;
}

/* 8. Footer Links Hover State */
body.species-profiles footer a:hover,
body.species-profiles .footer a:hover,
body.species-profiles #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.species-profiles footer a.blue-menu-btn,
body.species-profiles .footer a.blue-menu-btn,
body.species-profiles #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.species-profiles .grid-link-card .card-btn {
    color: #5C88D6 !important;
}
body.species-profiles .grid-link-card:hover {
    border-color: #5C88D6 !important;
}


/* ==========================================================================
   ROUTE: MALAWI GENUS SECTION (MEDIUM COBALT BLUE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.malawi-genus header, 
body.malawi-genus .header {
    border-bottom: 4px solid #5C88D6 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.malawi-genus main h1, 
body.malawi-genus article h1, 
body.malawi-genus #content h1,
body.malawi-genus .container h1 {
    color: #5C88D6 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}



/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.malawi-genus main h1::before, 
body.malawi-genus article h1::before, 
body.malawi-genus #content h1::before,
body.malawi-genus .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #5C88D6 !important;


}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.malawi-genus blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #D4E9FE !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.malawi-genus #nav li.species-profiles a, 
body.malawi-genus .navigation li.species-profiles a { 
    color: #5C88D6 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.malawi-genus main a,
body.malawi-genus article a,
body.malawi-genus #content a,
body.malawi-genus #sidebar a,
body.malawi-genus .sidebar a,
body.malawi-genus .entry-content a {
    color: #5C88D6 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.malawi-genus main a:hover,
body.malawi-genus article a:hover,
body.malawi-genus #content a:hover,
body.malawi-genus #sidebar a:hover,
body.malawi-genus .sidebar a:hover,
body.malawi-genus .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.malawi-genus footer a,
body.malawi-genus .footer a,
body.malawi-genus #footer a {
    color: #5C88D6 !important;
}

/* 8. Footer Links Hover State */
body.malawi-genus footer a:hover,
body.malawi-genus .footer a:hover,
body.malawi-genus #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.malawi-genus footer a.blue-menu-btn,
body.malawi-genus .footer a.blue-menu-btn,
body.malawi-genus #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.malawi-genus .grid-link-card .card-btn {
    color: #5C88D6 !important;
}
body.malawi-genus .grid-link-card:hover {
    border-color: #5C88D6 !important;
}

/* ==========================================================================
   ROUTE: TANGANYIKAN GENUS SECTION (MEDIUM COBALT BLUE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.tanganyikan-genus header, 
body.tanganyikan-genus .header {
    border-bottom: 4px solid #5C88D6 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.tanganyikan-genus main h1, 
body.tanganyikan-genus article h1, 
body.tanganyikan-genus #content h1,
body.tanganyikan-genus .container h1 {
    color: #5C88D6 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}



/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.tanganyikan-genus main h1::before, 
body.tanganyikan-genus article h1::before, 
body.tanganyikan-genus #content h1::before,
body.tanganyikan-genus .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #5C88D6 !important;


}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.tanganyikan-genus blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #D4E9FE !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.tanganyikan-genus #nav li.species-profiles a, 
body.tanganyikan-genus .navigation li.species-profiles a { 
    color: #5C88D6 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.tanganyikan-genus main a,
body.tanganyikan-genus article a,
body.tanganyikan-genus #content a,
body.tanganyikan-genus #sidebar a,
body.tanganyikan-genus .sidebar a,
body.tanganyikan-genus .entry-content a {
    color: #5C88D6 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.tanganyikan-genus main a:hover,
body.tanganyikan-genus article a:hover,
body.tanganyikan-genus #content a:hover,
body.tanganyikan-genus #sidebar a:hover,
body.tanganyikan-genus .sidebar a:hover,
body.tanganyikan-genus .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.tanganyikan-genus footer a,
body.tanganyikan-genus .footer a,
body.tanganyikan-genus #footer a {
    color: #5C88D6 !important;
}

/* 8. Footer Links Hover State */
body.tanganyikan-genus footer a:hover,
body.tanganyikan-genus .footer a:hover,
body.tanganyikan-genus #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.tanganyikan-genus footer a.blue-menu-btn,
body.tanganyikan-genus .footer a.blue-menu-btn,
body.tanganyikan-genus #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.tanganyikan-genus .grid-link-card .card-btn {
    color: #5C88D6 !important;
}
body.tanganyikan-genus .grid-link-card:hover {
    border-color: #5C88D6 !important;
}

/* ==========================================================================
   ROUTE: VICTORIAN GENUS SECTION (MEDIUM COBALT BLUE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.victorian-genus header, 
body.victorian-genus .header {
    border-bottom: 4px solid #5C88D6 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.victorian-genus main h1, 
body.victorian-genus article h1, 
body.victorian-genus #content h1,
body.victorian-genus .container h1 {
    color: #5C88D6 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}



/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.victorian-genus main h1::before, 
body.victorian-genus article h1::before, 
body.victorian-genus #content h1::before,
body.victorian-genus .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #5C88D6 !important;


}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.victorian-genus blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #D4E9FE !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.victorian-genus #nav li.species-profiles a, 
body.victorian-genus .navigation li.species-profiles a { 
    color: #5C88D6 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.victorian-genus main a,
body.victorian-genus article a,
body.victorian-genus #content a,
body.victorian-genus #sidebar a,
body.victorian-genus .sidebar a,
body.victorian-genus .entry-content a {
    color: #5C88D6 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.victorian-genus main a:hover,
body.victorian-genus article a:hover,
body.victorian-genus #content a:hover,
body.victorian-genus #sidebar a:hover,
body.victorian-genus .sidebar a:hover,
body.victorian-genus .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.victorian-genus footer a,
body.victorian-genus .footer a,
body.victorian-genus #footer a {
    color: #5C88D6 !important;
}

/* 8. Footer Links Hover State */
body.victorian-genus footer a:hover,
body.victorian-genus .footer a:hover,
body.victorian-genus #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.victorian-genus footer a.blue-menu-btn,
body.victorian-genus .footer a.blue-menu-btn,
body.victorian-genus #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.victorian-genus .grid-link-card .card-btn {
    color: #5C88D6 !important;
}
body.victorian-genus .grid-link-card:hover {
    border-color: #5C88D6 !important;
}

/* ==========================================================================
   ROUTE: THE 25 YEAR TAXONOMIC SHIFT (MEDIUM COBALT BLUE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.taxonomic-shift header, 
body.taxonomic-shift .header {
    border-bottom: 4px solid #5C88D6 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.taxonomic-shift main h1, 
body.taxonomic-shift article h1, 
body.taxonomic-shift #content h1,
body.taxonomic-shift .container h1 {
    color: #5C88D6 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}



/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.taxonomic-shift main h1::before, 
body.taxonomic-shift article h1::before, 
body.taxonomic-shift #content h1::before,
body.taxonomic-shift .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #5C88D6 !important;


}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.taxonomic-shift blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #D4E9FE !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.taxonomic-shift #nav li.species-profiles a, 
body.taxonomic-shift .navigation li.species-profiles a { 
    color: #5C88D6 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.taxonomic-shift main a,
body.taxonomic-shift article a,
body.taxonomic-shift #content a,
body.taxonomic-shift #sidebar a,
body.taxonomic-shift .sidebar a,
body.taxonomic-shift .entry-content a {
    color: #5C88D6 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.taxonomic-shift main a:hover,
body.taxonomic-shift article a:hover,
body.taxonomic-shift #content a:hover,
body.taxonomic-shift #sidebar a:hover,
body.taxonomic-shift .sidebar a:hover,
body.taxonomic-shift .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.taxonomic-shift footer a,
body.taxonomic-shift .footer a,
body.taxonomic-shift #footer a {
    color: #5C88D6 !important;
}

/* 8. Footer Links Hover State */
body.taxonomic-shift footer a:hover,
body.taxonomic-shift .footer a:hover,
body.taxonomic-shift #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.taxonomic-shift footer a.blue-menu-btn,
body.taxonomic-shift .footer a.blue-menu-btn,
body.taxonomic-shift #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.taxonomic-shift .grid-link-card .card-btn {
    color: #5C88D6 !important;
}
body.taxonomic-shift .grid-link-card:hover {
    border-color: #5C88D6 !important;
}


/* ==========================================================================
   ROUTE: THE AFRICAN GREAT LAKES SECTION (DARK TEAL)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.the-african-great-lakes header, 
body.the-african-great-lakes .header {
    border-bottom: 4px solid #008b8b !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.the-african-great-lakes main h1, 
body.the-african-great-lakes article h1, 
body.the-african-great-lakes #content h1,
body.the-african-great-lakes .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.the-african-great-lakes main h1::before, 
body.the-african-great-lakes article h1::before, 
body.the-african-great-lakes #content h1::before,
body.the-african-great-lakes .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #008b8b !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.the-african-great-lakes blockquote {
    border-left: 5px solid #5C88D6 !important;    
    background-color: #f0fafa !important;       
} 

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.the-african-great-lakes #nav li.the-african-great-lakes a, 
body.the-african-great-lakes .navigation li.the-african-great-lakes a { 
    color: #008b8b !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.the-african-great-lakes main a,
body.the-african-great-lakes article a,
body.the-african-great-lakes #content a,
body.the-african-great-lakes #sidebar a,
body.the-african-great-lakes .sidebar a,
body.the-african-great-lakes .entry-content a {
    color: #008b8b !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.the-african-great-lakes main a:hover,
body.the-african-great-lakes article a:hover,
body.the-african-great-lakes #content a:hover,
body.the-african-great-lakes #sidebar a:hover,
body.the-african-great-lakes .sidebar a:hover,
body.the-african-great-lakes .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.the-african-great-lakes footer a,
body.the-african-great-lakes .footer a,
body.the-african-great-lakes #footer a {
    color: #008b8b !important;
}

/* 8. Footer Links Hover State */
body.the-african-great-lakes footer a:hover,
body.the-african-great-lakes .footer a:hover,
body.the-african-great-lakes #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.the-african-great-lakes footer a.blue-menu-btn,
body.the-african-great-lakes .footer a.blue-menu-btn,
body.the-african-great-lakes #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.the-african-great-lakes .grid-link-card .card-btn {
    color: #008b8b !important;
}
body.the-african-great-lakes .grid-link-card:hover {
    border-color: #008b8b !important;
}

/* ==========================================================================
   ROUTE: LAKE MALAWI SECTION (DARK TEAL)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.lake-malawi header, 
body.lake-malawi .header {
    border-bottom: 4px solid #008b8b !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.lake-malawi main h1, 
body.lake-malawi article h1, 
body.lake-malawi #content h1,
body.lake-malawi .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.lake-malawi main h1::before, 
body.lake-malawi article h1::before, 
body.lake-malawi #content h1::before,
body.lake-malawi .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #008b8b !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.lake-malawi blockquote {
    border-left: 5px solid #008b8b !important;    
    background-color: #f0fafa !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.lake-malawi #nav li.lake-malawi a, 
body.lake-malawi .navigation li.lake-malawi a { 
    color: #008b8b !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.lake-malawi main a,
body.lake-malawi article a,
body.lake-malawi #content a,
body.lake-malawi #sidebar a,
body.lake-malawi .sidebar a,
body.lake-malawi .entry-content a {
    color: #008b8b !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.lake-malawi main a:hover,
body.lake-malawi article a:hover,
body.lake-malawi #content a:hover,
body.lake-malawi #sidebar a:hover,
body.lake-malawi .sidebar a:hover,
body.lake-malawi .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.lake-malawi footer a,
body.lake-malawi .footer a,
body.lake-malawi #footer a {
    color: #008b8b !important;
}

/* 8. Footer Links Hover State */
body.lake-malawi footer a:hover,
body.lake-malawi .footer a:hover,
body.lake-malawi #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.lake-malawi footer a.blue-menu-btn,
body.lake-malawi .footer a.blue-menu-btn,
body.lake-malawi #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.lake-malawi .grid-link-card .card-btn {
    color: #008b8b !important;
}
body.lake-malawi .grid-link-card:hover {
    border-color: #008b8b !important;
}


/* ==========================================================================
   ROUTE: LAKE TANGANYIKA SECTION (DARK TEAL)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.lake-tanganyika header, 
body.lake-tanganyika .header {
    border-bottom: 4px solid #008b8b !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.lake-tanganyika main h1, 
body.lake-tanganyika article h1, 
body.lake-tanganyika #content h1,
body.lake-tanganyika .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.lake-tanganyika main h1::before, 
body.lake-tanganyika article h1::before, 
body.lake-tanganyika #content h1::before,
body.lake-tanganyika .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #008b8b !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.lake-tanganyika blockquote {
    border-left: 5px solid #008b8b !important;    
    background-color: #f0fafa !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.lake-tanganyika #nav li.lake-tanganyika a, 
body.lake-tanganyika .navigation li.lake-tanganyika a { 
    color: #008b8b !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.lake-tanganyika main a,
body.lake-tanganyika article a,
body.lake-tanganyika #content a,
body.lake-tanganyika #sidebar a,
body.lake-tanganyika .sidebar a,
body.lake-tanganyika .entry-content a {
    color: #008b8b !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.lake-tanganyika main a:hover,
body.lake-tanganyika article a:hover,
body.lake-tanganyika #content a:hover,
body.lake-tanganyika #sidebar a:hover,
body.lake-tanganyika .sidebar a:hover,
body.lake-tanganyika .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.lake-tanganyika footer a,
body.lake-tanganyika .footer a,
body.lake-tanganyika #footer a {
    color: #008b8b !important;
}

/* 8. Footer Links Hover State */
body.lake-tanganyika footer a:hover,
body.lake-tanganyika .footer a:hover,
body.lake-tanganyika #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.lake-tanganyika footer a.blue-menu-btn,
body.lake-tanganyika .footer a.blue-menu-btn,
body.lake-tanganyika #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.lake-tanganyika .grid-link-card .card-btn {
    color: #008b8b !important;
}
body.lake-tanganyika .grid-link-card:hover {
    border-color: #008b8b !important;
}

/* ==========================================================================
   ROUTE: LAKE VICTORIA SECTION (DARK TEAL)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.lake-victoria header, 
body.lake-victoria .header {
    border-bottom: 4px solid #008b8b !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.lake-victoria main h1, 
body.lake-victoria article h1, 
body.lake-victoria #content h1,
body.lake-victoria .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.lake-victoria main h1::before, 
body.lake-victoria article h1::before, 
body.lake-victoria #content h1::before,
body.lake-victoria .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #008b8b !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.lake-victoria blockquote {
    border-left: 5px solid #008b8b !important;    
    background-color: #f0fafa !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.lake-victoria #nav li.lake-victoria a, 
body.lake-victoria .navigation li.lake-victoria a { 
    color: #008b8b !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.lake-victoria main a,
body.lake-victoria article a,
body.lake-victoria #content a,
body.lake-victoria #sidebar a,
body.lake-victoria .sidebar a,
body.lake-victoria .entry-content a {
    color: #008b8b !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.lake-victoria main a:hover,
body.lake-victoria article a:hover,
body.lake-victoria #content a:hover,
body.lake-victoria #sidebar a:hover,
body.lake-victoria .sidebar a:hover,
body.lake-victoria .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.lake-victoria footer a,
body.lake-victoria .footer a,
body.lake-victoria #footer a {
    color: #008b8b !important;
}

/* 8. Footer Links Hover State */
body.lake-victoria footer a:hover,
body.lake-victoria .footer a:hover,
body.lake-victoria #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.lake-victoria footer a.blue-menu-btn,
body.lake-victoria .footer a.blue-menu-btn,
body.lake-victoria #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.lake-victoria .grid-link-card .card-btn {
    color: #008b8b !important;
}
body.lake-victoria .grid-link-card:hover {
    border-color: #008b8b !important;
}

/* ==========================================================================
   ROUTE: LAKES TODAY SECTION (DARK TEAL)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.the-great-lakes-today header, 
body.the-great-lakes-today .header {
    border-bottom: 4px solid #008b8b !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.the-great-lakes-today main h1, 
body.the-great-lakes-today article h1, 
body.the-great-lakes-today #content h1,
body.the-great-lakes-todaya .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.the-great-lakes-today main h1::before, 
body.the-great-lakes-today article h1::before, 
body.the-great-lakes-today #content h1::before,
body.the-great-lakes-today .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #008b8b !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.the-great-lakes-today blockquote {
    border-left: 5px solid #008b8b !important;    
    background-color: #f0fafa !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.the-great-lakes-today #nav li.lake-victoria a, 
body.the-great-lakes-today .navigation li.lake-victoria a { 
    color: #008b8b !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.the-great-lakes-today main a,
body.the-great-lakes-today article a,
body.the-great-lakes-today #content a,
body.the-great-lakes-today #sidebar a,
body.the-great-lakes-today .sidebar a,
body.the-great-lakes-today .entry-content a {
    color: #008b8b !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.the-great-lakes-today main a:hover,
body.the-great-lakes-today article a:hover,
body.the-great-lakes-today #content a:hover,
body.the-great-lakes-today #sidebar a:hover,
body.the-great-lakes-today .sidebar a:hover,
body.the-great-lakes-today .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.the-great-lakes-today footer a,
body.the-great-lakes-today .footer a,
body.the-great-lakes-today #footer a {
    color: #008b8b !important;
}

/* 8. Footer Links Hover State */
body.the-great-lakes-today footer a:hover,
body.the-great-lakes-today .footer a:hover,
body.the-great-lakes-today #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.the-great-lakes-today footer a.blue-menu-btn,
body.the-great-lakes-today .footer a.blue-menu-btn,
body.the-great-lakes-today #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.the-great-lakes-today .grid-link-card .card-btn {
    color: #008b8b !important;
}
body.the-great-lakes-today .grid-link-card:hover {
    border-color: #008b8b !important;
}

/* ==========================================================================
   ROUTE: CICHLID GROUPS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.cichlid-groups header, 
body.cichlid-groups .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.cichlid-groups main h1, 
body.cichlid-groups article h1, 
body.cichlid-groups #content h1,
body.cichlid-groups .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.cichlid-groups main h1::before, 
body.cichlid-groups article h1::before, 
body.cichlid-groups #content h1::before,
body.cichlid-groups .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.cichlid-groups blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.cichlid-groups #nav li.cichlid-groups a, 
body.cichlid-groups .navigation li.cichlid-groups a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.cichlid-groups main a,
body.cichlid-groups article a,
body.cichlid-groups #content a,
body.cichlid-groups #sidebar a,
body.cichlid-groups .sidebar a,
body.cichlid-groups .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.cichlid-groups main a:hover,
body.cichlid-groups article a:hover,
body.cichlid-groups #content a:hover,
body.cichlid-groups #sidebar a:hover,
body.cichlid-groups .sidebar a:hover,
body.cichlid-groups .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.cichlid-groups footer a,
body.cichlid-groups .footer a,
body.cichlid-groups #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.cichlid-groups footer a:hover,
body.cichlid-groups .footer a:hover,
body.cichlid-groups #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.cichlid-groups footer a.blue-menu-btn,
body.cichlid-groups .footer a.blue-menu-btn,
body.cichlid-groups #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.cichlid-groups .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.cichlid-groups .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: HAPS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.haps header, 
body.haps .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.haps main h1, 
body.haps article h1, 
body.haps #content h1,
body.haps .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.haps main h1::before, 
body.haps article h1::before, 
body.haps #content h1::before,
body.haps .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.haps blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.haps #nav li.haps a, 
body.haps .navigation li.haps a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.haps main a,
body.haps article a,
body.haps #content a,
body.haps #sidebar a,
body.haps .sidebar a,
body.haps .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.haps main a:hover,
body.haps article a:hover,
body.haps #content a:hover,
body.haps #sidebar a:hover,
body.haps .sidebar a:hover,
body.haps .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.haps footer a,
body.haps .footer a,
body.haps #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.haps footer a:hover,
body.haps .footer a:hover,
body.haps #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.haps footer a.blue-menu-btn,
body.haps .footer a.blue-menu-btn,
body.haps #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.haps .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.haps .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: MBUNA SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.mbuna header, 
body.mbuna .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.mbuna main h1, 
body.mbuna article h1, 
body.mbuna #content h1,
body.mbuna .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.mbuna main h1::before, 
body.mbuna article h1::before, 
body.mbuna #content h1::before,
body.mbuna .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.mbuna blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.mbuna #nav li.mbuna a, 
body.mbuna .navigation li.mbuna a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.mbuna main a,
body.mbuna article a,
body.mbuna #content a,
body.mbuna #sidebar a,
body.mbuna .sidebar a,
body.mbuna .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.mbuna main a:hover,
body.mbuna article a:hover,
body.mbuna #content a:hover,
body.mbuna #sidebar a:hover,
body.mbuna .sidebar a:hover,
body.mbuna .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.mbuna footer a,
body.mbuna .footer a,
body.mbuna #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.mbuna footer a:hover,
body.mbuna .footer a:hover,
body.mbuna #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.mbuna footer a.blue-menu-btn,
body.mbuna .footer a.blue-menu-btn,
body.mbuna #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.mbuna .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.mbuna .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: PEACOCK SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.peacock header, 
body.peacock .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.peacock main h1, 
body.peacock article h1, 
body.peacock #content h1,
body.peacock .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.peacock main h1::before, 
body.peacock article h1::before, 
body.peacock #content h1::before,
body.peacock .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.peacock blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.peacock #nav li.peacock a, 
body.peacock .navigation li.peacock a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.peacock main a,
body.peacock article a,
body.peacock #content a,
body.peacock #sidebar a,
body.peacock .sidebar a,
body.peacock .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.peacock main a:hover,
body.peacock article a:hover,
body.peacock #content a:hover,
body.peacock #sidebar a:hover,
body.peacock .sidebar a:hover,
body.peacock .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.peacock footer a,
body.peacock .footer a,
body.peacock #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.peacock footer a:hover,
body.peacock .footer a:hover,
body.peacock #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.peacock footer a.blue-menu-btn,
body.peacock .footer a.blue-menu-btn,
body.peacock #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.peacock .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.peacock .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: SHELL DWELLERS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.shell-dwellers header, 
body.shell-dwellers .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.shell-dwellers main h1, 
body.shell-dwellers article h1, 
body.shell-dwellers #content h1,
body.shell-dwellers .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.shell-dwellers main h1::before, 
body.shell-dwellers article h1::before, 
body.shell-dwellers #content h1::before,
body.shell-dwellers .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.shell-dwellers blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.shell-dwellers #nav li.shell-dwellers a, 
body.shell-dwellers .navigation li.shell-dwellers a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.shell-dwellers main a,
body.shell-dwellers article a,
body.shell-dwellers #content a,
body.shell-dwellers #sidebar a,
body.shell-dwellers .sidebar a,
body.shell-dwellers .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.shell-dwellers main a:hover,
body.shell-dwellers article a:hover,
body.shell-dwellers #content a:hover,
body.shell-dwellers #sidebar a:hover,
body.shell-dwellers .sidebar a:hover,
body.shell-dwellers .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.shell-dwellers footer a,
body.shell-dwellers .footer a,
body.shell-dwellers #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.shell-dwellers footer a:hover,
body.shell-dwellers .footer a:hover,
body.shell-dwellers #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.shell-dwellers footer a.blue-menu-btn,
body.shell-dwellers .footer a.blue-menu-btn,
body.shell-dwellers #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.shell-dwellers .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.shell-dwellers .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: TILAPIINE SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.tilapiine header, 
body.tilapiine .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.tilapiine main h1, 
body.tilapiine article h1, 
body.tilapiine #content h1,
body.tilapiine .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.tilapiine main h1::before, 
body.tilapiine article h1::before, 
body.tilapiine #content h1::before,
body.tilapiine .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.tilapiine blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.tilapiine #nav li.tilapiine a, 
body.tilapiine .navigation li.tilapiine a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.tilapiine main a,
body.tilapiine article a,
body.tilapiine #content a,
body.tilapiine #sidebar a,
body.tilapiine .sidebar a,
body.tilapiine .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.tilapiine main a:hover,
body.tilapiine article a:hover,
body.tilapiine #content a:hover,
body.tilapiine #sidebar a:hover,
body.tilapiine .sidebar a:hover,
body.tilapiine .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.tilapiine footer a,
body.tilapiine .footer a,
body.tilapiine #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.tilapiine footer a:hover,
body.tilapiine .footer a:hover,
body.tilapiine #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.tilapiine footer a.blue-menu-btn,
body.tilapiine .footer a.blue-menu-btn,
body.tilapiine #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.tilapiine .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.tilapiine .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: TROPHEUS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.tropheus header, 
body.tropheus .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.tropheus main h1, 
body.tropheus article h1, 
body.tropheus #content h1,
body.tropheus .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.tropheus main h1::before, 
body.tropheus article h1::before, 
body.tropheus #content h1::before,
body.tropheus .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.tropheus blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.tropheus #nav li.tropheus a, 
body.tropheus .navigation li.tropheus a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.tropheus main a,
body.tropheus article a,
body.tropheus #content a,
body.tropheus #sidebar a,
body.tropheus .sidebar a,
body.tropheus .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.tropheus main a:hover,
body.tropheus article a:hover,
body.tropheus #content a:hover,
body.tropheus #sidebar a:hover,
body.tropheus .sidebar a:hover,
body.tropheus .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.tropheus footer a,
body.tropheus .footer a,
body.tropheus #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.tropheus footer a:hover,
body.tropheus .footer a:hover,
body.tropheus #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.tropheus footer a.blue-menu-btn,
body.tropheus .footer a.blue-menu-btn,
body.tropheus #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.tropheus .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.tropheus .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: SYNODONTIS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.synodontis-catfish header, 
body.synodontis-catfish .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.synodontis-catfish main h1, 
body.synodontis-catfish article h1, 
body.synodontis-catfish #content h1,
body.synodontis-catfish .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.synodontis-catfish main h1::before, 
body.synodontis-catfish article h1::before, 
body.synodontis-catfish #content h1::before,
body.synodontis-catfish .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.synodontis-catfish blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.synodontis-catfish #nav li.synodontis-catfish a, 
body.synodontis-catfish .navigation li.synodontis-catfish a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.synodontis-catfish main a,
body.synodontis-catfish article a,
body.synodontis-catfish #content a,
body.synodontis-catfish #sidebar a,
body.synodontis-catfish .sidebar a,
body.synodontis-catfish .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.synodontis-catfish main a:hover,
body.synodontis-catfish article a:hover,
body.synodontis-catfish #content a:hover,
body.synodontis-catfish #sidebar a:hover,
body.synodontis-catfish .sidebar a:hover,
body.synodontis-catfish .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.synodontis-catfish footer a,
body.synodontis-catfish .footer a,
body.synodontis-catfish #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.synodontis-catfish footer a:hover,
body.synodontis-catfish .footer a:hover,
body.synodontis-catfish #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.synodontis-catfish footer a.blue-menu-btn,
body.synodontis-catfish .footer a.blue-menu-btn,
body.synodontis-catfish #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.synodontis-catfish .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.synodontis-catfish .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}


/* ==========================================================================
   ROUTE: CARE GUIDES SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.care-guides header, 
body.care-guides .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.care-guides main h1, 
body.care-guides article h1, 
body.care-guides #content h1,
body.care-guides .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.care-guides main h1::before, 
body.care-guides article h1::before, 
body.care-guides #content h1::before,
body.care-guides .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.care-guides blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.care-guides #nav li.care-guides a, 
body.care-guides .navigation li.care-guides a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.care-guides main a,
body.care-guides article a,
body.care-guides #content a,
body.care-guides #sidebar a,
body.care-guides .sidebar a,
body.care-guides .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.care-guides main a:hover,
body.care-guides article a:hover,
body.care-guides #content a:hover,
body.care-guides #sidebar a:hover,
body.care-guides .sidebar a:hover,
body.care-guides .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.care-guides footer a,
body.care-guides .footer a,
body.care-guides #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.care-guides footer a:hover,
body.care-guides .footer a:hover,
body.care-guides #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.care-guides footer a.blue-menu-btn,
body.care-guides .footer a.blue-menu-btn,
body.care-guides #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.care-guides .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.care-guides .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: AQUARIUMM SETUP SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.care-guides header, 
body.care-guides .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.aquarium-setup main h1, 
body.aquarium-setup article h1, 
body.aquarium-setup #content h1,
body.aquarium-setup .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.aquarium-setup main h1::before, 
body.aquarium-setup article h1::before, 
body.aquarium-setup #content h1::before,
body.aquarium-setup .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.aquarium-setup blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.aquarium-setup #nav li.aquarium-setup a, 
body.aquarium-setup .navigation li.aquarium-setup a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.aquarium-setup main a,
body.aquarium-setup article a,
body.aquarium-setup #content a,
body.aquarium-setup #sidebar a,
body.aquarium-setup .sidebar a,
body.aquarium-setup .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.aquarium-setup main a:hover,
body.aquarium-setup article a:hover,
body.aquarium-setup #content a:hover,
body.aquarium-setup #sidebar a:hover,
body.aquarium-setup .sidebar a:hover,
body.aquarium-setup .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.aquarium-setup footer a,
body.aquarium-setup .footer a,
body.aquarium-setup #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.aquarium-setup footer a:hover,
body.aquarium-setup .footer a:hover,
body.aquarium-setup #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.aquarium-setup footer a.blue-menu-btn,
body.aquarium-setup .footer a.blue-menu-btn,
body.aquarium-setup #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.aquarium-setup .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.aquarium-setup .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: COMPATIBILITY SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.compatibility header, 
body.compatibility .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.compatibility main h1, 
body.compatibility article h1, 
body.compatibility #content h1,
body.compatibility .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.compatibility main h1::before, 
body.compatibility article h1::before, 
body.compatibility #content h1::before,
body.compatibility .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.compatibility blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.compatibility #nav li.compatibility a, 
body.compatibility .navigation li.compatibility a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.compatibility main a,
body.compatibility article a,
body.compatibility #content a,
body.compatibility #sidebar a,
body.compatibility .sidebar a,
body.compatibility .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.compatibility main a:hover,
body.compatibility article a:hover,
body.compatibility #content a:hover,
body.compatibility #sidebar a:hover,
body.compatibility .sidebar a:hover,
body.compatibility .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.compatibility footer a,
body.compatibility .footer a,
body.compatibility #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.compatibility footer a:hover,
body.compatibility .footer a:hover,
body.compatibility #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.compatibility footer a.blue-menu-btn,
body.compatibility .footer a.blue-menu-btn,
body.compatibility #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.compatibility .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.compatibility .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: DISEASE AND HEALTH SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.diseases-health header, 
body.diseases-health .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.diseases-health main h1, 
body.diseases-health article h1, 
body.diseases-health #content h1,
body.diseases-health .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.diseases-health main h1::before, 
body.diseases-health article h1::before, 
body.diseases-health #content h1::before,
body.diseases-health .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.diseases-health blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.diseases-health #nav li.diseases-health a, 
body.diseases-health .navigation li.diseases-health a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.diseases-health main a,
body.diseases-health article a,
body.diseases-health #content a,
body.diseases-health #sidebar a,
body.diseases-health .sidebar a,
body.diseases-health .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.diseases-health main a:hover,
body.diseases-health article a:hover,
body.diseases-health #content a:hover,
body.diseases-health #sidebar a:hover,
body.diseases-health .sidebar a:hover,
body.diseases-health .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.diseases-health footer a,
body.diseases-health .footer a,
body.diseases-health #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.diseases-health footer a:hover,
body.diseases-health .footer a:hover,
body.diseases-health #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.diseases-health footer a.blue-menu-btn,
body.diseases-health .footer a.blue-menu-btn,
body.diseases-health #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.diseases-health .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.diseases-health .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: NUTRITION FEEDING SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.nutrition-feeding header, 
body.nutrition-feeding .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.nutrition-feeding main h1, 
body.nutrition-feeding article h1, 
body.nutrition-feeding #content h1,
body.nutrition-feeding .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.nutrition-feeding main h1::before, 
body.nutrition-feeding article h1::before, 
body.nutrition-feeding #content h1::before,
body.nutrition-feeding .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.nutrition-feeding blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.nutrition-feeding #nav li.nutrition-feeding a, 
body.nutrition-feeding .navigation li.nutrition-feeding a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.nutrition-feeding main a,
body.nutrition-feeding article a,
body.nutrition-feeding #content a,
body.nutrition-feeding #sidebar a,
body.nutrition-feeding .sidebar a,
body.nutrition-feeding .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.nutrition-feeding main a:hover,
body.nutrition-feeding article a:hover,
body.nutrition-feeding #content a:hover,
body.nutrition-feeding #sidebar a:hover,
body.nutrition-feeding .sidebar a:hover,
body.nutrition-feeding .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.nutrition-feeding footer a,
body.nutrition-feeding .footer a,
body.nutrition-feeding #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.nutrition-feeding footer a:hover,
body.nutrition-feeding .footer a:hover,
body.nutrition-feeding #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.nutrition-feeding footer a.blue-menu-btn,
body.nutrition-feeding .footer a.blue-menu-btn,
body.nutrition-feeding #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.nutrition-feeding .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.nutrition-feeding .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: PLANTS SECTION (DUSTY PINK / ROSE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.plants header, 
body.plants .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.plants main h1, 
body.plants article h1, 
body.plants #content h1,
body.plants .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.plants main h1::before, 
body.plants article h1::before, 
body.plants #content h1::before,
body.plants .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.plants blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.plants #nav li.plants a, 
body.plants .navigation li.plants a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.plants main a,
body.plants article a,
body.plants #content a,
body.plants #sidebar a,
body.plants .sidebar a,
body.plants .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.plants main a:hover,
body.plants article a:hover,
body.plants #content a:hover,
body.plants #sidebar a:hover,
body.plants .sidebar a:hover,
body.plants .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.plants footer a,
body.plants .footer a,
body.plants #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.plants footer a:hover,
body.plants .footer a:hover,
body.plants #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.plants footer a.blue-menu-btn,
body.plants .footer a.blue-menu-btn,
body.plants-health #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.plants .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.plants .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: AQUASCAPING SECTION (DUSTY PINK / ROSE)
   ========================================================================== */
/* 1. Horizontal Border Bar Under Header */
body.aquascaping header, 
body.aquascaping .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.aquascaping main h1, 
body.aquascaping article h1, 
body.aquascaping #content h1,
body.aquascaping .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.aquascaping main h1::before, 
body.aquascaping article h1::before, 
body.aquascaping #content h1::before,
body.aquascaping .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.aquascaping blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.aquascaping #nav li.aquascaping a, 
body.aquascaping .navigation li.aquascaping a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.aquascaping main a,
body.aquascaping article a,
body.aquascaping #content a,
body.aquascaping #sidebar a,
body.aquascaping .sidebar a,
body.aquascaping .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.aquascaping main a:hover,
body.aquascaping article a:hover,
body.aquascaping #content a:hover,
body.aquascaping #sidebar a:hover,
body.aquascaping .sidebar a:hover,
body.aquascaping .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.aquascaping footer a,
body.aquascaping .footer a,
body.aquascaping #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.aquascaping footer a:hover,
body.aquascaping .footer a:hover,
body.aquascaping #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.aquascaping footer a.blue-menu-btn,
body.aquascaping .footer a.blue-menu-btn,
body.aquascaping #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.aquascaping .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.aquascaping .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: BREEDING SECTION (DUSTY PINK / ROSE)
   ========================================================================== */
/* 1. Horizontal Border Bar Under Header */
body.breeding header, 
body.breeding .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.breeding main h1, 
body.breeding article h1, 
body.breeding #content h1,
body.breeding .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.breeding main h1::before, 
body.breeding article h1::before, 
body.breeding #content h1::before,
body.breeding .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.breeding blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.breeding #nav li.breeding a, 
body.breeding .navigation li.breeding a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.breeding main a,
body.breeding article a,
body.breeding #content a,
body.breeding #sidebar a,
body.breeding .sidebar a,
body.breeding .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.breeding main a:hover,
body.breeding article a:hover,
body.breeding #content a:hover,
body.breeding #sidebar a:hover,
body.breeding .sidebar a:hover,
body.breeding .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.breeding footer a,
body.breeding .footer a,
body.breeding #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.breeding footer a:hover,
body.breeding .footer a:hover,
body.breeding #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.breeding footer a.blue-menu-btn,
body.breeding .footer a.blue-menu-btn,
body.breeding #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.breeding .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.breeding .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: MAINTENANCE SECTION (DUSTY PINK / ROSE)
   ========================================================================== */
/* 1. Horizontal Border Bar Under Header */
body.maintenance header, 
body.maintenance .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.maintenance main h1, 
body.maintenance article h1, 
body.maintenance #content h1,
body.maintenance .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.maintenance main h1::before, 
body.maintenance article h1::before, 
body.maintenance #content h1::before,
body.maintenance .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.maintenance blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.maintenance #nav li.maintenance a, 
body.maintenance .navigation li.maintenance a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.maintenance main a,
body.maintenance article a,
body.maintenance #content a,
body.maintenance #sidebar a,
body.maintenance .sidebar a,
body.maintenance .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.maintenance main a:hover,
body.maintenance article a:hover,
body.maintenance #content a:hover,
body.maintenance #sidebar a:hover,
body.maintenance .sidebar a:hover,
body.maintenance .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.maintenance footer a,
body.maintenance .footer a,
body.maintenance #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.maintenance footer a:hover,
body.maintenance .footer a:hover,
body.maintenance #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.maintenance footer a.blue-menu-btn,
body.maintenance .footer a.blue-menu-btn,
body.maintenance #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.maintenance .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.maintenance .grid-link-card:hover {
    border-color: #E6A4BB !important;
}

/* ==========================================================================
   ROUTE: WATER CHEMISTRY SECTION (DUSTY PINK / ROSE)
   ========================================================================== */
/* 1. Horizontal Border Bar Under Header */
body.water-chemistry header, 
body.water-chemistry .header {
    border-bottom: 4px solid #E6A4BB !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.water-chemistry main h1, 
body.water-chemistry article h1, 
body.water-chemistry #content h1,
body.water-chemistry .container h1 {
    color: #E8B8C8 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.water-chemistry main h1::before, 
body.water-chemistry article h1::before, 
body.water-chemistry #content h1::before,
body.water-chemistry .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #E6A4BB !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.water-chemistry blockquote {
    border-left: 5px solid #E6A4BB !important;    
    background-color: #FFF1F1 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.water-chemistry #nav li.water-chemistry a, 
body.water-chemistry .navigation li.water-chemistry a { 
    color: #E6A4BB !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.water-chemistry main a,
body.water-chemistry article a,
body.water-chemistry #content a,
body.water-chemistry #sidebar a,
body.water-chemistry .sidebar a,
body.water-chemistry .entry-content a {
    color: #E6A4BB !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.water-chemistry main a:hover,
body.water-chemistry article a:hover,
body.water-chemistry #content a:hover,
body.water-chemistry #sidebar a:hover,
body.water-chemistry .sidebar a:hover,
body.mwater-chemistry .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.water-chemistry footer a,
body.water-chemistry .footer a,
body.water-chemistry #footer a {
    color: #E6A4BB !important;
}

/* 8. Footer Links Hover State */
body.water-chemistry footer a:hover,
body.water-chemistry .footer a:hover,
body.water-chemistry #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.water-chemistry footer a.blue-menu-btn,
body.water-chemistry .footer a.blue-menu-btn,
body.water-chemistry #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.water-chemistry .grid-link-card .card-btn {
    color: #E6A4BB !important;
}
body.water-chemistry .grid-link-card:hover {
    border-color: #E6A4BB !important;
}






/* ==========================================================================
   ROUTE: TANGANYIKAN CICHLIDS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.tanganyikan header, 
body.tanganyikan .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.tanganyikan main h1, 
body.tanganyikan article h1, 
body.tanganyikan #content h1,
body.tanganyikan .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.tanganyikan main h1::before, 
body.tanganyikan article h1::before, 
body.tanganyikan #content h1::before,
body.tanganyikan .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.tanganyikan blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.tanganyikan #nav li.tanganyikan a, 
body.tanganyikan .navigation li.tanganyikan a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.tanganyikan main a,
body.tanganyikan article a,
body.tanganyikan #content a,
body.tanganyikan #sidebar a,
body.tanganyikan .sidebar a,
body.tanganyikan .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.tanganyikan main a:hover,
body.tanganyikan article a:hover,
body.tanganyikan #content a:hover,
body.tanganyikan #sidebar a:hover,
body.tanganyikan .sidebar a:hover,
body.tanganyikan .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.tanganyikan footer a,
body.tanganyikan .footer a,
body.tanganyikan #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.tanganyikan footer a:hover,
body.tanganyikan .footer a:hover,
body.tanganyikan #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.tanganyikan footer a.blue-menu-btn,
body.tanganyikan .footer a.blue-menu-btn,
body.tanganyikan #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.tanganyikan .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.tanganyikan .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}

/* ==========================================================================
   ROUTE: VICTORIAN CICHLIDS SECTION (LILAC / PURPLE)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.victorian header, 
body.victorian .header {
    border-bottom: 4px solid #9C7CC1 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.victorian main h1, 
body.victorian article h1, 
body.victorian #content h1,
body.victorian .container h1 {
    color: #9C7CC1 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.victorian main h1::before, 
body.victorian article h1::before, 
body.victorian #content h1::before,
body.victorian .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #9C7CC1 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.victorian blockquote {
    border-left: 5px solid #9C7CC1 !important;    
    background-color: #E8E8E8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.victorian #nav li.victorian a, 
body.victorian .navigation li.victorian a { 
    color: #9C7CC1 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.victorian main a,
body.victorian article a,
body.victorian #content a,
body.victorian #sidebar a,
body.victorian .sidebar a,
body.victorian .entry-content a {
    color: #9C7CC1 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.victorian main a:hover,
body.victorian article a:hover,
body.victorian #content a:hover,
body.victorian #sidebar a:hover,
body.victorian .sidebar a:hover,
body.victorian .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.victorian footer a,
body.victorian .footer a,
body.victorian #footer a {
    color: #9C7CC1 !important;
}

/* 8. Footer Links Hover State */
body.victorian footer a:hover,
body.victorian .footer a:hover,
body.victorian #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.victorian footer a.blue-menu-btn,
body.victorian .footer a.blue-menu-btn,
body.victorian #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.victorian .grid-link-card .card-btn {
    color: #9C7CC1 !important;
}
body.victorian .grid-link-card:hover {
    border-color: #9C7CC1 !important;
}






/* ==========================================================================
   ROUTE: LEARNING CENTER SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.learning-centre header, 
body.learning-centre .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.learning-centre main h1, 
body.learning-centre article h1, 
body.learning-centre #content h1,
body.learning-centre .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.learning-centre main h1::before, 
body.learning-centre article h1::before, 
body.learning-centre #content h1::before,
body.learning-centre .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.learning-centre blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #DBE8C5 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.learning-centre #nav li.learning-center a, 
body.learning-centre .navigation li.learning-center a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.learning-centre main a,
body.learning-centre article a,
body.learning-centre #content a,
body.learning-centre #sidebar a,
body.learning-centre .sidebar a,
body.learning-centre .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.learning-centre main a:hover,
body.learning-centre article a:hover,
body.learning-centre #content a:hover,
body.learning-centre #sidebar a:hover,
body.learning-centre .sidebar a:hover,
body.learning-centre .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.learning-centre footer a,
body.learning-centre .footer a,
body.learning-centre #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.learning-centre footer a:hover,
body.learning-centre .footer a:hover,
body.learning-centre #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.learning-centre footer a.blue-menu-btn,
body.learning-centre .footer a.blue-menu-btn,
body.learning-centre #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.learning-centre .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.learning-centre .grid-link-card:hover {
    border-color: #8fc951 !important;
}


/* ==========================================================================
   ROUTE: TANK VOLUME CALCULATOR SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.tank-volume-calculator header, 
body.tank-volume-calculator .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.tank-volume-calculator main h1, 
body.tank-volume-calculator article h1, 
body.tank-volume-calculator #content h1,
body.tank-volume-calculator .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.tank-volume-calculator main h1::before, 
body.tank-volume-calculator article h1::before, 
body.tank-volume-calculator #content h1::before,
body.tank-volume-calculator .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.tank-volume-calculator blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #e8f4ea !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.tank-volume-calculator #nav li.tank-volume-calculator a, 
body.tank-volume-calculator .navigation li.tank-volume-calculator a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.tank-volume-calculator main a,
body.tank-volume-calculator article a,
body.tank-volume-calculator #content a,
body.tank-volume-calculator #sidebar a,
body.tank-volume-calculator .sidebar a,
body.tank-volume-calculator .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.tank-volume-calculator main a:hover,
body.tank-volume-calculator article a:hover,
body.tank-volume-calculator #content a:hover,
body.tank-volume-calculator #sidebar a:hover,
body.tank-volume-calculator .sidebar a:hover,
body.tank-volume-calculator .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.tank-volume-calculator footer a,
body.tank-volume-calculator .footer a,
body.tank-volume-calculator #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.tank-volume-calculator footer a:hover,
body.tank-volume-calculator .footer a:hover,
body.tank-volume-calculator #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.tank-volume-calculator footer a.blue-menu-btn,
body.tank-volume-calculator .footer a.blue-menu-btn,
body.tank-volume-calculator #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.tank-volume-calculator .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.tank-volume-calculator .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: NEW KEEPERS JOURNAL SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.new-keepers-journal header, 
body.new-keepers-journal .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.new-keepers-journal main h1, 
body.new-keepers-journal article h1, 
body.new-keepers-journal #content h1,
body.new-keepers-journal .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.new-keepers-journal main h1::before, 
body.new-keepers-journal article h1::before, 
body.new-keepers-journal #content h1::before,
body.new-keepers-journal .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.new-keepers-journal blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #ccffcc !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.new-keepers-journal #nav li.new-keepers-journal a, 
body.new-keepers-journal .navigation li.new-keepers-journal a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.new-keepers-journal main a,
body.new-keepers-journal article a,
body.new-keepers-journal #content a,
body.new-keepers-journal #sidebar a,
body.new-keepers-journal .sidebar a,
body.new-keepers-journal .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.new-keepers-journal main a:hover,
body.new-keepers-journal article a:hover,
body.new-keepers-journal #content a:hover,
body.new-keepers-journal #sidebar a:hover,
body.new-keepers-journal .sidebar a:hover,
body.new-keepers-journal .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.new-keepers-journal footer a,
body.new-keepers-journal .footer a,
body.new-keepers-journal #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.new-keepers-journal footer a:hover,
body.new-keepers-journal .footer a:hover,
body.new-keepers-journal #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.new-keepers-journal footer a.blue-menu-btn,
body.new-keepers-journal .footer a.blue-menu-btn,
body.new-keepers-journal #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.new-keepers-journal .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.new-keepers-journal .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: AQUARIUM SCIENCE SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.aquarium-science header, 
body.aquarium-science .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.aquarium-science main h1, 
body.aquarium-science article h1, 
body.aquarium-science #content h1,
body.aquarium-science .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.aquarium-science main h1::before, 
body.aquarium-science article h1::before, 
body.aquarium-science #content h1::before,
body.aquarium-science .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.aquarium-science blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.aquarium-science #nav li.aquarium-science a, 
body.aquarium-science .navigation li.aquarium-science a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.aquarium-science main a,
body.aquarium-science article a,
body.aquarium-science #content a,
body.aquarium-science #sidebar a,
body.aquarium-science .sidebar a,
body.aquarium-science .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.aquarium-science main a:hover,
body.aquarium-science article a:hover,
body.aquarium-science #content a:hover,
body.aquarium-science #sidebar a:hover,
body.aquarium-science .sidebar a:hover,
body.aquarium-science .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.aquarium-science footer a,
body.aquarium-science .footer a,
body.aquarium-science #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.aquarium-science footer a:hover,
body.aquarium-science .footer a:hover,
body.aquarium-science #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.aquarium-science footer a.blue-menu-btn,
body.aquarium-science .footer a.blue-menu-btn,
body.aquarium-science #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.aquarium-science .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.aquarium-science .grid-link-card:hover {
    border-color: #8fc951 !important;
}
/* ==========================================================================
   ROUTE: FILTRATION SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.filtration header, 
body.filtration .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.filtration main h1, 
body.filtration article h1, 
body.filtration #content h1,
body.filtration .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.filtration main h1::before, 
body.filtration article h1::before, 
body.filtration #content h1::before,
body.filtration .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.filtration blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.filtration #nav li.filtration a, 
body.filtration .navigation li.filtration a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.filtration main a,
body.filtration article a,
body.filtration #content a,
body.filtration #sidebar a,
body.filtration .sidebar a,
body.filtration .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.filtration main a:hover,
body.filtration article a:hover,
body.filtration #content a:hover,
body.filtration #sidebar a:hover,
body.filtration .sidebar a:hover,
body.filtration .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.filtration footer a,
body.filtration .footer a,
body.filtration #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.filtration footer a:hover,
body.filtration .footer a:hover,
body.filtration #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.filtration footer a.blue-menu-btn,
body.filtration .footer a.blue-menu-btn,
body.filtration #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.filtration .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.filtration .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: FISH BEHAVIOUR SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.fish-behaviour header, 
body.fish-behaviour .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.fish-behaviour main h1, 
body.fish-behaviour article h1, 
body.fish-behaviour #content h1,
body.fish-behaviour .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.fish-behaviour main h1::before, 
body.fish-behaviour article h1::before, 
body.fish-behaviour #content h1::before,
body.fish-behaviour .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.fish-behaviour blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.fish-behaviour #nav li.fish-behaviour a, 
body.fish-behaviour .navigation li.fish-behaviour a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.fish-behaviour main a,
body.fish-behaviour article a,
body.fish-behaviour #content a,
body.fish-behaviour #sidebar a,
body.fish-behaviour .sidebar a,
body.fish-behaviour .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.fish-behaviour main a:hover,
body.fish-behaviour article a:hover,
body.fish-behaviour #content a:hover,
body.fish-behaviour #sidebar a:hover,
body.fish-behaviour .sidebar a:hover,
body.fish-behaviour .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.fish-behaviour footer a,
body.fish-behaviour .footer a,
body.fish-behaviour #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.fish-behaviour footer a:hover,
body.fish-behaviour .footer a:hover,
body.fish-behaviour #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.fish-behaviour footer a.blue-menu-btn,
body.fish-behaviour .footer a.blue-menu-btn,
body.fish-behaviour #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.fish-behaviour .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.fish-behaviour .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: UNDERSTANDING AFRICAN CICHLIDS SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.understanding-african-cichlids header, 
body.understanding-african-cichlids .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.understanding-african-cichlids main h1, 
body.understanding-african-cichlids article h1, 
body.understanding-african-cichlids #content h1,
body.understanding-african-cichlids .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.understanding-african-cichlids main h1::before, 
body.understanding-african-cichlids article h1::before, 
body.understanding-african-cichlids #content h1::before,
body.understanding-african-cichlids .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.understanding-african-cichlids blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.understanding-african-cichlids #nav li.understanding-african-cichlids a, 
body.understanding-african-cichlids .navigation li.understanding-african-cichlids a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.understanding-african-cichlids main a,
body.understanding-african-cichlids article a,
body.understanding-african-cichlids #content a,
body.understanding-african-cichlids #sidebar a,
body.understanding-african-cichlids .sidebar a,
body.understanding-african-cichlids .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.understanding-african-cichlids main a:hover,
body.understanding-african-cichlids article a:hover,
body.understanding-african-cichlids #content a:hover,
body.understanding-african-cichlids #sidebar a:hover,
body.understanding-african-cichlids .sidebar a:hover,
body.understanding-african-cichlids .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.understanding-african-cichlids footer a,
body.understanding-african-cichlids .footer a,
body.understanding-african-cichlids #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.understanding-african-cichlids footer a:hover,
body.understanding-african-cichlids .footer a:hover,
body.understanding-african-cichlids #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.understanding-african-cichlids footer a.blue-menu-btn,
body.understanding-african-cichlids .footer a.blue-menu-btn,
body.understanding-african-cichlids #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.understanding-african-cichlids .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.understanding-african-cichlids .grid-link-card:hover {
    border-color: #8fc951 !important;
}
/* ==========================================================================
   ROUTE: WATER PARAMETERS SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.water-parameters header, 
body.water-parameters .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.water-parameters main h1, 
body.water-parameters article h1, 
body.water-parameters #content h1,
body.water-parameters .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.water-parameters main h1::before, 
body.water-parameters article h1::before, 
body.water-parameters #content h1::before,
body.water-parameters .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.water-parameters blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.water-parameters #nav li.water-parameters a, 
body.water-parameters .navigation li.water-parameters a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.water-parameters main a,
body.water-parameters article a,
body.water-parameters #content a,
body.water-parameters #sidebar a,
body.water-parameters .sidebar a,
body.water-parameters .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.water-parameters main a:hover,
body.water-parameters article a:hover,
body.water-parameters #content a:hover,
body.water-parameters #sidebar a:hover,
body.water-parameters .sidebar a:hover,
body.water-parameters .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.water-parameters footer a,
body.water-parameters .footer a,
body.water-parameters #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.water-parameters footer a:hover,
body.water-parameters .footer a:hover,
body.water-parameters #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.water-parameters footer a.blue-menu-btn,
body.water-parameters .footer a.blue-menu-btn,
body.water-parameters #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.water-parameters .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.water-parameters .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: MALAWI BLOAT SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.malawi-bloat header, 
body.malawi-bloat .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.malawi-bloat main h1, 
body.malawi-bloat article h1, 
body.malawi-bloat #content h1,
body.malawi-bloat .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.malawi-bloat main h1::before, 
body.malawi-bloat article h1::before, 
body.malawi-bloat #content h1::before,
body.malawi-bloat .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.malawi-bloat blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.malawi-bloat #nav li.water-parameters a, 
body.malawi-bloat .navigation li.water-parameters a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.malawi-bloat main a,
body.malawi-bloat article a,
body.malawi-bloat #content a,
body.malawi-bloat #sidebar a,
body.malawi-bloat .sidebar a,
body.malawi-bloat .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.malawi-bloat main a:hover,
body.malawi-bloat article a:hover,
body.malawi-bloat #content a:hover,
body.malawi-bloat #sidebar a:hover,
body.malawi-bloat .sidebar a:hover,
body.malawi-bloat .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.malawi-bloat footer a,
body.malawi-bloat .footer a,
body.malawi-bloat #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.malawi-bloat footer a:hover,
body.malawi-bloat .footer a:hover,
body.malawi-bloat #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.malawi-bloat footer a.blue-menu-btn,
body.malawi-bloat .footer a.blue-menu-btn,
body.malawi-bloat #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.malawi-bloat .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.malawi-bloat .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: PLIGHT OF THE VICTORIANS SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.plight-of-the-victorians header, 
body.plight-of-the-victorians .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.plight-of-the-victorians main h1, 
body.plight-of-the-victorians article h1, 
body.plight-of-the-victorians #content h1,
body.plight-of-the-victorians .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.plight-of-the-victorians main h1::before, 
body.plight-of-the-victorians article h1::before, 
body.plight-of-the-victorians #content h1::before,
body.plight-of-the-victorians .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.plight-of-the-victorians blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.plight-of-the-victorians #nav li.water-parameters a, 
body.plight-of-the-victorians .navigation li.water-parameters a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.plight-of-the-victorians main a,
body.plight-of-the-victorians article a,
body.plight-of-the-victorians #content a,
body.plight-of-the-victorians #sidebar a,
body.plight-of-the-victorians .sidebar a,
body.plight-of-the-victorians .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.plight-of-the-victorians main a:hover,
body.plight-of-the-victorians article a:hover,
body.plight-of-the-victorians #content a:hover,
body.plight-of-the-victorians #sidebar a:hover,
body.plight-of-the-victorians .sidebar a:hover,
body.plight-of-the-victorians .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.plight-of-the-victorians footer a,
body.plight-of-the-victorians .footer a,
body.plight-of-the-victorians #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.plight-of-the-victorians footer a:hover,
body.plight-of-the-victorians .footer a:hover,
body.plight-of-the-victorians #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.plight-of-the-victorians footer a.blue-menu-btn,
body.plight-of-the-victorians .footer a.blue-menu-btn,
body.plight-of-the-victorians #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.plight-of-the-victorians .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.plight-of-the-victorians .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: AQUARIUM DESIGNS SECTION (FRESH GREEN)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.aquarium-designs header, 
body.aquarium-designs .header {
    border-bottom: 4px solid #8fc951 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.aquarium-designs main h1, 
body.aquarium-designs article h1, 
body.aquarium-designs #content h1,
body.aquarium-designs .container h1 {
    color: #8fc951 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.aquarium-designs main h1::before, 
body.aquarium-designs article h1::before, 
body.aquarium-designs #content h1::before,
body.aquarium-designs .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #8fc951 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.aquarium-designs blockquote {
    border-left: 5px solid #8fc951 !important;    
    background-color: #cde2a8 !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.aquarium-designs #nav li.water-parameters a, 
body.aquarium-designs .navigation li.water-parameters a { 
    color: #8fc951 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.aquarium-designs main a,
body.aquarium-designs article a,
body.aquarium-designs #content a,
body.aquarium-designs #sidebar a,
body.aquarium-designs .sidebar a,
body.aquarium-designs .entry-content a {
    color: #8fc951 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.aquarium-designs main a:hover,
body.aquarium-designs article a:hover,
body.aquarium-designs #content a:hover,
body.aquarium-designs #sidebar a:hover,
body.aquarium-designs .sidebar a:hover,
body.aquarium-designs .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.aquarium-designs footer a,
body.aquarium-designs .footer a,
body.aquarium-designs #footer a {
    color: #8fc951 !important;
}

/* 8. Footer Links Hover State */
body.aquarium-designs footer a:hover,
body.aquarium-designs .footer a:hover,
body.aquarium-designs #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.aquarium-designs footer a.blue-menu-btn,
body.aquarium-designs .footer a.blue-menu-btn,
body.aquarium-designs #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.aquarium-designs .grid-link-card .card-btn {
    color: #8fc951 !important;
}
body.aquarium-designs .grid-link-card:hover {
    border-color: #8fc951 !important;
}

/* ==========================================================================
   ROUTE: THE LEGACY ARCHIVE SECTION (GOLDEN YELLOW)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.the-legacy-archive header, 
body.the-legacy-archive .header {
    border-bottom: 4px solid #FFCC00 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.the-legacy-archive main h1, 
body.the-legacy-archive article h1, 
body.the-legacy-archive #content h1,
body.the-legacy-archive .container h1 {
    color: #FFCC00 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.the-legacy-archive main h1::before, 
body.the-legacy-archive article h1::before, 
body.the-legacy-archive #content h1::before,
body.the-legacy-archive .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #FFCC00 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.the-legacy-archive blockquote {
    border-left: 5px solid #FFCC00 !important;    
    background-color: #FFFFCC !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.the-legacy-archive #nav li.the-legacy-archive a, 
body.the-legacy-archive .navigation li.the-legacy-archive a { 
    color: #FFCC00 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.the-legacy-archive main a,
body.the-legacy-archive article a,
body.the-legacy-archive #content a,
body.the-legacy-archive #sidebar a,
body.the-legacy-archive .sidebar a,
body.the-legacy-archive .entry-content a {
    color: #FFCC00 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.the-legacy-archive main a:hover,
body.the-legacy-archive article a:hover,
body.the-legacy-archive #content a:hover,
body.the-legacy-archive #sidebar a:hover,
body.the-legacy-archive .sidebar a:hover,
body.the-legacy-archive .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.the-legacy-archive footer a,
body.the-legacy-archive .footer a,
body.the-legacy-archive #footer a {
    color: #FFCC00 !important;
}

/* 8. Footer Links Hover State */
body.the-legacy-archive footer a:hover,
body.the-legacy-archive .footer a:hover,
body.the-legacy-archive #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.the-legacy-archive footer a.blue-menu-btn,
body.the-legacy-archive .footer a.blue-menu-btn,
body.the-legacy-archive #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.the-legacy-archive .grid-link-card .card-btn {
    color: #FFCC00 !important;
}
body.the-legacy-archive .grid-link-card:hover {
    border-color: #FFCC00 !important;
}


/* ==========================================================================
   ROUTE: LEGACY PHOTO INDEX SECTION (GOLDEN YELLOW)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.the-legacy-archive-photo-index header, 
body.the-legacy-archive-photo-index .header {
    border-bottom: 4px solid #FFCC00 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.the-legacy-archive-photo-index main h1, 
body.the-legacy-archive-photo-index article h1, 
body.the-legacy-archive-photo-index #content h1,
body.the-legacy-archive-photo-index .container h1 {
    color: #FFCC00 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.the-legacy-archive-photo-index main h1::before, 
body.the-legacy-archive-photo-index article h1::before, 
body.the-legacy-archive-photo-index #content h1::before,
body.the-legacy-archive-photo-index .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #FFCC00 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.the-legacy-archive-photo-index blockquote {
    border-left: 5px solid #FFCC00 !important;    
    background-color: #FFFFCC !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.the-legacy-archive-photo-index #nav li.legacy-archive-photo-index a, 
body.the-legacy-archive-photo-index .navigation li.legacy-archive-photo-index a { 
    color: #FFCC00 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.the-legacy-archive-photo-index main a,
body.the-legacy-archive-photo-index article a,
body.the-legacy-archive-photo-index #content a,
body.the-legacy-archive-photo-index #sidebar a,
body.the-legacy-archive-photo-index .sidebar a,
body.the-legacy-archive-photo-index .entry-content a {
    color: #FFCC00 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.the-legacy-archive-photo-index main a:hover,
body.the-legacy-archive-photo-index article a:hover,
body.the-legacy-archive-photo-index #content a:hover,
body.the-legacy-archive-photo-index #sidebar a:hover,
body.the-legacy-archive-photo-index .sidebar a:hover,
body.the-legacy-archive-photo-index .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.the-legacy-archive-photo-index footer a,
body.the-legacy-archive-photo-index .footer a,
body.the-legacy-archive-photo-index #footer a {
    color: #FFCC00 !important;
}

/* 8. Footer Links Hover State */
body.the-legacy-archive-photo-index footer a:hover,
body.the-legacy-archive-photo-index .footer a:hover,
body.the-legacy-archive-photo-index #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.the-legacy-archive-photo-index footer a.blue-menu-btn,
body.the-legacy-archive-photo-index .footer a.blue-menu-btn,
body.the-legacy-archive-photo-index #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.the-legacy-archive-photo-index .grid-link-card .card-btn {
    color: #FFCC00 !important;
}
body.the-legacy-archive-photo-index .grid-link-card:hover {
    border-color: #FFCC00 !important;
}

/* ==========================================================================
   ROUTE: LEGACY TANK VOLUME CALCULATOR SECTION (GOLDEN YELLOW)
   ========================================================================== */

/* 1. Horizontal Border Bar Under Header */
body.the-legacy-archive-tank-volume-calculator header, 
body.the-legacy-archive-tank-volume-calculator .header {
    border-bottom: 4px solid #FFCC00 !important;
}

/* 2. Page Title Main H1 Elements (Perfect 34px Size & Tight Spacing) */
body.the-legacy-archive-tank-volume-calculator main h1, 
body.the-legacy-archive-tank-volume-calculator article h1, 
body.the-legacy-archive-tank-volume-calculator #content h1,
body.the-legacy-archive-tank-volume-calculator .container h1 {
    color: #FFCC00 !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* Perfect breadcrumb gap */
    border-left: none !important;  /* Removes old stubborn theme border */
}

/* 2b. INDEPENDENT ACCENT LINE (Perfect Balanced 5.5px Weight) */
body.the-legacy-archive-tank-volume-calculator main h1::before, 
body.the-legacy-archive-tank-volume-calculator article h1::before, 
body.the-legacy-archive-tank-volume-calculator #content h1::before,
body.the-legacy-archive-tank-volume-calculator .container h1::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important; 
    height: 36px !important;  
    width: 5.5px !important;    /* Finely-tuned weight */
    background-color: #FFCC00 !important;
}

/* 3. Quote Box Styling (Left Accent Border & Tinted Faint Background) */
body.the-legacy-archive-tank-volume-calculator blockquote {
    border-left: 5px solid #FFCC00 !important;    
    background-color: #FFFFCC !important;        
}

/* 4. Top Menu Active Link (Highlights just the active tab in the main nav) */
body.the-legacy-archive-tank-volume-calculator #nav li.legacy-tank-volume-calculator a, 
body.the-legacy-archive-tank-volume-calculator .navigation li.legacy-tank-volume-calculator a { 
    color: #FFCC00 !important; 
}

/* 5. Main Content and Sidebar Links (Leaves Top Menu Unaffected) */
body.the-legacy-archive-tank-volume-calculator main a,
body.the-legacy-archive-tank-volume-calculator article a,
body.the-legacy-archive-tank-volume-calculator #content a,
body.the-legacy-archive-tank-volume-calculator #sidebar a,
body.the-legacy-archive-tank-volume-calculator .sidebar a,
body.the-legacy-archive-tank-volume-calculator .entry-content a {
    color: #FFCC00 !important;
}

/* 6. Main Content and Sidebar Links Hover State */
body.the-legacy-archive-tank-volume-calculator main a:hover,
body.the-legacy-archive-tank-volume-calculator article a:hover,
body.the-legacy-archive-tank-volume-calculator #content a:hover,
body.the-legacy-archive-tank-volume-calculator #sidebar a:hover,
body.the-legacy-archive-tank-volume-calculator .sidebar a:hover,
body.the-legacy-archive-tank-volume-calculator .entry-content a:hover {
    opacity: 0.8 !important;
}

/* 7. Footer Links (Forces footer links to match page color) */
body.the-legacy-archive-tank-volume-calculator footer a,
body.the-legacy-archive-tank-volume-calculator .footer a,
body.the-legacy-archive-tank-volume-calculator #footer a {
    color: #FFCC00 !important;
}

/* 8. Footer Links Hover State */
body.the-legacy-archive-tank-volume-calculator footer a:hover,
body.the-legacy-archive-tank-volume-calculator .footer a:hover,
body.the-legacy-archive-tank-volume-calculator #footer a:hover {
    opacity: 0.8 !important;
}

/* 9. Safety Rule: Keeps Blue Utility Buttons White on This Page */
body.the-legacy-archive-tank-volume-calculator footer a.blue-menu-btn,
body.the-legacy-archive-tank-volume-calculator .footer a.blue-menu-btn,
body.the-legacy-archive-tank-volume-calculator #footer a.blue-menu-btn {
    color: #ffffff !important;
}

/* 10. Link Card Accents for This Page (3-Column Layout Matching) */
body.the-legacy-archive-tank-volume-calculator .grid-link-card .card-btn {
    color: #FFCC00 !important;
}
body.the-legacy-archive-tank-volume-calculator .grid-link-card:hover {
    border-color: #FFCC00 !important;
}





















/* 2. Page Title Main H1 Elements (Tightened Spacing For Breadcrumbs) */
body.the-african-great-lakes main h1, 
body.the-african-great-lakes article h1, 
body.the-african-great-lakes .container h1 {
    color: #008b8b !important;
    font-size: 34px !important;    
    font-weight: 600 !important;   
    position: relative !important;
    padding-left: 18px !important; 
    line-height: 1.1 !important;   
    margin-top: 0px !important;     
    margin-bottom: 8px !important;  /* REDUCED from 18px to close the breadcrumb gap */
    border-left: none !important;  
}




/* ==========================================================================
   LAYOUT: EXPAND MAX-WIDTH FOR EXTRA NAVIGATION SPACE
   ========================================================================== */
.container, 
#wrapper, 
.wrapper {
    max-width: 1200px !important; /* Default is usually 960px or 1040px */
    width: 100% !important;
}



/* ==========================================================================
   UTILITY: AUTOMATIC RESPONSIVE IMAGES
   ========================================================================== */
.responsive-img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
    margin: 0 auto; /* Centers the image automatically */
}

.responsive-image-container {
    width: 100%;
    padding: 10px 0;
    clear: both;
}


span.mark { background-color: #f0f7ff; }





/* Force the second breadcrumb link to turn flat gray and disable its function */
nav[aria-label="breadcrumb"] ul li:last-child a,
nav[aria-label="breadcrumb"] ul li:nth-child(2) a {
    color: #777777 !important;
    text-decoration: none !important;
    pointer-events: none !important; /* Completely blocks clicks and touches */
    cursor: default !important;      /* Changes cursor from a pointer hand to a regular arrow */
}

/* Remove hover triggers completely from the final fake link */
nav[aria-label="breadcrumb"] ul li:last-child a:hover,
nav[aria-label="breadcrumb"] ul li:nth-child(2) a:hover {
    color: #777777 !important;
    text-decoration: none !important;
}








/* ==========================================================================
   THE CORE SOLUTION: COLLAPSE THE SITEMAP WRAPPER & RESTORE STYLES
   ========================================================================== */

/* 1. Target the main page wrapper container and force it to drop forced heights */
#wrapper, .wrapper, #container, .container, main, .content-main {
    height: auto !important;
    min-height: 0px !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

/* 2. Overrides the template body class to eliminate the trailing whitespace */
html, body, body[class] {
    height: auto !important;
    min-height: 100% !important;
    padding-bottom: 0px !important;
    margin-bottom: 0px !important;
}

/* 3. Pulls the search section cleanly up against your content */
footer, .footer, #footer {
    position: relative !important;
    clear: both !important;
    display: block !important;
    margin-top: 30px !important; /* Normal uniform cushion beneath text */
    bottom: auto !important;
}

/* 4. Keeps your 8 fish cards fully active, responsive, and unblocked */
.link-grid-container {
    display: block !important;
    clear: both !important;
    margin-bottom: 20px !important;
}













/* Container layout - Simple, predictable single vertical list */
.human-sitemap ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 25px;
}

/* Level 1: Main Categories (The Lakes, Setup, etc.) */
.human-sitemap strong {
  display: block;
  font-size: 1.25rem;
  color: #33a1de; /* Your lighter accent blue */
  margin-top: 25px;
  border-bottom: 2px solid #eef2f5;
  padding-bottom: 6px;
}

/* Level 2: Sub-groups (e.g., Lake Malawi, Mbuna Index) */
.human-sitemap ul ul {
  margin-top: 10px;
  padding-left: 15px;
}

.human-sitemap ul ul li {
  padding: 6px 0;
  font-weight: 600;
  color: #333;
}

/* Level 3: Deep Nesting (e.g., Individual Species or Diet articles) */
.human-sitemap ul ul ul {
  margin-top: 6px;
  padding-left: 18px;
  border-left: 1px dashed #ced4da; /* Guide line to anchor child pages */
}

.human-sitemap ul ul ul li {
  padding: 4px 0;
  font-weight: 400;
  font-size: 0.95rem;
}

/* Universal Link Styling */
.human-sitemap a {
  text-decoration: none;
  color: #495057;
  transition: color 0.15s ease;
}

.human-sitemap a:hover {
  text-decoration: underline;
  color: #33a1de; /* Matches your lighter blue on hover */
}












/* ==========================================================================
   FINAL FIXED MOBILE NAVIGATION BLOCK
   ========================================================================== */
@media (max-width: 991px) {
    /* Main panel wrapper background */
    .header-nav {
        display: block !important;
        position: absolute !important;
        top: 100% !important; 
        left: 0 !important;
        width: 100% !important;
        background: #11151c !important; 
        padding: 15px 20px !important;
        box-sizing: border-box !important;
        z-index: 9999 !important; 
    }

    .header-nav.hide-mobile {
        display: none !important;
    }

    /* Force parent links to sit in their own line blocks */
    .header-nav li {
        display: block !important;
        position: relative !important;
        float: none !important;
        width: 100% !important;
        padding: 12px 0 !important;
        border-bottom: 1px solid rgba(255,255,255,0.08) !important;
        box-sizing: border-box !important;
    }

    /* Keep main navigation text safe to the left edge */
    .header-nav li > a {
        display: block !important;
        width: calc(100% - 60px) !important;
        color: #ffffff !important;
        text-align: left !important;
    }

    /* Force the button box color to blue and pin to the right edge */
    button.showDropdown {
        position: absolute !important;
        right: 0 !important;
        top: 4px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 38px !important;
        background: #0076df !important; /* Forces your desired menu theme blue */
        border: none !important;
        border-radius: 4px !important;
        color: #ffffff !important;
        z-index: 99 !important;
        cursor: pointer !important;
    }

    /* Force submenus to slide DOWN underneath instead of hovering on top */
    .header-nav ul.subMenu {
        display: none; 
        position: relative !important; /* Absolute positioning is what caused the overlap */
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        float: none !important;
        margin: 10px 0 0 0 !important;
        padding: 5px 0 5px 15px !important; 
        background: rgba(0, 0, 0, 0.3) !important;
        box-sizing: border-box !important;
    }

    /* Submenu internal item line reset */
    .header-nav ul.subMenu li {
        border-bottom: none !important;
        padding: 8px 0 !important;
    }
}