/* ===========================================================================
   velvet-refresh-20260825.css — release 20260825-footer-attribution-parallax-v1

   Loaded on every Velvet page immediately after styles.css. Two independent
   changes live here because they ship together and neither is large enough to
   justify its own request:

     1. FOOTER COMPACTION      — the footer had grown to about a third of a
                                 desktop viewport.
     2. MOBILE LOCAL RESOURCES — the Local Resources pill moves out of the
                                 crowded mobile header bar and into the menu.

   Kept out of styles.css deliberately. styles.css is 226 KB, is served only
   from production (no copy exists in this repository), and sits behind a
   7-day Cloudflare cache with no purge credential — so rewriting it would mean
   re-versioning it on 167 pages and waiting out the edge. A new file has no
   prior cache key, so it is live on first request, and rollback is deleting
   one <link> rather than reverse-patching a file nobody holds a source for.
   =========================================================================== */

/* ---------------------------------------------------------------------------
   1. FOOTER COMPACTION

   WHY
     The site footer had grown to roughly a third of the viewport on desktop:
     a four-group navigation panel, a brand block, contact, credentials, and a
     three-paragraph disclosure panel, all carrying generous 2026-brand-refresh
     spacing. Nothing in it is removable — the TREC brokerage disclosure, the
     NMLS separation language, the licence numbers, and the Equal Housing mark
     are all required and stay exactly as written. So this file reduces the
     footer by tightening geometry and type only. No link, no disclosure
     sentence, and no badge is dropped or hidden.

   HOW IT COMPOSES
     This file loads after styles.css, so it is downstream of both existing
     footer passes there — the base rules near .site-footer and the 2026
     refresh overrides that follow them. Every selector here matches or exceeds
     the specificity of the rule it supersedes, so it wins on source order.

   WHY THE PARAGRAPH RULES CARRY !important — measured, not defensive
     An earlier revision of this file used no !important at all, and the
     rendered page proved that wrong. styles.css carries

       body, p, li, .imported-content, … { font-size: 16px !important; }

     so every bare <p> on the site is pinned at 16px by an important
     declaration. Source order cannot beat importance, so each font-size this
     file declared on a <p> — the footer body copy, both legal blocks, and the
     build credit — was inert. CDP CSS.getMatchedStylesForNode confirmed it:
     the credit computed 16px with the 11.5px rule listed as overridden, and
     .legal-disclosure-panel p measured 16px both with this sheet enabled and
     with it disabled. The 164px the footer did shrink came entirely from the
     geometry rules, which were never contested.

     So the !important below is not a specificity shortcut — it is the only
     tier that can reach a property another sheet already pinned. It is applied
     to <p> font-size only. Every other rule in this file wins on source order
     and is deliberately left alone; anchors, headings and spans are absent
     from that styles.css selector list and never needed it.

     styles.css itself is not the place to fix this: it is 226 KB, has no copy
     in this repository, and sits behind a 7-day Cloudflare cache with no purge
     credential. Editing it would mean re-versioning 167 pages and waiting out
     the edge to correct one declaration.

   ACCESSIBILITY FLOOR — deliberate, do not tighten further
     Footer links keep a 28px minimum interactive height and 13px/1.35 type.
     WCAG 2.2 SC 2.5.8 Target Size (Minimum), level AA, requires 24 x 24 CSS
     px; 28px clears it with margin on every breakpoint, including the stacked
     mobile footer. No text in this footer drops below 12px — the disclosure
     paragraphs, the legal line and the build credit all sit exactly on that
     floor, raised here from the 11.5px an earlier revision declared. If a
     future pass wants a smaller footer than this, the honest answer is to cut
     content, not type.
   --------------------------------------------------------------------------- */

/* --- outer box ------------------------------------------------------------ */
.site-footer {
  padding: 30px clamp(16px, 4vw, 44px) 16px;
}

.footer-grid {
  gap: 14px clamp(20px, 3vw, 44px);
}

.site-footer h2,
.site-footer .footer-heading {
  font-size: 14px;
  letter-spacing: 0.02em;
  margin: 0 0 8px;
}

.site-footer a,
.site-footer p {
  font-size: 13px !important;
  line-height: 1.45;
  margin-bottom: 4px;
}

.site-footer a,
.legal-links a {
  min-height: 28px;
  line-height: 1.35;
}

.footer-logo {
  width: 48px;
  height: 48px;
  margin-bottom: 8px;
  box-shadow: 0 8px 18px rgba(7, 20, 42, 0.32);
}

.badge-row {
  gap: 10px;
  margin-top: 6px;
}

.badge-row img {
  width: 28px;
}

/* --- navigation panel ----------------------------------------------------- */
.footer-grid > div.footer-nav-panel {
  padding: 14px clamp(14px, 1.6vw, 20px);
}

