/* ==========================================================================
   JIMERSON BIRR - BRAND COLOR LAYER
   --------------------------------------------------------------------------
   File            : wp-content/themes/paperstreet/jb-brand.css
   Source of truth : Jimerson Birr Visual Brand Guide, rev. August 2026
   Prepared        : 28 August 2026
   Version         : 3. Consolidated from the WPCode snippet into the theme.

   WHAT CHANGED IN VERSION 3
   Nothing about the rules. Every declaration below is byte for byte what the
   WPCode snippet "Brand Color Reconciliation" was already serving, so this
   file is a pure relocation and the site should render identically the
   moment it goes live and the snippet is switched off.

   WHY IT MOVED HERE
   The site was carrying brand color in three places: this theme's main
   stylesheet, the Customizer's Additional CSS, and a WPCode snippet. Three
   places is how a palette drifts. It now lives in the theme, in a file that
   can be opened in Appearance > Theme File Editor, kept with the rest of the
   theme, and versioned automatically by functions.php.

   HOW IT LOADS
   functions.php enqueues this file on wp_enqueue_scripts at priority 99, so
   it lands after every stylesheet the theme and the plugins register. The
   version argument is filemtime(), so every save produces a new URL and the
   CDN can never serve a stale copy. That was a real and expensive bug on
   this site in August 2026; do not remove the filemtime() argument.

   Only one thing still loads after this file: the Customizer's Additional
   CSS, which WordPress prints inline at the end of wp_head. That does not
   matter, because every rule below is written to win on specificity rather
   than on source order.

   HOW IT INTERACTS WITH WP ROCKET
   Remove Unused CSS is active. For logged out visitors WP Rocket merges the
   stylesheets and every inline block into one <style id="wpr-usedcss">,
   preserving document order, and prunes any selector that does not match an
   element on that page. Pruning is per page, so after purging, spot check a
   blog post and an attorney bio, not just the homepage.

   TESTING TIP
   Append any non-reserved query variable, for example ?brandcheck=1, to get
   the live uncached render. Never use ?m= or ?s=; those are WordPress
   reserved and serve the 404 template at HTTP 200.
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. BRAND TOKENS
   The full palette from the guide, as custom properties. Future CSS should
   reference the token rather than retyping a hex.
   -------------------------------------------------------------------------- */

:root {
  /* Primary palette */
  --jb-logo-teal:  #04495A;  /* the firm's stated primary */
  --jb-honors:     #11455A;  /* darker alternate, real-world applications */
  --jb-light-teal: #035C6E;  /* the web primary, matches HQ exterior */
  --jb-sea-foam:   #14ACAB;  /* bright accent, sparing use only */

  /* Supporting palette */
  --jb-black:      #000000;
  --jb-slate:      #1F2933;
  --jb-granite:    #496676;
  --jb-steel:      #6A8F96;
  --jb-sandstone:  #696969;
  --jb-pebble:     #939393;
  --jb-sand:       #E2E5E6;
  --jb-cloud:      #EFF2F3;
  --jb-white:      #FFFFFF;
}


/* --------------------------------------------------------------------------
   2. SEA FOAM USED AS TEXT
   Sea Foam #14ACAB measures 2.79:1 on white. WCAG AA requires 4.5:1 for
   normal text and 3:1 for large text, so on a white ground Sea Foam fails
   both. The guide's own tagline artwork agrees: on white the lockup is teal,
   and Sea Foam only appears in the reverse treatment on a dark ground.

   Rule adopted: Sea Foam is an accent on dark grounds only. It never carries
   text on white.
   -------------------------------------------------------------------------- */

/* 2a. Consent block links on the contact forms: FIXED AT SOURCE, not here.
       Corrected to Light Teal #035C6E directly in the Customizer's Additional
       CSS on 28 August 2026, where the original #14ACAB rule lived. There is
       nothing to override any more, so the !important block that used to sit
       here is gone. Kept as a comment so the next person does not go looking
       for it. */

/* 2b. Homepage hero tagline. This one sits on the dark video ground, which is
       the guide's approved reverse treatment, so it stays in the Sea Foam
       family. It only needs snapping from #00AAAB to the exact brand value. */
