:root {
	--primary-color: #004987;
    --secondary-color: #B4610E;
    --top-banner-bg-color: #A8007B;
    --accent-color: #E4f6ff;
    --topic-menu-bg-color-hover: #F0F0F0;
    /* LINK COLORS */
    --primary-links-color-hover: #072948;
    --secondary-links-color-hover: #072948;
    --footer-link-color: #C4C4C4;
    --footer-link-color-hover: #40b4e5;
    /* BUTTON COLORS - PRIMARY */
    --primary-button-color: #004987;
    --primary-button-color-hover: #002E47;
    --primary-button-text-color: #FEFEFE;
    --primary-button-text-color-hover: #FEFEFE;
    --primary-button-border-color: #004987;
    --primary-button-border-color-hover: #002E47;
    /* BUTTON COLORS - SECONDARY */
    --secondary-button-color: #E4F6FF;
    --secondary-button-color-hover: #001623;
    --secondary-button-text-color: #004987;
    --secondary-button-text-color-hover: #FEFEFE;
    --secondary-button-border-color: #004987;
    --secondary-button-border-color-hover: #004987;
    /* NAVIGATION COLORS */
    --nav-bg-color: #004987;
    --nav-tab-color: #FEFEFE;
    --nav-tab-color-hover: #C3E8F8;
    --nav-link-color: #004987;
    --nav-link-color-hover: #000;
    /* HEADING/BANNER BACKGROUND COLORS */
    --bg-color-1: #40b4e5;
    --bg-color-2: #004987;
    --bg-color-3: #b5bd00;
    /* HEADING/BANNER BACKGROUND COLORS WITH TRANSPARENCY */
    --rgba-color-1: rgb(64 180 229 / .75);
    --rgba-color-2: rgb(0 73 135 / .75);
    --rgba-color-3: rgb(181 189 0 / .75);
    /* FONT FAMILY */
    --font-family-heading: "Oswald", sans-serif;
    --font-family-body: "Noto Sans", sans-serif;
}

.home-announcements h3 {
    background: var(--bg-color-2);
    color: #fff;;
}

/* Accordion title bar branding */
.fda-accordion .accordion-title {
    background-color: #004987;
    color: #fff;
    font-size: 1.25rem;           /* ~20 px — scales better than fixed 24 px */
    border-radius: 4px;
}
.fda-accordion .accordion-title:hover,
.fda-accordion .accordion-title:focus {
    background-color: #003566;    /* slightly darker on interaction */
    color: #fff;
}

.fda-accordion .accordion-title::before {
    color: #cccccc;
}

/* Keep square bullets consistent */
.fda-accordion ul.square { list-style-type: square; }
.fda-accordion ul.circle { list-style-type: circle; }

/* Publisher card tweaks */
.fda-publishers {
    margin-top: 3rem;
}
.fda-publishers h3 {
    margin-bottom: 1.5rem;
}
.fda-publishers .card {
    border: 1px solid #ccc;
    border-radius: 4px;
    overflow: hidden;
    transition: box-shadow 0.2s ease;
}
.fda-publishers .card:hover {
    box-shadow: 0 0 4px 2px rgba(0, 140, 186, 0.45);
}
.fda-publishers .card img {
    width: 100%;
    height: auto;
    display: block;
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR MEDIUM SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */
@media screen and (min-width: 40em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 64em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR X-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 75em) {
}


/*  ::::::::::::::::::::::::::::::::::::::::::::::::
	     CSS FOR XX-LARGE SCREENS AND HIGHER
::::::::::::::::::::::::::::::::::::::::::::::::::::  */

@media screen and (min-width: 90em) {
}