/*<meta />*/

/* MadCap-Branding applanguage:Templates/Projects/Online/Top Navigation/ */

/* ============================================================
   Brand variables — Rocket Matter
   Palette sourced from the Rocket Matter NextGen KB brand
   sheet: burgundy #801335 (signature), deep navy #202B46,
   dark text #1f363b, coral #FE9881. Montserrat is used for
   both body and headings (no serif pair). Burgundy header,
   standard (color) Rocket Matter logo.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

:root
{
	/* Brand colors */
	--Primary: #801335;          /* Rocket Matter burgundy — header, primary accent */
	--Secondary: #202B46;        /* Deep navy — structural secondary */
	--Dark: #4B4B4B;
	--Darkest: #1F363B;          /* Brand dark text */
	--Light: #F1F2F3;            /* Neutral light grey — tile / panel bg */
	--Lightest: #FFFFFF;
	--Medium: #A4AAAE;
	--NavBackground: #F5EDEE;    /* Warm neutral strip beneath the burgundy header */
	--FontFamily: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
	--HeadingFontFamily: var(--FontFamily);
	--HeadingFontWeight: 700;
	--LogoImage: url('../Images/RocketMatter-Logo-Header.png');

	/* Site accents */
	--Accent: #FE9881;           /* Coral — CTAs, emphasis (contrasts burgundy) */
	--AccentAlt: var(--Primary); /* Burgundy for secondary accents / links */

	/* Link color — burgundy, matching Rocket Matter's brand convention */
	--LinkColor: var(--Primary);

	/* Header theming — burgundy header with the white RocketMatter-Logo-
	   Header.png (converted from Matt's rm-logo-new.webp, 300×78). The
	   asset is already inverted, so no --LogoFilter is applied. */
	--HeaderBg: var(--Primary);
	--HeaderBorder: none;
	--HeaderTaglineColor: var(--Lightest);
	--HeaderDividerBg: rgba(255, 255, 255, .32);
	--LogoFilter: none;

	/* Search bar — burgundy to merge with the header (no divider between them).
	   Overrides the Styles.css defaults (--NavBackground / 1px solid --Light). */
	--SearchBarBg: var(--Primary);
	--SearchBarBorderBottom: none;
}

/* Heading weight — Montserrat Bold */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6
{
	font-weight: var(--HeadingFontWeight, 700);
}

/* Logo — swap background-image per brand */

a.site-logo
{
	background-image: var(--LogoImage);
}
/* Home page category tiles — Rocket Matter colorway.
   White bg with body-color text, burgundy icon and burgundy border; hover
   swaps the bg to --Light (grey) while text/icon/border stay put. Applies
   to .home-tile-sm ("Other Helpful Links" cards) as well, so the small
   tiles match the big ones. !important to beat Styles.css which loads
   after this brand sheet. */

a.home-tile
{
	color: var(--Dark) !important;
	background-color: #FFFFFF !important;
	border-color: var(--Primary) !important;
}

a.home-tile svg.home-tile-icon
{
	color: var(--Primary) !important;
}

a.home-tile:hover
{
	color: var(--Dark) !important;
	background-color: #F1F2F3 !important;
}

/* Brand backgrounds — literal hex values, not var(), because Flare's
   XML-editor CSS parser rejects var() on background-color (regardless
   of fallback). See handoff for the diagnosis. */

.site-header
{
	background-color: #801335;
}

.site-search-bar
{
	background-color: #801335;
}

.main-section .row.outer-row > nav
{
	background-color: #F5EDEE;
}

.main-section .row.outer-row > nav .nav-tree a:hover
{
	background-color: #801335 !important;
}

a.home-tile:hover svg.home-tile-icon
{
	color: var(--Primary) !important;
}