body .hero__content-title {
  color: var(--jb-sea-foam);
}


/* --------------------------------------------------------------------------
   3. COLORS THAT ARE GENUINELY OFF THE GUIDE
   Everything in this section is a visible change. Delta-E from the nearest
   brand color is noted so the size of each shift is on the record.
   -------------------------------------------------------------------------- */

/* 3a. Links outside the article body. The theme still carries Zurb
       Foundation's default blue #1779BA, which is 30.3 Delta-E from anything
       in the palette. It paints the author byline and the related-post links
       on every blog post.

       Specificity is deliberate. html body a is three type selectors, which
       beats the theme's a and its li a, p a, but loses to .content a at one
       class, so in-article links keep the teal they already have, and loses
       to .custom-menu > ul > li > a, so the navigation stays white. Do not
       add !important here: it would override the nav and turn the entire
       menu teal on teal. */
html body a {
  color: var(--jb-light-teal);
}

html body li a,
html body p a {
  color: var(--jb-light-teal);
}

/* The three places Foundation blue was confirmed painting on a real page,
   pinned by their own container classes. Belt and braces: the two rules
   above should already cover them, but a class-based selector removes any
   dependence on where this file lands in the cascade. .news wraps the byline
   and the related-post list on a post; body.single-post .post-body a carries
   two classes and so still outranks this, which is why in-article links keep
   their teal. */
html body .news a,
html body a.sidebar-blog-link,
html body .footer__copyright a {
  color: var(--jb-light-teal);
}

html body .news a:hover,
html body .news a:focus,
html body a.sidebar-blog-link:hover,
html body a.sidebar-blog-link:focus,
html body .footer__copyright a:hover,
html body .footer__copyright a:focus {
  color: var(--jb-honors);
}

html body a:hover,
html body a:focus,
html body li a:hover,
html body li a:focus,
html body p a:hover,
html body p a:focus {
  color: var(--jb-honors);
}

/* 3b. Blog accents. #0F8577 is a green-leaning teal, 16.8 Delta-E from Sea
       Foam and not in the palette at all. */
body .post {
  border-bottom-color: var(--jb-light-teal);
}

body .post-head-info span:not(:last-of-type):after {
  background-color: var(--jb-light-teal);
}

body .wp-pagenavi .first:focus,
body .wp-pagenavi .first:hover,
body .wp-pagenavi .last:focus,
body .wp-pagenavi .last:hover,
body .wp-pagenavi .nextpostslink:focus,
body .wp-pagenavi .nextpostslink:hover,
body .wp-pagenavi .previouspostslink:focus,
body .wp-pagenavi .previouspostslink:hover {
  color: var(--jb-light-teal);
}

/* 3c. Decorative corner brackets on cards and the connect block.
       #8EC0C9 is 18.0 Delta-E from Steel, the palette's closest member.
       Only the color changes; the 3px width and solid style are untouched.
       Note corrected 28 Aug 2026: there is a rule in the Customizer that
       would hide these on blog listing pages by setting the border width to
       0, but it is commented out and has been for some time, so brackets are
       NOT hidden there. An earlier version of this file said otherwise. */
body .card-sign:before,
body .connect__holder:before {
  border-top-color: var(--jb-steel);
}

body .card-sign:before {
  border-right-color: var(--jb-steel);
}

body .connect__holder:before {
  border-left-color: var(--jb-steel);
}

body .card-sign:after,
body .connect__holder:after {
  border-bottom-color: var(--jb-steel);
}

body .card-sign:after {
  border-left-color: var(--jb-steel);
}

body .connect__holder:after {
  border-right-color: var(--jb-steel);
}

/* 3d. Page ground behind the content wrapper. #373F51 is 11.6 Delta-E from
       Slate. Visible at the edges and on short pages.

       BOTH selectors are required. The theme sets this with "body,html", a
       group. "html body" is a DESCENDANT selector and only ever matches the
       body, which leaves html painting the canvas in the old color. That was
       a real bug in the first deployed version, caught in live verification
       on 28 August: body went Slate while html stayed #373F51, and html is
       the element that actually paints the area around the page.
       html:root is one type plus one pseudo-class, so it outranks the
       theme's html without depending on source order. */
