/* Liberty Investigations - custom CSS */
/* Added July 25, 2026. Centers the main navigation bar. */
/* Desktop widths only, so the mobile burger menu is left alone. */
/* !important is required: the theme sets flex-start with higher specificity. */
/* Scoped to the current header layout. If the header style is changed in */
/* Customization > Visual Editor > Header, revisit this rule. */

@media (min-width: 993px) {
  .theme-header-navigation-style .theme-menu > ul {
    justify-content: center !important;
  }
}

/* Added July 27, 2026. Text shadow for the Civil Rights service tile heading, */
/* which sits over an engraved inscription. Applied by custom class only. */
.tile-heading-shadow, .tile-heading-shadow * { text-shadow: 0 1px 6px rgba(0,0,0,0.85), 0 0 2px rgba(0,0,0,0.9); }

/* Added July 27, 2026. Home page service row above Schedule a Consultation. */
/* The five items sit in a 12-column grid, so each was 16.67 percent wide and */
/* the group stopped short of the right edge. These rules give each item an */
/* even fifth of the row, let the inner row fill the equal-height column so */
/* the icons land on one line, and widen the labels. Desktop widths only. */
@media (min-width: 993px) {
      .zscustom-section-121 .zprow-container > .zpelem-col.zpcol-md-2 { flex: 0 0 20%; max-width: 20%; }
    .zscustom-section-121 .zpelem-col.zpcol-md-2 > .zprow-container { height: 100%; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4 { flex: 0 0 27%; max-width: 27%; padding-right: 0; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7,
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8 { flex: 0 0 73%; max-width: 73%; padding-left: 18px; }
}


/* Added July 27, 2026. Home page Who we are / What we do / Who we work with. */
/* Equal column height matches the box heights, but the Learn More buttons sat */
/* at three different heights because each box holds a different amount of */
/* text. Making each box a flex column and pushing the button down lands all */
/* three buttons on one line. Desktop widths only. */
@media (min-width: 993px) {
      .zscustom-section-119 .zprow-equalCol .zpelem-box { display: flex; flex-direction: column; height: 100%; }
    .zscustom-section-119 .zprow-equalCol .zpelem-box > .zpelem-button { margin-top: auto; }
}

/* Added July 27, 2026. Site-wide footer. */
/* The three columns were already even thirds, but the text inside each sat */
/* hard left while the address and copyright below were centered, so the band */
/* read as left-heavy. Centering the columns matches the blocks beneath them. */
/* The phone link was rendering in the theme link color, a yellow-green that */
/* clashes with the navy. White matches the license and email beside it. */
.theme-footer-area .zptext, .theme-footer-area .zpheading { text-align: center !important; }
.theme-footer-area .zptext a, .theme-footer-area .zpheading a { color: #ffffff !important; }
.theme-footer-area .zptext a:hover, .theme-footer-area .zpheading a:hover { text-decoration: underline; }

/* Added July 27, 2026. Schedule a Consultation button in the footer. */
/* The theme primary button is white on white against the navy band, so the */
/* label disappeared. An outline treatment reads on the navy and fills on hover. */
.theme-footer-area .zpelem-button { margin-top: 24px; }
.theme-footer-area .zpelem-button .zpbutton {
  background-color: transparent !important;
  border: 1px solid #ffffff !important;
  color: #ffffff !important;
  padding: 10px 28px !important;
  text-decoration: none !important;
}
.theme-footer-area .zpelem-button .zpbutton:hover {
  background-color: #ffffff !important;
  color: #003169 !important;
}

/* Added July 27, 2026. Footer rebuilt as short centered lines: name, */
/* address, phone and email. The three-column Telephone / License / Email */
/* row was removed because the site header already carries all three on */
/* every page. The license moved down to the small print above the copyright. */
/* Line spacing is tightened so the lines read as one block, and the leftover */
/* spacer element from the deleted row is hidden so the band sits balanced. */
.theme-footer-area .zpelem-spacer { display: none; }
.theme-footer-area .zpelem-heading { margin-bottom: 2px; }
.theme-footer-area .zpelem-text p { margin: 0 0 4px; }
.theme-footer-area .zpelem-button + .zpelement { margin-top: 20px; }

/* Narrow screens: drop a step in size so the phone and email line and the */
/* address line each stay on one line on a phone. */
@media (max-width: 760px) {
  .theme-footer-area .zpelem-text, .theme-footer-area .zpelem-text * { font-size: 14px; }
}


/* Added July 31, 2026. Paragraph spacing inside body text elements. Zoho */
/* renders every paragraph with zero margin, so multi-paragraph blocks ran */
/* together. Scoped to page content so the footer keeps its tighter rule. */
.theme-content-area .zpelem-text p + p { margin-top: 0.9em; }

/* Added August 1, 2026. Home page service row. The five labels are different */
/* lengths, so the longer ones wrap to two lines. The icon and the first line */
/* of every label are pinned to the same top edge so the row reads evenly */
/* instead of the two-line labels straddling the icons. Desktop widths only. */
@media (min-width: 993px) {
    .zscustom-section-121 .zpelem-col.zpcol-md-2 > .zprow-container { align-items: flex-start; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7,
    .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8 { padding-top: 6px; }
    .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4 { padding-top: 10px; }
}

/* Added August 1, 2026. Header presence. The navigation strip was pale grey */
/* #ECF0F1 and the band above it white, so the header read as white on white. */
/* The strip takes the site navy so it answers the footer band, and the company */
/* name gains size and weight to give the header a focal point. Top-level menu */
/* items only, so the dropdown panels stay white. Desktop widths only, which */
/* leaves the mobile burger menu on its light background. */
@media (min-width: 993px) {
    .theme-header.theme-header-navigation-style { background-color: #003169 !important; }
    .theme-header-navigation-style .theme-menu > ul > li > a { color: #ffffff !important; }
    .theme-site-name { font-size: 30px !important; font-weight: 600 !important; }
    .theme-site-caption { font-size: 13px !important; color: #5a6478 !important; }
}

/* Added August 1, 2026. Body measure. Text ran the full content width, about */
/* 170 characters a line on a wide monitor, where 60 to 80 reads comfortably. */
/* Capped near 75 characters and centred in the page, so the centred page */
/* titles sit directly above the column of text they belong to. */
.theme-content-area .zpelem-text { max-width: 720px; margin-left: auto; margin-right: auto; }

/* Added August 1, 2026. Body link colour. The previous green measured 3.79 to */
/* 1 against white, short of the 4.5 to 1 needed for body text. Darkened within */
/* the same family. Buttons are excluded so their white on green is untouched. */
.theme-content-area .zpelem-text a { color: #00734d !important; }

/* Added August 1, 2026. Hero height cut from 736px so the first content below */
/* it sits nearer the fold, and the hero heading centred to match the snippet */
/* and button already centred beneath it. */
.theme-banner, .theme-banner .zpslider-img { height: 540px !important; }
.theme-banner .zpelem-heading { text-align: center !important; }
.theme-banner .zpelem-heading .zpheading { text-align: center !important; }

/* Added August 1, 2026. Header white band tightened from 138px so it reads as */
/* one unit with the navy strip below it. */
.theme-header > .zpcontainer { padding-top: 18px !important; padding-bottom: 18px !important; }

/* Added August 1, 2026. Resources lists read as reference entries rather than */
/* a bulleted list, so the markers are removed and the indent closed up. */
/* Applied by custom class so other pages keep their bullets. */
.resources-plain-lists ul { list-style: none; padding-left: 0; }

/* Added August 1, 2026. Outer container narrowed. The theme caps it at */
/* 1440px with 50px padding, giving 1340px of content, which left the page */
/* titles, tiles and boxes far wider than the 720px text column. 1200 gives */
/* 1100px of content. max-width, not width, so anything under the cap is */
/* untouched: phones and tablets are unaffected. The colour bands stay full */
/* bleed because only the inner container moves. */
.zpcontainer { max-width: 1200px !important; }

/* Added August 1, 2026. The narrower container left each service label only */
/* 132px, so the two longest ran to three lines. Label type reduced from 16px */
/* to 14px and its line spacing tightened, and width reclaimed from the icon */
/* column and the inner padding, so all five sit on one line again. */
@media (min-width: 993px) {
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4 { flex: 0 0 22% !important; max-width: 22% !important; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7,
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8 { flex: 0 0 78% !important; max-width: 78% !important; padding-left: 8px !important; padding-right: 0 !important; }
      .zscustom-section-121 .zpelem-text, .zscustom-section-121 .zpelem-heading { font-size: 14px !important; line-height: 1.35 !important; }
      .zscustom-section-121 .zpheading, .zscustom-section-121 .zpheading a { font-size: 14px !important; line-height: 1.35 !important; }
      /* With nothing wrapping any more, the row goes back to simple vertical */
      /* centring, which the earlier top-alignment rules were only needed for. */
      .zscustom-section-121 .zpelem-col.zpcol-md-2 > .zprow-container { align-items: center !important; }
    .zscustom-section-121 .zprow-container .zpelem-col { padding-top: 0 !important; }
      /* The green icon square is a fixed 70px, so squeezing its column made the */
      /* square spill over the label. The square is reduced to 52px and the column */
      /* split reset so the graphic clears the text. */
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4 { flex: 0 0 24% !important; max-width: 24% !important; padding-left: 0 !important; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7,
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8 { flex: 0 0 76% !important; max-width: 76% !important; padding-left: 10px !important; }
      .zscustom-section-121 .zpicon, .zscustom-section-121 .zpicon-anchor { width: 52px !important; height: 52px !important; }
      /* 14px read too small. Label type goes back up to 17px and the two longest */
      /* are allowed to wrap to a second line, with the row top aligned again so */
      /* the first line of every label starts level with the icon. */
      .zscustom-section-121 .zpheading, .zscustom-section-121 .zpheading a { font-size: 17px !important; line-height: 1.3 !important; }
      .zscustom-section-121 .zpelem-col.zpcol-md-2 > .zprow-container { align-items: flex-start !important; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4 { flex: 0 0 28% !important; max-width: 28% !important; padding-top: 4px !important; }
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7,
      .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8 { flex: 0 0 72% !important; max-width: 72% !important; padding-top: 0 !important; }
}

/* Added August 16, 2026. The August 1 rule above pins the hero to 540px at every */
/* width. Below 992px the hero content is taller than that, so the hero spilled over */
/* the section heading, the Who we are heading, and the first sentence under it. */
/* Releasing the pin below 992px so the hero sizes to its content. Desktop keeps 540px. */
@media (max-width: 991px) { .theme-banner, .theme-banner .zpslider-img { height: auto !important; min-height: 540px !important; } }

/* Added August 28, 2026. Services page. The intro paragraph was capped */
/* at the 720px text default, narrower than the tile grid below it. */
/* The two tile columns plus the gap column span 847px, so the intro */
/* is widened to match and centered like the grid. Desktop only. */
@media (min-width: 993px) {
    .zscustom-section-127 .services-intro { max-width: 847px !important; width: 847px !important; margin-left: auto !important; margin-right: auto !important; }
}

/* Added August 28, 2026. Services page. The description boxes under */
/* the tiles run different lengths, so the Learn More buttons landed */
/* at different heights. The tile columns stretch to match, the */
/* description box grows to fill, and the button pins to its bottom. */
@media (min-width: 993px) {
    .zscustom-section-127 .zprow-container .zprow-container { align-items: stretch !important; }
    .zscustom-section-127 .zprow-container .zprow-container > .zpelem-col { display: flex; flex-direction: column; }
    .zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:last-child { flex: 1 1 auto; display: flex; flex-direction: column; }
    .zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:last-child .zpelem-button { margin-top: auto; }
}

/* Added August 28, 2026. Services page. Each tile title links to its */
/* service page. The link keeps the heading's own color, and a */
/* stretched overlay makes the whole photo box clickable, not just */
/* the title text. */
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-child { position: relative; }
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-child .zpheading a { color: inherit !important; text-decoration: none !important; }
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-child .zpheading a::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

/* Correction, same date. A hidden style tag leads each tile column, */
/* so the photo box is not :first-child. These first-of-type rules */
/* are the operative ones; the three first-child rules above are inert. */
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-of-type { position: relative; }
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-of-type .zpheading a { color: inherit !important; text-decoration: none !important; }
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-of-type .zpheading a::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; }

/* Added August 28, 2026. Services page. Other Matters, the fifth */
/* tile, sat alone at the left of its row. On desktop its row becomes */
/* a band matching the grid edges, photo on the left and description */
/* on the right. The row's filler columns are hidden and the tile */
/* column lays its two boxes side by side. Phone and tablet keep the */
/* stacked tile. */
@media (min-width: 993px) {
    .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-1"], .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-6"] { display: none !important; }
    .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-4"] { flex: 0 0 100% !important; max-width: 847px !important; margin: 0 auto !important; flex-direction: row !important; }
    .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-4"] > .zpelem-box:first-of-type { flex: 0 0 347px; }
    .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-4"] > .zpelem-box:last-child { flex: 1 1 auto; margin-left: 0; }
}

/* Added August 29, 2026. Services grid, after removing the Learn More buttons. */
/* Closes the gap between each photo and its description so the tile reads as */
/* one card, moves the click overlay from the photo box to the column so the */
/* whole card is clickable, and adds a hover cue: the photo darkens slightly */
/* and the title underlines. The inset shadow is used instead of transform */
/* because transform on the photo box would re-anchor the absolute overlay */
/* and cause hover flicker over the description. */
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:last-child {
  margin-top: 0 !important;
}
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col {
  position: relative;
}
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col > .zpelem-box:first-of-type {
  position: static;
  transition: box-shadow 0.2s ease;
}
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col:has(.zpheading a):hover > .zpelem-box:first-of-type {
  box-shadow: inset 0 0 0 999px rgba(0, 0, 0, 0.12);
}
.zscustom-section-127 .zprow-container .zprow-container > .zpelem-col:has(.zpheading a):hover .zpheading a {
  text-decoration: underline !important;
}
@media (min-width: 993px) {
  /* The Other Matters band boxes sit side by side, so the description keeps */
  /* the same top margin as the photo to stay level with it. */
  .zscustom-section-127 .zprow-container .zprow-container:last-of-type > div[class*="zpcol-md-4"] > .zpelem-box:last-child {
    margin-top: 20px !important;
  }
}



/* Added August 29, 2026. Service subpage titles stay centered with a short */
/* rule beneath so the centering reads as deliberate against the left */
/* aligned body. Applied via the subpage-title custom class on each of the */
/* five service subpage title headings. currentColor keeps the rule the */
/* same color as the heading text. */
/* Removed September 1, 2026. The short rule under the page title read as */
/* stray now that the title sits inside a header band, and because it centred */
/* under the title text it landed in a different place on every page. */
.subpage-title h2::after { display: none; }



/* Added August 29, 2026. Service subpage photo banners. Each subpage reuses */
/* its Services tile photo as a slim full width band under the title, via */
/* the subpage-banner custom class on the image element. object-fit crops */
/* the photo to the band height instead of showing it full size. */
.zpelement.subpage-banner .zpimage-container figure img {
  width: 100% !important;
  height: 180px !important;
  object-fit: cover !important;
}
@media (max-width: 992px) {
  .zpelement.subpage-banner .zpimage-container figure img {
    height: 140px !important;
  }
}





/* Added August 29, 2026. Resources page guide cards. The three Liberty guides */
/* sit above the rest of the library as cards rather than list items, so the */
/* pages we wrote lead the page. Markup lives inside the page text element, so */
/* the card wording stays editable in the visual editor. The stretched overlay */
/* on the title link makes the whole card clickable. The pending card carries */
/* no link and is dimmed until that page exists. */
.guide-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 0 0 10px;
}
@media (max-width: 992px) {
  .guide-cards { grid-template-columns: 1fr; }
}
.guide-card {
  position: relative;
  text-align: left;
  border: 1px solid #e2e6ea;
  padding: 18px 18px 20px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.guide-card:hover {
  box-shadow: 0 4px 14px rgba(0, 49, 105, 0.11);
  transform: translateY(-2px);
}
.guide-card-pending { opacity: 0.62; }
.guide-card-pending:hover { box-shadow: none; transform: none; }
.guide-card-title {
  display: block;
  font-size: 17px;
  line-height: 1.35;
  color: #003169 !important;
  margin-bottom: 6px;
  text-decoration: none !important;
}
.guide-card:hover a.guide-card-title { text-decoration: underline !important; }
a.guide-card-title::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
}
.guide-card-desc {
  display: block;
  font-size: 14px;
  line-height: 1.5;
  color: #4a5364;
}




/* Added August 30, 2026. Resources page. The six reference sections below the */
/* guide cards ran a full screen of scrolling. They are now collapsible rows */
/* built on native details and summary, so the page opens as six labelled */
/* lines and a visitor expands only the section wanted. No script required. */
.res-acc { margin: 6px 0 0; text-align: left; }
.res-acc-item { border-top: 1px solid #e2e6ea; }
.res-acc-item:last-of-type { border-bottom: 1px solid #e2e6ea; }
.res-acc-head {
  list-style: none;
  cursor: pointer;
  position: relative;
  padding: 15px 34px 15px 0;
  font-size: 20px;
  line-height: 1.3;
  color: #003169;
  outline: none;
}
.res-acc-head::-webkit-details-marker { display: none; }
.res-acc-head::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -7px;
  border-right: 2px solid #003169;
  border-bottom: 2px solid #003169;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}
.res-acc-item[open] > .res-acc-head::after {
  transform: rotate(-135deg);
  margin-top: -2px;
}
.res-acc-head:hover { text-decoration: underline; }
.res-acc-body { padding: 0 0 20px; }
.res-acc-body > *:first-child { margin-top: 0; }
.res-acc-body ul { margin: 0; padding-left: 0; }
.res-acc-body li { margin: 0 0 12px; }
.res-acc-body li:last-child { margin-bottom: 0; }
.res-acc-body > p { margin: 0 0 14px; }
@media (max-width: 992px) {
  .res-acc-head { font-size: 18px; padding: 14px 30px 14px 0; }
}





/* Added August 30, 2026. Pretrial vs Post-Conviction guide page. The guide */
/* runs about 11,000 words, so it carries a contents rail that sticks beside */
/* the text on desktop and collapses to a Contents button on phones. The rail */
/* is built by the page footer script from the headings inside .pg-body. */
.zpelem-text:has(.pg-body) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.pg-wrap { display: block; }
.pg-rail { text-align: left; }
.pg-body { text-align: left; }
.pg-body h2, .pg-body h3, .pg-body h4 { scroll-margin-top: 20px; }
.pg-subtitle {
  font-size: 17px;
  color: #5b6675;
  margin: 0 0 26px;
}
.pg-part-head {
  margin: 54px 0 18px;
  padding-top: 26px;
  border-top: 2px solid #003169;
}
.pg-body > .pg-part-head:first-of-type { margin-top: 34px; }
.pg-part-num {
  margin: 0 0 6px !important;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  color: #5b6675;
}
.pg-part-head h2 { margin: 0 !important; }
.pg-body h3 { margin: 34px 0 8px; }
.pg-body h4 {
  margin: 26px 0 6px;
  font-size: 13px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: #00734d;
}
.pg-body ul { list-style: none; padding-left: 0; margin: 0 0 16px; }
.pg-body ul li { position: relative; padding-left: 18px; margin: 0 0 9px; }
.pg-body ul li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 0.7em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #00734d;
}
.pg-disclaimer {
  margin-top: 34px !important;
  padding: 16px 18px;
  background: #f2f5f8;
  border-left: 3px solid #003169;
  color: #5b6675;
  font-size: 15px;
}

/* the rail */
.pg-rail-label {
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  color: #5b6675;
}
.pg-toggle {
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  color: #003169;
  background: #eef2f6;
  border: 1px solid #dbe1e9;
  border-radius: 3px;
  padding: 4px 12px;
  cursor: pointer;
}
.pg-rail-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.pg-filter {
  width: 100%;
  margin: 12px 0 10px;
  padding: 7px 10px;
  font: inherit;
  font-size: 14px;
  color: #232937;
  background: #ffffff;
  border: 1px solid #dbe1e9;
  border-radius: 3px;
}
.pg-empty { display: none; font-size: 14px; color: #5b6675; margin: 8px 0 0; }
.pg-rail.pg-none .pg-empty { display: block; }
.pg-toc, .pg-sub, .pg-sub2 { list-style: none; margin: 0; padding: 0; }
.pg-link {
  display: block;
  text-decoration: none;
  color: #232937;
  padding: 5px 9px;
  border-left: 2px solid transparent;
  line-height: 1.35;
}
.pg-link:hover { background: #eef2f6; text-decoration: none; }
.pg-l2 {
  display: flex;
  gap: 8px;
  align-items: baseline;
  font-size: 16px;
  font-weight: 700;
  color: #003169;
  margin-top: 12px;
}
.pg-toc > li:first-child .pg-l2 { margin-top: 0; }
.pg-num {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #7c8797;
  flex: none;
  padding-top: 2px;
}
.pg-l3 { font-size: 14px; padding-left: 30px; }
.pg-l4 { font-size: 13px; padding-left: 42px; color: #5b6675; }
.pg-sub2 { display: none; }
li.pg-open > .pg-sub2, .pg-filtering .pg-sub2 { display: block; }
.pg-link.pg-on { background: #eef2f6; border-left-color: #00734d; color: #003169; font-weight: 700; }
.pg-link.pg-hide { display: none; }

@media (min-width: 993px) {
  .pg-wrap { display: grid; grid-template-columns: 258px minmax(0, 1fr); gap: 44px; }
  .pg-body { max-width: 47rem; }
  .pg-rail-inner { position: sticky; top: 24px; }
  .pg-toggle { display: none; }
  .pg-scroll { max-height: calc(100vh - 190px); overflow-y: auto; padding-right: 4px; }
}
@media (max-width: 992px) {
  .pg-rail { margin: 0 0 26px; padding: 14px 0; border-top: 1px solid #dbe1e9; border-bottom: 1px solid #dbe1e9; }
  .pg-rail-panel { display: none; }
  .pg-rail.open .pg-rail-panel { display: block; }
  .pg-scroll { max-height: 60vh; overflow-y: auto; }
  .pg-part-head { margin-top: 42px; }
}




/* Added August 30, 2026. Resources page. Sub-labels inside the collapsible */
/* rows: the two under Laws That Govern This Work, and the three that split */
/* Reading Materials into articles, books and reports. Same treatment as the */
/* topic labels on the guide page so the two pages read as one system. */
.res-acc-body > .res-sub {
  margin: 24px 0 10px !important;
  font-size: 13px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  font-weight: 700;
  color: #00734d;
}
.res-acc-body > .res-sub:first-child { margin-top: 0 !important; }



/* Added September 1, 2026. Contact form fields. The theme drew the field */
/* borders in #e7e7e7, which is about 1.2 to 1 against white, so the boxes */
/* were nearly invisible. Borders darkened past the 3 to 1 minimum for a */
/* control edge, with hover and focus states so the active field is obvious. */
/* The Submit button is excluded so it keeps its green. */
.zpform-field-container input[type="text"],
.zpform-field-container input[type="email"],
.zpform-field-container input[type="tel"],
.zpform-field-container input[type="number"],
.zpform-field-container input[type="url"],
.zpform-field-container input[type="date"],
.zpform-field-container select,
.zpform-field-container textarea {
  border: 1px solid #7f8c9d !important;
  border-radius: 3px !important;
  background-color: #fdfdfe !important;
}
.zpform-field-container input[type="text"]:hover,
.zpform-field-container input[type="email"]:hover,
.zpform-field-container input[type="tel"]:hover,
.zpform-field-container select:hover,
.zpform-field-container textarea:hover {
  border-color: #5b6675 !important;
}
.zpform-field-container input[type="text"]:focus,
.zpform-field-container input[type="email"]:focus,
.zpform-field-container input[type="tel"]:focus,
.zpform-field-container input[type="number"]:focus,
.zpform-field-container input[type="url"]:focus,
.zpform-field-container input[type="date"]:focus,
.zpform-field-container select:focus,
.zpform-field-container textarea:focus {
  border-color: #00734d !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(47, 110, 91, 0.18) !important;
}



/* Added September 1, 2026, revised the same day. Civil Rights subpage banner. */
/* The band now runs 300px and carries the page title, so the crop sits at the */
/* bottom of the stone: the last two lines of the inscription read whole and the */
/* title sits on clear stone beneath them. Keyed to the file name, so update */
/* this if that photo is ever replaced. */
.zpelement.subpage-banner .zpimage-container figure img[src*="john-cardamone"] {
  object-position: 50% 100% !important;
}
@media (max-width: 992px) {
  .zpelement.subpage-banner .zpimage-container figure img[src*="john-cardamone"] {
    object-position: 50% 100% !important;
  }
}



/* Added September 1, 2026. Civil & Family subpage banner. Photo replaced */
/* with the consultation image. Default centering cut the frame at the */
/* subjects' chins, so the crop moves down to the hands, pen and */
/* documents. Keyed to the photo's file name, so update this if that */
/* photo is ever replaced. */
.zpelement.subpage-banner .zpimage-container figure img[src*="GREt_W30Y1w"] {
  object-position: 50% 55% !important;
}


/* Added September 1, 2026. Service subpage header band. The page title now sits */
/* inside the banner instead of above it, and the banner runs the full width of */
/* the window instead of stopping at the 1200px container, which is what made the */
/* body text underneath look indented. The column is forced to static so the */
/* banner positions against the section and can reach both edges; the column then */
/* carries a padding-top equal to the band height to hold the space back. Title */
/* left edge is set to match the body text, which sits 190px inside the column. */
@media (min-width: 993px) {
  .zpsection:has(.subpage-banner) { position: relative; padding-top: 0 !important; }
  .zpsection:has(.subpage-banner) > .zpcontainer { padding-top: 0 !important; }
  .zpsection:has(.subpage-banner) .zprow { padding-top: 0 !important; margin-top: 0 !important; }
  .zpelem-col:has(> .subpage-banner) { position: static !important; padding-top: 300px !important; }
  .zpelement.subpage-banner {
    position: absolute; top: 0; left: 0; right: 0;
    width: auto; max-width: none; margin: 0 !important;
  }
  .zpelement.subpage-banner .zpimage-container figure { position: relative; margin: 0; }
  .zpelement.subpage-banner .zpimage-container figure img { height: 300px !important; }
  .zpelement.subpage-banner .zpimage-container figure::after {
    content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    background: linear-gradient(90deg, rgba(0,17,40,0.59) 0%, rgba(0,17,40,0.46) 36%, rgba(0,17,40,0.17) 70%, rgba(0,17,40,0.03) 100%);
  }
  .zpelement.subpage-title {
    position: absolute; top: 0; height: 300px; z-index: 3;
    left: 50%; transform: translateX(-50%);
    width: 1100px; max-width: calc(100% - 100px);
    box-sizing: border-box; padding: 0 190px 46px; margin: 0 !important;
    display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
    text-align: left !important; pointer-events: none;
  }
}

/* Phone and tablet. Shorter band, and the scrim runs top to bottom instead of */
/* left to right because the title spans most of the width at this size. */
@media (max-width: 992px) {
  .zpsection:has(.subpage-banner) { position: relative; padding-top: 0 !important; }
  .zpsection:has(.subpage-banner) > .zpcontainer { padding-top: 0 !important; }
  .zpsection:has(.subpage-banner) .zprow { padding-top: 0 !important; margin-top: 0 !important; }
  .zpelem-col:has(> .subpage-banner) { position: static !important; padding-top: 216px !important; }
  .zpelement.subpage-banner {
    position: absolute; top: 0; left: 0; right: 0;
    width: auto; max-width: none; margin: 0 !important;
  }
  .zpelement.subpage-banner .zpimage-container figure { position: relative; margin: 0; }
  .zpelement.subpage-banner .zpimage-container figure img { height: 216px !important; }
  .zpelement.subpage-banner .zpimage-container figure::after {
    content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0;
    background: linear-gradient(175deg, rgba(0,17,40,0.27) 0%, rgba(0,17,40,0.41) 45%, rgba(0,17,40,0.64) 100%);
  }
  .zpelement.subpage-title {
    position: absolute; top: 0; left: 0; right: 0; height: 216px; z-index: 3;
    box-sizing: border-box; padding: 0 15px 20px; margin: 0 !important;
    display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
    text-align: left !important; pointer-events: none;
  }
  .zpsection:has(.subpage-banner) .zpelement.subpage-title h1,
  .zpsection:has(.subpage-banner) .zpelement.subpage-title h2,
  .zpsection:has(.subpage-banner) .zpelement.subpage-title h3 {
    font-size: 30px !important; line-height: 1.2 !important;
  }
}

/* Scoped to sections that actually carry a banner, so page titles on the pages */
/* without one keep the site navy. */
.zpsection:has(.subpage-banner) .zpelement.subpage-title h1,
.zpsection:has(.subpage-banner) .zpelement.subpage-title h2,
.zpsection:has(.subpage-banner) .zpelement.subpage-title h3 {
  color: #ffffff !important; margin: 0 !important; text-align: left !important;
  text-shadow: 0 1px 16px rgba(0,10,25,0.55);
}

/* Civil Rights on phone and tablet. The band shows most of the inscription at */
/* this size whatever the crop, so this photo alone gets a much darker scrim at */
/* the bottom, which lets the page title read over the carved letters. */
@media (max-width: 992px) {
  .zpelement.subpage-banner .zpimage-container figure:has(img[src*="john-cardamone"])::after {
    background: linear-gradient(175deg, rgba(0,17,40,0.30) 0%, rgba(0,17,40,0.55) 40%, rgba(0,17,40,0.93) 78%, rgba(0,17,40,0.96) 100%);
  }
}


/* Added September 1, 2026. Article typography, carried over from the guide */
/* page. Section headings get real space and a hairline above them so sections */
/* read as separate blocks instead of one continuous scroll, and list bullets */
/* become the same green dot the guide uses. Scoped to text elements. The guide */
/* page and the Resources accordion are excluded because they carry their own. */
/* An h3 that opens its element is left alone, which protects the Home boxes. */
.zpelem-text:not(:has(.pg-body)):not(:has(.res-acc)) h3:not(:first-child) {
  margin-top: 46px !important;
  margin-bottom: 10px !important;
  padding-top: 24px;
  border-top: 1px solid #e2e7ed;
}
.zpelem-text:not(:has(.pg-body)):not(:has(.res-acc)) ul {
  list-style: none;
  padding-left: 0;
  margin: 0 0 16px;
}
.zpelem-text:not(:has(.pg-body)):not(:has(.res-acc)) ul > li {
  position: relative;
  padding-left: 18px;
  margin: 0 0 9px;
}
.zpelem-text:not(:has(.pg-body)):not(:has(.res-acc)) ul > li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 0.7em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #00734d;
}
@media (max-width: 992px) {
  .zpelem-text:not(:has(.pg-body)):not(:has(.res-acc)) h3:not(:first-child) {
    margin-top: 34px !important;
    padding-top: 20px;
  }
}


/* Added September 1, 2026. Navy header band for the pages with no banner */
/* photograph, so every page opens the same way. The band is a pseudo-element */
/* on the section itself, and the section carries a padding-top equal to the */
/* band height so the content below sits clear of it. The title is pulled out */
/* of flow and sits inside the band, matching the service subpages. Keyed to */
/* the subpage-title class, so a page only gets a band once that class is on */
/* its title element. */
@media (min-width: 993px) {
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) {
    position: relative; padding-top: 300px !important;
  }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner))::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 300px;
    background: linear-gradient(180deg, #003a7c 0%, #002249 100%);
  }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .zpelem-col:has(> .subpage-title) { position: static !important; }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title {
    position: absolute; top: 0; height: 300px; z-index: 3;
    left: 50%; transform: translateX(-50%);
    width: 1100px; max-width: calc(100% - 100px);
    box-sizing: border-box; padding: 0 190px 46px; margin: 0 !important;
    display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
    text-align: left !important;
  }
}
@media (max-width: 992px) {
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) {
    position: relative; padding-top: 216px !important;
  }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner))::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 216px;
    background: linear-gradient(180deg, #003a7c 0%, #002249 100%);
  }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .zpelem-col:has(> .subpage-title) { position: static !important; }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title {
    position: absolute; top: 0; left: 0; right: 0; height: 216px; z-index: 3;
    box-sizing: border-box; padding: 0 15px 20px; margin: 0 !important;
    display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end;
    text-align: left !important;
  }
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h1,
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h2,
  .zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h3 { font-size: 30px !important; line-height: 1.2 !important; }
}
.zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h1,
.zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h2,
.zpsection:has(.subpage-title):not(:has(.subpage-banner)) .subpage-title h3 {
  color: #ffffff !important; margin: 0 !important; text-align: left !important;
}

/* Section eyebrow above the page title. Small green caps, the same label */
/* treatment the guide page uses. It names the part of the site the visitor */
/* is in: the five service subpages take it from the banner, and the three */
/* guides carry the eyebrow-guide class on their title element. */
.zpsection:has(.subpage-banner) .subpage-title::before { content: "Services"; }
.subpage-title.eyebrow-guide::before { content: "Guide"; }
.zpsection:has(.subpage-banner) .subpage-title::before,
.subpage-title.eyebrow-guide::before {
  display: block; order: -1;
  font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  color: #c3ccd6; margin: 0 0 10px;
}
.zpsection:has(.subpage-banner) .subpage-title::before {
  color: #c3ccd6;
  text-shadow: 0 1px 3px rgba(0,10,25,0.95), 0 0 14px rgba(0,10,25,0.9);
}
@media (max-width: 992px) {
  .zpsection:has(.subpage-banner) .subpage-title::before,
  .subpage-title.eyebrow-guide::before { font-size: 11px; margin: 0 0 7px; }
}

/* Added September 1, 2026. Photo banners for the eight pages that carried */
/* the plain navy band. The photo goes on the band pseudo-element rather */
/* than an Image element, keyed to a class on each page section, so no page */
/* markup changed. Two scrims sit over the photo: one running top to bottom */
/* so the title reads at any width, one running left to right for desktop. */
/* The last background-position pair is that photo's crop. */

/* About banner replaced September 4, 2026: the skyline read as generic. */
/* The photo is cropped to 2.4:1 starting at the band top, so the crop cuts */
/* below her mouth at desktop and at phone width alike, and the position is */
/* 50% 0% rather than a centred slice. */
/* About */
.zpsection.bnr-about::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-about-interview.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 0% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Services */
.zpsection.bnr-services::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/agence-olloweb-d9ILr-dbEdg-unsplash.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Working With Us */
.zpsection.bnr-wwu::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-working-with-us-meeting.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Resources */
.zpsection.bnr-resources::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-resources-book-spines.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Contact */
.zpsection.bnr-contact::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-contact-telephone.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Surveillance, Demystified */
.zpsection.bnr-surveillance::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-surveillance-rain-windshield.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Research and Privacy */
.zpsection.bnr-research::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-research-blinds-window.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* Pretrial vs. Post-Conviction */
.zpsection.bnr-pretrial::before {
  background-image:
    linear-gradient(180deg, rgba(0,17,40,0.16) 0%, rgba(0,17,40,0.34) 55%, rgba(0,17,40,0.70) 100%),
    linear-gradient(90deg, rgba(0,17,40,0.46) 0%, rgba(0,17,40,0.23) 45%, rgba(0,17,40,0.01) 100%),
    url("/banner-pretrial-courthouse-columns.jpg") !important;
  background-size: cover, cover, cover !important;
  background-position: 0 0, 0 0, 50% 50% !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
}

/* ---------------------------------------------------------------- */
/* Contact page form. September 1, 2026.                             */
/* The page ran three left edges: the title and the paragraphs sat   */
/* 190px into the container, the form heading and the field labels   */
/* sat at the container edge, and the fields and Submit sat 290px    */
/* in. The label column also held the form in the left two thirds    */
/* and left about 370px of white down the right side. Labels now sit */
/* above their fields, the block matches the body text column, and   */
/* Submit matches the rectangular buttons used elsewhere. The form   */
/* title is hidden because the header band already names the page.   */
/* ---------------------------------------------------------------- */
.zpelem-lpform .zpform-info {
  display: none !important;
}
.zpsection:has(.zpelem-lpform) {
  padding-top: 0 !important;
}
@media (min-width: 993px) {
  .zpelem-lpform {
    width: 720px !important;
    max-width: 100% !important;
    margin-left: 190px !important;
    margin-right: 190px !important;
  }
}
.zpelem-lpform .zpform-outer li {
  flex-direction: column !important;
  align-items: stretch !important;
  margin-bottom: 18px !important;
}
.zpelem-lpform .zpform-outer li .zpform-label-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 6px !important;
}
.zpelem-lpform .zpform-outer li .zpform-field-container {
  width: 100% !important;
  max-width: none !important;
  flex: 0 0 auto !important;
}
.zpelem-lpform .zpform-outer input,
.zpelem-lpform .zpform-outer textarea,
.zpelem-lpform .zpform-outer select {
  width: 100% !important;
  box-sizing: border-box !important;
}
.zpelem-lpform .zpform-outer input.zpbutton {
  border-radius: 0 !important;
  padding: 10px 28px !important;
  width: auto !important;
}

/* ---------------------------------------------------------------- */
/* Home page text links. September 1, 2026.                          */
/* The three buttons under the Home boxes became Link type buttons,  */
/* which render as plain green text. Colour alone is a weak signal   */
/* that something is clickable, so they carry an underline on hover  */
/* and on keyboard focus.                                            */
/* ---------------------------------------------------------------- */
.zpbutton.zpbutton-type-link:hover,
.zpbutton.zpbutton-type-link:focus {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* ---------------------------------------------------------------- */
/* Home page spacing. September 2, 2026.                             */
/* The two content sections opened at different heights, 91px on the */
/* first and 117px on the second, because each carried a spacer      */
/* element on top of its own section padding. The gap under each     */
/* section heading also differed, 20px against 58px. Both now open   */
/* at 70px and both headings clear their content by 40px. The three  */
/* spacers doing the old work are hidden rather than deleted, so      */
/* they can be brought back from the page if this is ever undone.    */
/* ---------------------------------------------------------------- */
@media (min-width: 993px) {
  .zscustom-section-119 {
    padding-top: 50px !important;
  }
  .zpelement[data-element-id="elm_ZHZAcN2yIOPNLRSl--ZElg"],
  .zpelement[data-element-id="elm_w3I_hin0XjA_nltfAUwL2g"],
  .zpelement[data-element-id="elm_BOboqFX5EWH6EHq89zDMDw"] {
    display: none !important;
  }
  .zscustom-section-119 .zprow.zprow-equalCol {
    margin-top: 20px !important;
  }
  .zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-box {
    margin-top: 40px !important;
  }
}

/* ---------------------------------------------------------------- */
/* Home box lists. September 2, 2026.                                */
/* Each item carried 5px of padding above and below plus a 9px       */
/* margin, so the ten services read as ten separate blocks rather    */
/* than one list. The items now sit on consecutive lines.            */
/* ---------------------------------------------------------------- */
.zscustom-section-119 .zpelem-box .zpelem-text ul > li {
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* ---------------------------------------------------------------- */
/* Home service row, names only. September 2, 2026.                  */
/* The row was five green icon squares with a green label beside     */
/* each. With the buttons gone it was the only place on the page     */
/* where five blocks of the accent colour sat together, two labels   */
/* wrapped to two lines while three did not, the one-line labels     */
/* top-aligned against a 52px icon instead of centring on it, and    */
/* the glyphs said nothing the names did not. The icons are hidden   */
/* and the five names run across the row in navy, centred in even    */
/* fifths and divided by hairlines.                                  */
/* This supersedes the three earlier blocks that sized the icon and  */
/* label columns, dated July 27 and August 1, 2026. They are left in */
/* place so the old row can be restored by removing this block.      */
/* ---------------------------------------------------------------- */
.zscustom-section-121 .zpelem-icon {
  display: none !important;
}
@media (min-width: 993px) {
  .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-4.zpcol-12 {
    display: none !important;
  }
  .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-7.zpcol-12,
  .zscustom-section-121 .zprow-container .zpelem-col.zpcol-md-8.zpcol-12 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
  }
  .zscustom-section-121 .zprow-equalCol > .zpelem-col {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }
  .zscustom-section-121 .zprow-equalCol > .zpelem-col + .zpelem-col {
    border-left: 1px solid #dde4ea;
  }
}
.zscustom-section-121 .zpelem-heading,
.zscustom-section-121 .zpelem-heading h5,
.zscustom-section-121 .zpelem-heading h5 a {
  text-align: center !important;
  display: block;
}
.zscustom-section-121 .zpelem-heading h5 {
  font-size: 15px !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}
.zscustom-section-121 .zpelem-heading a {
  color: #00734d !important;
}
.zscustom-section-121 .zpelem-heading a:hover {
  color: #00563a !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}

/* ---------------------------------------------------------------- */
/* Home Consultations block. September 2, 2026.                      */
/* The box carried 50px of padding on desktop and 25px on a phone,   */
/* and its background is the same grey as the section, so all of it  */
/* read as empty space rather than as a panel. Below the link the    */
/* box padding and the section padding stacked into 100px of grey,   */
/* and the content sat 50px in from the Experience heading above it. */
/* Padding removed, so the heading, the paragraph and the link line  */
/* up with the Experience heading and the section controls the gaps. */
/* ---------------------------------------------------------------- */
.zscustom-section-120 .zpelem-col:not(:has(> .zpelem-heading)) > .zpelem-box {
  padding: 0 !important;
}

/* ---------------------------------------------------------------- */
/* Home box links and footer hierarchy. September 2, 2026.           */
/* The three box links are pushed to the bottom of equal-height      */
/* boxes, so the distance from each link to the text above it ran    */
/* 0px, 3px and 224px. A hairline above each link, with air either   */
/* side, keeps the links on one line across the row and turns the    */
/* space in the third box into something deliberate.                 */
/* ---------------------------------------------------------------- */
.zscustom-section-119 .zpelem-box .zpelem-text {
  margin-bottom: 22px !important;
}
.zscustom-section-119 .zpelem-box .zpelem-button {
  border-top: 1px solid #dbe1e7;
  padding-top: 20px !important;
}

/* The footer set every line at 16px in the same white, so seven     */
/* stacked elements carried no hierarchy. The contact block stays as */
/* it is. The licensing and affiliation lines drop to 13px muted     */
/* under a hairline, and the copyright drops to 12px fainter still.  */
.zpelement[data-element-id="elm_OBw9VuIR3su576A9NDGBhg"] {
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  padding-top: 22px !important;
  max-width: 880px !important;
  margin-top: 28px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.zpelement[data-element-id="elm_OBw9VuIR3su576A9NDGBhg"] p {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: rgba(255, 255, 255, 0.62) !important;
  margin: 0 0 4px !important;
}
.zpelement[data-element-id="elm_OBw9VuIR3su576A9NDGBhg"] p:last-child {
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.45) !important;
  margin: 12px 0 0 !important;
}

/* ---------------------------------------------------------------- */
/* One link colour. September 2, 2026.                               */
/* Three colours were saying "this is a link": #46a387, the button   */
/* green that Zoho gives its Link button type, on the four in-body   */
/* links on Home; #00734d, the site link green, on in-content links  */
/* everywhere else; and navy on the five service names. Against      */
/* white #46a387 measures 3.1 to 1, below the 4.5 to 1 floor for     */
/* text, which is why those links read as washed out. Everything     */
/* clickable inside content is now #00734d at 6.0 to 1. #46a387      */
/* stays for button fills, where white type sits on top of it.       */
/* ---------------------------------------------------------------- */
.zpbutton.zpbutton-type-link,
.zpbutton.zpbutton-type-link .zpbutton-content {
  color: #00734d !important;
}

/* ---------------------------------------------------------------- */
/* Hero button. September 2, 2026.                                   */
/* The button sat 122px below the hero, which is clamped to 540px    */
/* with overflow hidden, so on desktop it was cut off and never      */
/* displayed. On a phone the hero grows and it did render, as a      */
/* white block on a pale part of the photo at the hero bottom edge.  */
/* The tagline row carried a 164px top margin; at 100px the whole    */
/* block fits inside 540px with 40px clear beneath the button.       */
/* The button now matches the footer: white outline, white type,     */
/* square, 10px by 28px. It adds a dark scrim behind the outline     */
/* because it sits on a photograph rather than on flat navy.         */
/* ---------------------------------------------------------------- */
@media (min-width: 993px) {
  .zphero .zpcontainer > .zprow:nth-of-type(2) {
    margin-top: 100px !important;
  }
  .zphero .zpcontainer > .zprow:nth-of-type(3) {
    padding-top: 8px !important;
    padding-bottom: 0 !important;
  }
  .zphero .zpelement.zpelem-button {
    margin-top: 12px !important;
  }
}
.zphero .zpbutton {
  background-color: rgba(10, 18, 30, 0.34) !important;
  border: 1px solid #ffffff !important;
  border-radius: 0 !important;
  padding: 10px 28px !important;
}
.zphero .zpbutton,
.zphero .zpbutton .zpbutton-content {
  color: #ffffff !important;
}
.zphero .zpbutton:hover {
  background-color: rgba(10, 18, 30, 0.55) !important;
}

/* Home hero photo, replaces the Zoho stock image */
.zphero .zpslider-img {
  background-image:
    linear-gradient(to right, rgba(18, 24, 32, 0.60), rgba(18, 24, 32, 0.28)),
    url("/hero-home-desk.jpg") !important;
  background-position: 50% 50%, 50% 55% !important;
}

/* ---------------------------------------------------------------- */
/* Home hero on tablet and phone. September 2, 2026.                 */
/* The August 16 rule releases the 540px pin below 992px so the hero */
/* sizes to its content. The theme puts 220px above the heading and  */
/* 144px above the button, so the hero ran 880px tall at 414px wide. */
/* In a window that tall the photograph crops to a narrow centre     */
/* strip and the desk, laptop and folio fall outside the frame.      */
/* The stack is tightened and centred in its container, the hero is  */
/* pinned to 430px, and the heading drops to 34px on a phone. The    */
/* left to right scrim is replaced with a top weighted one, since on */
/* a narrow screen the type sits over the whole width, not the left. */
/* Only the Home page carries .theme-banner, so this stays scoped.   */
/* ---------------------------------------------------------------- */
@media (max-width: 992px) {
  .theme-banner, .theme-banner .zpslider-img,
  .theme-banner .hero-container, .theme-banner .zphero {
    height: auto !important;
    min-height: 430px !important;
  }
  .zphero .zpcontainer {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }
  .zphero .zpcontainer > .zprow {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .zphero .zpelem-heading { margin-top: 0 !important; }
  .zphero .zpcontainer > .zprow:nth-of-type(2) { margin-top: 0 !important; }
  .zphero .zpcontainer > .zprow:nth-of-type(2) > .zpelem-col { margin-top: 0 !important; }
  .zphero .zpelem-codesnippet { margin-top: 8px !important; }
  .zphero .zpelem-button {
    margin-top: 4px !important;
    margin-bottom: 0 !important;
  }
  .zphero .zpslider-img {
    background-image:
      linear-gradient(to bottom, rgba(18, 24, 32, 0.62) 0%, rgba(18, 24, 32, 0.54) 62%, rgba(18, 24, 32, 0.24) 100%),
      url("/hero-home-desk.jpg") !important;
    background-position: 50% 50%, 50% 55% !important;
  }
}
@media (max-width: 767px) {
  .zphero .zpelem-heading .zpheading,
  .zphero .zpelem-heading h1,
  .zphero .zpelem-heading h2 {
    font-size: 34px !important;
    line-height: 1.2 !important;
  }
}

/* ---------------------------------------------------------------- */
/* Home Experience block. September 2, 2026.                         */
/* The heading was set to centre alignment inside its own column, so */
/* it floated toward the middle of that column while every other     */
/* line on the page sat left. That is what read as a 32px offset.    */
/* The text sat inside a white box with 50px of side padding on a    */
/* grey section, the only card in the section, so the heading and    */
/* its paragraphs never shared an edge. Her pick: drop the card, put */
/* the heading, the paragraphs and the Consultations heading below   */
/* on one edge. The photograph carried its own intrinsic height of   */
/* 661px, unrelated to the text, so it ran past the bottom of the    */
/* text at some widths. It now stretches to fill its column, so its  */
/* top meets the heading and its bottom meets the last line at any   */
/* window width. Stacked layouts keep the photo's natural height.    */
/* ---------------------------------------------------------------- */
.zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-heading,
.zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-heading .zpheading,
.zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-heading h2 {
  text-align: left !important;
}
.zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-box {
  padding-left: 0 !important;
  padding-right: 0 !important;
  background-color: transparent !important;
}
@media (min-width: 993px) {
  .zscustom-section-120 .zpelem-col:has(> .zpelem-heading) > .zpelem-box {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .zscustom-section-120 .zprow.zpalign-items-flex-start {
    align-items: stretch !important;
  }
  .zscustom-section-120 .zpelem-col.zpcol-md-5 { position: relative !important; }
  .zscustom-section-120 .zpelem-col.zpcol-md-5 > .zpelem-image {
    position: absolute !important;
    top: 20px !important;
    bottom: 0 !important;
    left: 15px !important;
    right: 15px !important;
    margin: 0 !important;
  }
  .zscustom-section-120 .zpelem-col.zpcol-md-5 .zpimage-container,
  .zscustom-section-120 .zpelem-col.zpcol-md-5 .zpimage-data-ref {
    height: 100% !important;
    margin: 0 !important;
  }
  .zscustom-section-120 .zpelem-col.zpcol-md-5 img {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
  }
}

/* ---------------------------------------------------------------- */
/* Home Consultations block spacing. September 2, 2026.              */
/* The paragraph sat 20px under the heading rule and 44px above the  */
/* Contact Us link, so it read as belonging to the heading and       */
/* floating away from its own link. The Experience block above it    */
/* runs 40px from heading to text. Matched to that, and the gap to   */
/* the link cut to 24px by hiding the 4px spacer between them.       */
/* Same 20 over 41 split appeared at 414px, so this is not scoped.   */
/* ---------------------------------------------------------------- */
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-box > .zpelem-text {
  margin-top: 40px !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-box > .zpelem-spacer {
  display: none !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-box > .zpelem-button {
  margin-top: 24px !important;
}

/* ---------------------------------------------------------------- */
/* Home Consultations block, centred. September 2, 2026.             */
/* The paragraph element carried Zoho's default 720px width with a   */
/* 380px right margin, while the heading, its rule and the Contact   */
/* Us link all spanned the full 1100px row. Only the paragraph       */
/* stopped short, so the block piled up on the left with a third of  */
/* the row empty. Her pick: centre the whole block, paragraph held   */
/* to 760px. The heading rule is an ::after on .zpheading and is     */
/* left aligned by the theme, so it needs auto margins of its own.   */
/* ---------------------------------------------------------------- */
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-box > .zpelem-text {
  width: 760px !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-box .zptext {
  text-align: center !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-heading,
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpelem-heading h5 {
  text-align: center !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpheading::after {
  margin-left: auto !important;
  margin-right: auto !important;
}
.zscustom-section-120 .zpelem-col.zpcol-md-12 .zpbutton-container {
  text-align: center !important;
  justify-content: center !important;
}

/* ---------------------------------------------------------------- */
/* Menu current-page marker. September 2, 2026.                      */
/* The theme filled the current item with a solid #46a387 pill, the  */
/* same green as the site's buttons, so it read as something to      */
/* press rather than a note of where you are. White on that green is */
/* 3.1 to 1, under the 4.5 to 1 floor, the same measurement that     */
/* moved content links off it. It also only appeared on the five     */
/* top-level pages: on the five service subpages and the three       */
/* guides the selected item sits inside a dropdown, so the visible   */
/* bar carried no marker at all.                                     */
/* Her pick: drop the fill, underline the current item in white, and */
/* underline Services or More when one of their child pages is open, */
/* using :has, so all fourteen pages show where you are. The anchors  */
/* are already position relative and their ::after is unused.        */
/* Below 993px the burger panel is white with no pill, so there the  */
/* selected item only moves from #46a387 to #00734d, 6.0 to 1.       */
/* ---------------------------------------------------------------- */
@media (min-width: 993px) {
  .theme-header-navigation-style .theme-menu > ul > li.theme-menu-selected > a {
    background: transparent !important;
    color: #ffffff !important;
  }
  .theme-header-navigation-style .theme-menu > ul > li.theme-menu-selected > a::after,
  .theme-header-navigation-style .theme-menu > ul > li:has(li.theme-menu-selected) > a::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 3px;
    height: 2px;
    background: #ffffff;
  }
}
@media (max-width: 992px) {
  .theme-menu ul li.theme-menu-selected > a {
    color: #00734d !important;
  }
}

/* ---------------------------------------------------------------- */
/* Other Matters tile photo. September 2, 2026.                      */
/* The magnifying glass moved up to the Services band at her         */
/* direction, so the Other Matters tile below it would have shown    */
/* the same photograph twice on one screen. The tile takes the       */
/* records aisle photo instead. Zoho sets this box's background in   */
/* its own generated CSS, so this overrides by element id; the       */
/* builder still has the old photo selected on that box.             */
/* ---------------------------------------------------------------- */
.zpelement[data-element-id="elm_Y7McngVdfEA1yOzeXVW5aQ"] {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
    url("/a-c-DzVD6DcCuB4-unsplash.jpg") !important;
  background-size: cover, cover !important;
  background-position: 50% 50%, 50% 40% !important;
}

/* Added September 2, 2026. Band title width, set per page. The title used a */
/* fixed 190px inset on every page. That matched the body text at 1400px but */
/* drifted as the window narrowed, because the body blocks are fixed widths */
/* centred in the column rather than fixed insets, and three pages use a */
/* different width from the rest. The title now takes the same width as the */
/* body block on its own page and centres the same way, so the two left edges */
/* stay together at every desktop width. Standard pages run a 720px body. */
/* About and the Pretrial vs. Post-Conviction guide run the full column. The */
/* Services intro is 847px to line up with the tile grid below it. Phone and */
/* tablet are unchanged. */
@media (min-width: 993px) {
  .zpsection .subpage-title {
    width: 720px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .zpsection.bnr-about .subpage-title,
  .zpsection.bnr-pretrial .subpage-title {
    width: 1100px !important;
  }
  .zpsection.bnr-services .subpage-title {
    width: 847px !important;
  }
}

/* Added September 2, 2026. Other Matters subpage banner. The magnifying glass */
/* moved to the Services band, and this page took the records room photo that */
/* the Other Matters tile now carries. Centred vertically the band cuts across */
/* her shoulders, so the crop sits higher and keeps her head in frame. */
.zpelement.subpage-banner .zpimage-container figure img[src*="DzVD6DcCuB4"] {
  object-position: 50% 40% !important;
}

/* Added September 2, 2026. Green now marks one thing on the site: something */
/* you can click. The link green moved from #2f6e5b to #00734d, the same */
/* weight on the page (5.9:1 on white against 6.0 before) but fully saturated */
/* instead of 40 percent, so it reads as green rather than as slate. Body */
/* links also carry an underline, since colour alone sits at 2.5:1 against */
/* the body text and does not mark a link for a reader scanning the page or */
/* for anyone who cannot separate the two hues. The small caps labels that */
/* are not clickable moved off green to #66707e, and the band eyebrows to a */
/* light neutral, so nothing green is inert. Guide cards and the contents */
/* rail keep their own treatment and stay free of underlines. */
.theme-content-area .zpelem-text a:not(.pg-link):not(.guide-card-title) {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: rgba(0, 115, 77, 0.45);
}
.theme-content-area .zpelem-text a:not(.pg-link):not(.guide-card-title):hover,
.theme-content-area .zpelem-text a:not(.pg-link):not(.guide-card-title):focus {
  text-decoration-color: #00734d;
}
.pg-body h4,
.res-sub,
.res-acc-body > .res-sub {
  color: #66707e !important;
}

/* Added September 2, 2026. The Resources dropdown listed three document */
/* titles and nothing else, so it did not say the three were guides, and it */
/* hid the laws, public records and reading material on the page. Two section */
/* entries now label it: Our Guides over the three, and Other Resources at */
/* the foot above a hairline. Both take the small caps label treatment used */
/* elsewhere on the site, and the guide titles indent under their label. Our */
/* Guides links to its own section, as does Other Resources. Both hrefs */
/* changed when the section anchors were built, so the selectors here were */
/* rewritten on September 4, 2026 to match the new ones. */
.theme-sub-menu a[href="/resources#our-guides"],
.theme-sub-menu a[href="/resources#other-resources"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 1.6px !important;
  text-transform: uppercase !important;
  color: #66707e !important;
}
.theme-sub-menu a[href="/resources#our-guides"] {
  cursor: pointer;
}
.theme-sub-menu a[href="/resources#other-resources"]:hover,
.theme-sub-menu a[href="/resources#other-resources"]:focus {
  color: #003169 !important;
}
.theme-sub-menu li:has(> a[href="/resources#other-resources"]) {
  border-top: 1px solid rgba(0, 49, 105, 0.14);
  margin-top: 6px;
  padding-top: 6px;
}
.theme-sub-menu:has(a[href="/resources#our-guides"]) a:not([href="/resources#our-guides"]):not([href="/resources#other-resources"]) {
  padding-left: 24px !important;
}

/* Added September 2, 2026. Menu hover, matched to the current-page marker. */
/* The theme still painted a #46a387 pill behind a hovered top-level item, */
/* left from when the selected state was a pill; the selected state became a */
/* white underline on September 2 and the hover never followed. Hover now */
/* takes the same underline at 55 percent, so the page you are on stays the */
/* solid one. In the dropdown the hover text was #46a387, 2.7 to 1 on the */
/* grey it sits over, and moves to the link green at 5.1 to 1. */
@media (min-width: 993px) {
  .theme-header-navigation-style .theme-menu > ul > li > a:hover,
  .theme-header-navigation-style .theme-menu > ul > li > a:focus {
    background: transparent !important;
    color: #ffffff !important;
  }
  .theme-header-navigation-style .theme-menu > ul > li > a:hover::after,
  .theme-header-navigation-style .theme-menu > ul > li > a:focus::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 3px;
    height: 2px;
    background: rgba(255, 255, 255, 0.55);
  }
  .theme-header-navigation-style .theme-menu > ul > li.theme-menu-selected > a:hover::after,
  .theme-header-navigation-style .theme-menu > ul > li:has(li.theme-menu-selected) > a:hover::after {
    background: #ffffff;
  }
}
.theme-sub-menu li > a:hover,
.theme-sub-menu li > a:focus {
  color: #00734d !important;
}
.theme-sub-menu a[href="/resources#our-guides"]:hover {
  color: #003169 !important;
  background: transparent !important;
}

/* Added September 2, 2026, her pick. The three guides were bordered tiles in */
/* a 3 up grid above a list of collapsible rows, so the page ran two visual */
/* systems, and at 720px each tile was only 229px wide, which wrapped the */
/* first title and left the three descriptions at different depths. The */
/* guides now take the same full width rhythm as the rows below them: a */
/* hairline above, the title at the row heading size, the description under */
/* it. They still read as the featured items because they carry a */
/* description; the reference rows below are bare titles with a caret. The */
/* whole row stays clickable through the stretched overlay already on the */
/* title, and the hover cue is the underline alone, without the card lift. */
.guide-cards {
  display: block !important;
  margin: 0 0 4px !important;
}
.guide-card {
  border: 0 !important;
  border-top: 1px solid #e2e6ea !important;
  padding: 15px 0 !important;
  transition: none !important;
}
.guide-card:hover {
  box-shadow: none !important;
  transform: none !important;
}
.guide-card-title {
  font-size: 20px !important;
  line-height: 1.3 !important;
  margin-bottom: 3px !important;
}

/* Added September 2, 2026. Every page's title became an H1. The site had no */
/* H1 anywhere: band titles were H2 and the hero heading was H2, so all */
/* fourteen pages were headless to search engines and screen readers. Both */
/* band rules already named h1 alongside h2 and h3, so the band titles kept */
/* their size on the switch. The hero did not: the theme sets H1 larger than */
/* H2, so the Home heading is pinned back to the 48px it has always been. */
/* The rule hiding the theme's decorative underline was written for h2 only */
/* and now covers h1 as well. */
@media (min-width: 993px) {
  .theme-banner .zpelem-heading h1,
  .zphero .zpelem-heading h1,
  .zphero .zpelem-heading h1.zpheading {
    font-size: 48px !important;
    line-height: 1.6 !important;
  }
}
.subpage-title h1::after {
  display: none;
}

/* Added September 3, 2026. The five service subpages ran their body text */
/* at 720px inside an 1100px column, which read as indented against the */
/* full-width banner. Body text and band title now take 847px, the width */
/* the Services page already uses. Those five are the only pages carrying */
/* subpage-banner. */
@media (min-width: 993px) {
  .zpsection:has(.subpage-banner) .zpelement.subpage-title,
 .zpsection:has(.subpage-banner) .zpelement.zpelem-text,
.zpsection:has(.subpage-banner) + .zpsection .zpelement.zpelem-text {
    width: 847px !important;
    max-width: 847px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
 

/* Added September 3, 2026. john-cardamone-scrim-marker. The Civil Rights */
/* banner crop carries lettering behind the band title, so the scrim on */
/* that one banner is darkened. Every other banner keeps the site-wide */
/* values. */
.zpelement.subpage-banner figure:has(img[src*="john-cardamone"])::after {
  background-image: linear-gradient(90deg, rgba(0, 17, 40, 0.72) 0%, rgba(0, 17, 40, 0.6) 36%, rgba(0, 17, 40, 0.28) 70%, rgba(0, 17, 40, 0.06) 100%) !important;
}
 

/* Added September 4, 2026. Civil Rights band. The 1600x253 strip held three */
/* lines of the inscription, and once the window fell below about 1900px the */
/* sides were cropped and words broke mid-letter. The band now draws the whole */
/* first block of the quote from the full photograph, and its height follows */
/* the window width, so the same five lines read at every size and nothing is */
/* cut. 29.375vw is 470/1600 of the width; the 17.6% vertical position puts */
/* the crop at y 118 of the 1142px original. */
.zpsection:has(.subpage-banner img[src*="john-cardamone"]) .zpelement.subpage-banner .zpimage-container figure {
  background-image: url("/john-cardamone-xCkGzk3baGg-unsplash.jpg");
  background-size: cover;
  background-position: 50% 17.6%;
  background-repeat: no-repeat;
}
.zpsection:has(.subpage-banner img[src*="john-cardamone"]) .zpelement.subpage-banner .zpimage-container figure img {
  opacity: 0 !important;
  height: 29.375vw !important;
}
.zpsection:has(.subpage-banner img[src*="john-cardamone"]) .zpelem-col:has(> .subpage-banner) {
  padding-top: 29.375vw !important;
}
.zpsection:has(.subpage-banner img[src*="john-cardamone"]) .zpelement.subpage-title {
  height: 29.375vw !important;
}

/* The page title sits over the last line of the quote, so the foot of this */
/* one banner is carried down further than the site-wide scrim reaches. */
.zpsection:has(.subpage-banner img[src*="john-cardamone"]) .zpelement.subpage-banner .zpimage-container figure::before {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 58%;
  background: linear-gradient(180deg, rgba(0, 17, 40, 0) 0%, rgba(0, 17, 40, 0.30) 52%, rgba(0, 17, 40, 0.66) 100%);
  z-index: 1;
}

/* Contact form: the Zoho captcha is case sensitive and offers no setting */
/* for it, so the field carries a note. */
.zpform-field-container.zpform-verification-group::after {
  content: "Enter the code exactly as shown, including capital letters.";
  display: block;
  margin-top: 10px;
  font-size: 14px;
  line-height: 1.5;
  color: #66707e;
}

/* Contact form: Submit matches the outline buttons used everywhere else. */
input.zpbutton[type="submit"] {
  background-color: transparent !important;
  color: #003169 !important;
  border: 1px solid #003169 !important;
  border-radius: 0 !important;
}
input.zpbutton[type="submit"]:hover {
  background-color: #003169 !important;
  color: #ffffff !important;
}


/* Contact: the confidentiality line now sits in the intro above the form. */
/* The element it used to occupy is hidden rather than deleted. */
[data-element-id="elm_BgYaLPFZahAP3eSapCAGmw"] {
  display: none !important;
}

/* Added September 4, 2026. The September 2 hover fix matched a:hover, which */
/* does not fire while the cursor sits on a dropdown item, so the theme kept */
/* painting its green pill behind the parent tab whenever a submenu item was */
/* hovered. Matching the list item covers both, and the underline now holds */
/* while the dropdown is open. */
@media (min-width: 993px) {
  .theme-header-navigation-style .theme-menu > ul > li:hover > a {
    background: transparent !important;
    color: #ffffff !important;
  }
  .theme-header-navigation-style .theme-menu > ul > li:hover > a::after {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    bottom: 3px;
    height: 2px;
    background: rgba(255, 255, 255, 0.55);
  }
  .theme-header-navigation-style .theme-menu > ul > li.theme-menu-selected:hover > a::after,
  .theme-header-navigation-style .theme-menu > ul > li:has(li.theme-menu-selected):hover > a::after {
    background: #ffffff;
  }
}