.footer-nav-panel .footer-heading {
  margin-bottom: 8px;
  padding-bottom: 6px;
}

.footer-nav-groups {
  gap: 6px clamp(16px, 2.2vw, 30px);
}

.footer-nav-group {
  gap: 0;
}

.footer-nav-group span {
  font-size: 11px;
  margin-bottom: 2px;
}

.footer-nav-group a {
  min-height: 22px;
  font-size: 12.5px;
  line-height: 1.3;
}

/* --- legal / disclosure --------------------------------------------------- */
.legal {
  margin-top: 14px;
  padding-top: 10px;
  gap: 6px;
}

.legal p {
  font-size: 12px !important;
  line-height: 1.4;
  margin-bottom: 0;
}

.legal-disclosure-panel {
  padding: 12px 14px;
}

.legal-disclosure-panel h2,
.legal-disclosure-panel .footer-heading {
  font-size: 13px;
  margin-bottom: 6px;
}

/* 12px, not the 11.5px this rule shipped with. The TREC brokerage disclosure,
   the NMLS separation language and the licence numbers are the text a visitor
   is most likely to need to actually read, so they sit on the floor rather
   than under it. */
.legal-disclosure-panel p {
  font-size: 12px !important;
  line-height: 1.4;
  margin-bottom: 6px;
}

.legal-links {
  gap: 2px 16px;
}

.legal-links a {
  min-height: 28px;
  font-size: 12px;
}

@media (min-width: 900px) {
  .legal {
    gap: 6px 22px;
  }

  .legal-links a {
    min-height: 22px;
  }

  .legal p {
    font-size: 12px !important;
    line-height: 1.35;
  }

  .legal-disclosure-panel {
    gap: 6px 16px;
  }
}

/* --- build attribution ----------------------------------------------------
   The credit is the last child of <footer>, after .legal, so it never competes
   with a required TREC or NMLS disclosure for position and no disclosure moves
   because of it. Muted and small on purpose: it is a credit line, not a claim.
   Plain text rather than a link — there is no separate web-services brand to
   point it at yet.

   `color: inherit` + opacity rather than a literal colour: two different
   footers carry this line (`.site-footer` on the main pages, `.footer` on
   /local-resources/), so it has to read correctly against whatever background
   its own footer sets rather than assuming the navy one. Both containers are
   named in the selector below for the same reason.

   SPECIFICITY
     Two-class (0,2,0) so it outranks the `.site-footer p` (0,1,1) rule above
     rather than inheriting the footer's 13px body size. Without that the
     credit rendered at exactly the size of the copy around it, which is the
     one thing a credit line should not do.
   -------------------------------------------------------------------------- */
.site-footer .footer-credit,
.footer .footer-credit {
  max-width: 1500px;
  margin: 10px auto 0;
  color: inherit;
  opacity: 0.6;
  font-size: 12px !important;
  line-height: 1.4;
  letter-spacing: 0.02em;
  text-align: right;
}

@media (max-width: 900px) {
  .site-footer .footer-credit,
  .footer .footer-credit {
    text-align: left;
  }
}

/* ---------------------------------------------------------------------------
   2. PRIMARY NAV DENSITY

   BEFORE
     /local-resources/ was its own top-level header entry, styled as a gold
     pill. Measured live over CDP, that one entry rendered 140px wide at 1440px
     and 149px at 1920px -- wider than "Communities" (108px) and "Resources"
     (86px), and the widest thing in a nav whose seven entries already totalled
     628px. At 1280px only 18px separated the nav's right edge from
     .header-actions. It read as the loudest item in the bar while pointing at
     a page of outside providers.

   AFTER
     app.js lists it first inside the Resources dropdown, in both languages, so
     it stays one click from every page without holding a slot in the bar. The
     bar drops to six entries and the pill treatment retires with it -- both
     retired emphasis rule sets are gone because nothing emits either class
     any more. Their names are deliberately not repeated here: the release
     test asserts the retired class strings appear nowhere in this sheet, and
     a comment naming them would trip that check as if the dead rules had
     survived.

     The remaining entries also come down roughly a step. styles.css sizes them
     with `clamp(13px, 0.82vw, 14px)` (measured: 14px at 1920, 13px at 1440);
     this sheet loads after it and reasserts the same selectors one notch
     smaller. 12px is the floor already established for the footer credit --
     small enough to relieve the crowding, not small enough to strain.

     Below 1241px styles.css hides .desktop-nav entirely, so this rule only
     ever governs the desktop bar; the phone route is the menu either way.
   -------------------------------------------------------------------------- */
.desktop-nav > a,
.desktop-nav > .nav-item-dropdown > .nav-dropdown-btn {
  font-size: clamp(12px, 0.76vw, 13px);
}