html:root,
html body {
  background-color: var(--jb-slate);
}

/* 3e. Attorney bio list markers. #00C6CD is 10.7 Delta-E from Sea Foam.
       Decorative, not text, so Sea Foam is appropriate here. */
body .banner-bio__info ol li a:after {
  background-color: var(--jb-sea-foam);
}

/* 3f. Hollow and clear button hover states. #0C3D5D is 8.9 Delta-E from
       Honors. */
body .button.hollow:focus,
body .button.hollow:hover,
body .button.hollow.primary:focus,
body .button.hollow.primary:hover,
body .button.clear:focus,
body .button.clear:hover,
body .button.clear.primary:focus,
body .button.clear.primary:hover {
  color: var(--jb-honors);
  border-color: var(--jb-honors);
}

/* 3g. Nested list bullets. #116678 is 4.0 Delta-E from Light Teal. */
body .content ul li ul li:before {
  color: var(--jb-light-teal);
}

/* 3h. Office information panel. #E9F5F7 is 3.2 Delta-E from Cloud. */
body .office-block-info {
  background-color: var(--jb-cloud);
}

/* 3i. Testimonial watermark heading. Was #00AAAB at 13% opacity. Snapped to
       the exact Sea Foam value. */
body .testimonials__caption h2 {
  color: rgba(20, 172, 171, 0.13);
}

/* 3j. Heading emphasis words, #110946. FIXED AT SOURCE, not here.
       Corrected to Slate #1F2933 directly in layout-and-style-sc.min.css on
       28 August 2026 and verified live. Nothing is needed in this file.
       Kept as a comment so the next person does not go looking for it. */


/* --------------------------------------------------------------------------
   4. GRAVITY FORMS: NOT IN THIS FILE, BY DECISION
   All Gravity Forms styling on this site lives in one place, the Customizer's
   Additional CSS, which is where it has always lived. The multi-step form
   progress bar colors moved there on 28 August 2026 rather than here, so that
   a future person looking for form CSS finds all of it together.

   THE BOUNDARY, in one line: sitewide brand color goes in this file, anything
   Gravity Forms or page-template specific goes in the Customizer.
   -------------------------------------------------------------------------- */


/* ==========================================================================
   NOTES: WHAT IS DELIBERATELY LEFT ALONE
   --------------------------------------------------------------------------
   1. THE NEAR-MATCHES. Below or near the threshold of visible difference.
      These are best fixed by a global find and replace in the theme's main
      stylesheet, NOT by adding override rules here:

        #005B6E -> #035C6E  Light Teal   0.8 Delta-E   74 theme rules
        #EFEFEF -> #EFF2F3  Cloud        1.4 Delta-E   16 theme rules
        #E6E6E6 -> #E2E5E6  Sand         1.3 Delta-E   21 theme rules
        #DFDFDF -> #E2E5E6  Sand         2.3 Delta-E
        #0A0A0A -> #000000  Black        2.7 Delta-E
        #707070 -> #696969  Sandstone    2.8 Delta-E   footer copyright
        #8A8A8A -> #939393  Pebble       3.5 Delta-E
        #767676 -> #696969  Sandstone    5.2 Delta-E
        #5B5B5B -> #696969  Sandstone    5.8 Delta-E

   2. FUNCTIONAL UI STATE COLORS. The alert red #CC4B37, success green
      #3ADB76 and warning amber #FFAE00 are Foundation's form-validation
      palette. The brand guide contains no equivalents, and recoloring
      validation states in brand teal would remove the signal they exist to
      carry. Leave them.

   3. THE HERO LOCKUP ITSELF. The guide's reverse tagline sets BUSINESS and
      LAW in white with only the ampersand in Sea Foam. The homepage hero
      sets both words in teal and drops the ampersand entirely. That is a
      lockup fidelity question for the designer, not a CSS color fix.
   ========================================================================== */