/* ==========================================================================
   Fixes — load LAST, after allred-brand.css and allred-site-variants.css

   Two problems visible on doctorallred.com:
     1. The footer field reads green, not near-black
     2. Section headings are not rendering in Avenir

   Both are addressed here rather than by editing the base files, so the
   change is easy to isolate or revert.
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------------
     A dedicated dark for LARGE FIELDS.

     --ink (#1F261E) sits at hue 112 with 12% saturation. That green cast is
     genuinely imperceptible in 15px body text, which is why it survived the
     palette reconciliation. Across a 400px-tall footer it is unmistakable,
     and it reads as olive rather than as a neutral dark.

     This is a warm near-black at hue 30. It keeps --ink for text, where the
     tint does no harm and the measured 14.93:1 still applies.
     ------------------------------------------------------------------------ */
  --ink-field: #24211E;   /* paper on it 15.42:1 · sand on it 12.36:1 */
}

/* --------------------------------------------------------------------------
   1. Footer
   -------------------------------------------------------------------------- */

#footer-outer,
#footer-outer .row,
#footer-widgets {
  background-color: var(--ink-field) !important;
}

/* Widget titles were rendering burgundy on the dark field — 2.12:1, which is
   effectively invisible. Salient applies these through several selectors
   depending on version and widget type, so all the likely ones are covered. */
#footer-outer h1, #footer-outer h2, #footer-outer h3,
#footer-outer h4, #footer-outer h5, #footer-outer h6,
#footer-outer .widget h4,
#footer-outer .widgettitle,
#footer-outer .widget-title,
#footer-widgets .widget h4,
#footer-widgets .container .row .col h4 {
  color: var(--paper) !important;        /* 15.42:1 */
  font-family: var(--brand-sans);
  letter-spacing: 0.14em;
  font-weight: 400;
}

#footer-outer,
#footer-outer p,
#footer-outer li,
#footer-outer .widget {
  color: var(--sand) !important;         /* 12.36:1 */
}

#footer-outer a { color: var(--sand) !important; }
#footer-outer a:hover,
#footer-outer a:focus { color: var(--paper) !important; }

/* Never burgundy on the dark field. If a Salient option or a widget forces
   the accent colour in here, this catches it. */
#footer-outer [style*="943835"],
#footer-outer [style*="6E2926"] { color: var(--clay) !important; }  /* 5.98:1 */

#footer-outer hr,
#footer-outer .divider-border { border-top-color: rgba(250, 251, 248, 0.22); }

/* --------------------------------------------------------------------------
   2. Headings — force Avenir over Salient and WPBakery

   The base file targets bare h1–h6, which loses to Salient's dynamic
   stylesheet and to WPBakery's own wrappers. These selectors are more
   specific without resorting to !important on the font stack, so a
   deliberate per-element override in the builder can still win.
   -------------------------------------------------------------------------- */

body .container-wrap h1,
body .container-wrap h2,
body .container-wrap h3,
body .container-wrap h4,
body .container-wrap h5,
body .container-wrap h6,
body #ajax-content-wrap h1,
body #ajax-content-wrap h2,
body #ajax-content-wrap h3,
body .wpb_text_column h1,
body .wpb_text_column h2,
body .wpb_text_column h3,
body .vc_custom_heading,
body .nectar-fancy-title h1,
body .nectar-fancy-title h2 {
  font-family: var(--brand-sans) !important;
  font-weight: 400;
  letter-spacing: -0.008em;
}

/* NOTE: no heading COLOUR rule here, deliberately.
 *
 * An earlier version set `.container-wrap h1/h2/h3` to the anchor colour.
 * That was unnecessary — section headings were already rendering burgundy
 * from Salient's own options — and it was actively harmful, because the
 * same selector caught the hero heading sitting over the photograph and
 * turned white type burgundy against a dark image.
 *
 * Colour is left to Salient. Only the font stack is forced above, which is
 * what was actually broken. If a specific heading needs a different colour,
 * set it on that element in the builder rather than reinstating a blanket
 * rule here.
 */

/* Safety net: anywhere Salient marks a section as light-on-dark, keep the
   heading light regardless of what any other rule attempts. */
.container-wrap .light h1, .container-wrap .light h2, .container-wrap .light h3,
#page-header-bg h1, #page-header-bg h2, #page-header-bg h3,
.nectar-full-page-header h1, .nectar-full-page-header h2,
[data-color-overlay] h1, [data-color-overlay] h2, [data-color-overlay] h3 {
  color: var(--paper) !important;
}

/* --------------------------------------------------------------------------
   3. Project logo tiles
   The two logos on the home page sit on hard white panels inside a paper
   section, which shows as a visible rectangle behind each one. Match them
   to the page.
   -------------------------------------------------------------------------- */

.wpb_single_image img[src*="logo"],
.wpb_single_image .vc_single_image-wrapper { background: transparent !important; }
