/* v3 pages styles. Owned by the pages cluster (implementation/theme-v3-2026-10-02/BRIEF.md). Loaded on every page after style.css and home.css; scope rules by body class. */
/* Reviews (page-reviews.php), Contact (page-contact.php), 404 (404.php). Each page sets --v3-gap, the column gap its grids share
   (the home client ledger's), so the second column of every row on the page starts on the same line. */

/* ==========================================================================================================================
   REVIEWS, labeled "Recognition" (page-reviews.php), revamped 2026-10-06 (Dan). A compact ink header, then four sections
   the nav's menu jumps to: the courthouse band (What judges say), Peer recognition (the marks, then an attorney's words
   as a callout), What clients say (two columns on limestone-light), In the press (a grid of clippings).
   ========================================================================================================================== */
.v2-page-reviews { --v3-gap: clamp(2.5rem, 6vw, 6rem); }
/* The top of the page (2026-10-07): one ink band over the courthouse photo. The H1 and lede, then "What judges say"
   under a sky rule and both quotes side by side, each with its court and date. The overlay is even, since the text now
   runs across the whole width. */
.v3-rec-top { padding: clamp(3rem, 6vw, 5rem) 0 clamp(3.5rem, 7vw, 6rem); }
.v3-rec-top::after { background: linear-gradient(180deg, rgba(14, 26, 36, .9) 0%, rgba(14, 26, 36, .84) 45%, rgba(14, 26, 36, .9) 100%); }
.v3-rec-title h1 { font-size: var(--t-page-h1); line-height: .98; letter-spacing: -.025em; color: var(--white); }
.v3-rec-title .lede { margin: 1rem 0 0; max-width: 40rem; color: var(--ice); }
.v3-rec-judges-head { margin: clamp(3rem, 6vw, 4.5rem) 0 0; padding-top: 1.25rem; border-top: 2px solid var(--sky); font-size: clamp(1.5rem, 2.2vw, 1.875rem); color: var(--white); }
.v3-rec-judges { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem var(--v3-gap); margin-top: clamp(1.75rem, 3vw, 2.5rem); }
.v3-rec-judge { max-width: none; }
.practice-quote .v3-rec-judge p { font-size: clamp(1.125rem, 1.4vw, 1.25rem); line-height: 1.48; letter-spacing: -.004em; }
.practice-quote .v3-rec-judge figcaption { margin-top: 1.25rem; padding-top: .9rem; border-top: 1px solid var(--rule-dark); }

/* The courthouse band's optional visible heading (template-parts/courthouse-quote.php, heading_visible). */
.practice-quote-head { grid-column: 1; grid-row: 1; align-self: start; }
.practice-quote-head h2 { padding-top: 1.25rem; border-top: 2px solid var(--sky); font-size: clamp(1.5rem, 2.2vw, 1.875rem); color: var(--white); text-wrap: balance; }
.practice-quote-head + .practice-quote-list { grid-row: 1; }

/* Sections below: one head (steel rule across the wrap, the H2). */
.v3-rec-section { padding: var(--space-section) 0; }
.v3-rec-head { margin: 0; border-top: 2px solid var(--steel); padding-top: 1.25rem; font-size: clamp(1.5rem, 2.2vw, 1.875rem); text-wrap: balance; }

/* Recognition (template-parts/recognition.php; Reviews and Firm): three marks, hairlines between them. Each mark's name
   in Source Serif (as in the home hero), what it recognizes in serif text, then who, as ruled rows linking to the
   official profiles: lake, underlined on hover and focus, not at rest, so the section doesn't read as a link list. */
.v3-marks { display: grid; grid-template-columns: calc((100% - var(--v3-gap, clamp(2.5rem, 6vw, 6rem))) / 3) repeat(2, minmax(0, 1fr)); column-gap: var(--v3-gap, clamp(2.5rem, 6vw, 6rem)); margin: clamp(2rem, 3.5vw, 2.75rem) 0 0; padding: 0; list-style: none; }
.v3-mark { position: relative; display: flex; flex-direction: column; }
/* Wide screens: the marks share row lines (name, what, who), so the rows start level even where a mark has no "what". */
@media (min-width: 861px) {
  .v3-marks { grid-template-rows: auto auto auto; }
  .v3-mark { display: grid; grid-row: span 3; grid-template-rows: subgrid; align-content: start; }
  .v3-mark-name { grid-row: 1; }
  .v3-mark-what { grid-row: 2; }
  .v3-mark-rows { grid-row: 3; align-self: start; }
}
.v3-mark + .v3-mark::before { content: ''; position: absolute; top: 0; bottom: 0; left: calc(var(--v3-gap, clamp(2.5rem, 6vw, 6rem)) / -2); width: 1px; background: var(--rule-light); }
.v3-mark-name { margin: 0; font-family: var(--font-body); font-size: clamp(1.5rem, 2.1vw, 1.875rem); font-weight: 600; font-stretch: 100%; font-variation-settings: 'opsz' 36; letter-spacing: -.015em; line-height: 1.12; color: var(--steel); text-wrap: balance; }
.v3-mark-what { margin: .75rem 0 0; max-width: 22rem; font-family: var(--font-body); font-size: 1.0625rem; line-height: 1.45; color: var(--ink); text-wrap: pretty; }
.v3-mark-rows { margin: 1.25rem 0 0; padding: 0; list-style: none; border-bottom: 1px solid var(--rule-light); }
.v3-mark-rows li { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .15rem 1rem; padding: .55rem 0; border-top: 1px solid var(--rule-light); font-family: var(--font-display); font-size: 1rem; line-height: 1.35; }
.v3-mark-rows a, .v3-mark-who { padding-block: .2rem; font-weight: 600; color: var(--lake); text-decoration: none; }
.v3-mark-who { color: var(--steel); }
.v3-mark-rows a:is(:hover, :focus-visible) { color: var(--steel); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .22em; }
.v3-mark-when { font-weight: 500; font-size: .9375rem; color: var(--mist); font-variant-numeric: tabular-nums; }

/* Peer recognition: after the marks, an attorney's words at display size in an ice panel on the text axis (the ledgers'
   4/12 line), a lake rule at its left edge. */
.v3-rec-callout { margin: clamp(3rem, 6vw, 4.5rem) 0 0 calc((100% - var(--v3-gap)) / 3 + var(--v3-gap)); padding: clamp(2rem, 4vw, 3rem) clamp(1.75rem, 4vw, 3.25rem); background: var(--ice); border-left: 3px solid var(--lake); }
.v3-rec-callout blockquote { margin: 0; }
.v3-rec-callout p { margin: 0; max-width: 21em; font-family: var(--font-body); font-size: clamp(1.75rem, 3.1vw, 2.75rem); font-variation-settings: 'opsz' 60; line-height: 1.2; letter-spacing: -.018em; color: var(--steel); text-indent: -.42em; text-wrap: balance; }
.v3-rec-callout figcaption { margin-top: 1.25rem; font-family: var(--font-display); font-size: 1rem; font-weight: 600; line-height: 1.45; color: var(--lake); }

/* What clients say: every other client quote in full, one column on the text axis (the ledgers' 4/12 line, as the
   callout above), each under a hairline. Reviews run from one line to a page, so one column reads evenly, and quotes
   revealed by "Show more" join at the bottom without moving anything above them. */
.v3-rec-clients { background: var(--limestone-light); }
.v3-rec-clients-body { margin-left: calc((100% - var(--v3-gap)) / 3 + var(--v3-gap)); max-width: 44rem; }
.v3-rec-quotes { display: grid; grid-template-columns: minmax(0, 1fr); margin: clamp(2rem, 3.5vw, 2.75rem) 0 0; padding: 0; list-style: none; }
.v3-rec-quotes > li { margin: 0 0 clamp(1.75rem, 3vw, 2.25rem); padding-top: 1.25rem; border-top: 1px solid var(--rule-light); }
.v3-rec-quotes > li[hidden] { display: none; }
.v3-rec-quotes.is-animating { overflow: hidden; transition: height .55s var(--ease-out); }
.v3-rec-quotes > li.is-entering { opacity: 0; transform: translateY(1rem); }
.v3-rec-quotes > li.is-shown { opacity: 1; transform: none; transition: opacity .5s var(--ease-out) var(--fx-delay, 0ms), transform .5s var(--ease-out) var(--fx-delay, 0ms); }
.v3-rec-quotes > li.is-leaving { opacity: 0; transition: opacity .25s ease-out; }
.v3-rec-quote { margin: 0; }
.v3-rec-quote blockquote { margin: 0; }
.v3-rec-quote p { margin: 0; font-size: clamp(1.1875rem, 1.6vw, 1.375rem); line-height: 1.45; letter-spacing: -.006em; font-variation-settings: 'opsz' 28; color: var(--steel); text-indent: -.42em; text-wrap: pretty; }
.v3-rec-quote figcaption { margin-top: .85rem; font-family: var(--font-display); font-size: var(--t-meta); font-weight: 600; line-height: 1.45; color: var(--lake); }
.v3-rec-quote:focus { outline: none; }
.v3-rec-quote:focus-visible { outline: 2px solid var(--lake); outline-offset: 6px; }
/* Show more / Show fewer: the site's outline button, its caret turning over when the list is open. */
.v3-rec-more { display: inline-flex; align-items: center; gap: .6rem; margin-top: .25rem; padding: .95rem 1.4rem; border: 0; border-radius: 2px; background: transparent; box-shadow: inset 0 0 0 1.5px var(--steel); font-family: var(--font-display); font-weight: 600; font-size: .9375rem; line-height: 1; color: var(--steel); cursor: pointer; transition: background-color .25s var(--ease-out), color .25s var(--ease-out); }
.v3-rec-more[hidden] { display: none; }
.v3-rec-more:is(:hover, :focus-visible) { background: var(--steel); color: var(--white); }
.v3-rec-more-icon { transition: transform .35s var(--ease-out); }
.v3-rec-more[aria-expanded="true"] .v3-rec-more-icon { transform: rotate(180deg); }

/* In the press: three columns. Each clipping is led by the outlet's name at display size (what a reader scans for), then
   the date, then the headline as the link, so the three lines read at three clearly different sizes. */
.v3-rec-clips { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(2.25rem, 4vw, 3rem) clamp(1.5rem, 3vw, 2.5rem); margin: clamp(2rem, 3.5vw, 2.75rem) 0 0; padding: 0; list-style: none; }
.v3-rec-clip { padding-top: 1.1rem; border-top: 2px solid var(--steel); }
.v3-rec-clip-outlet { margin: 0; font-family: var(--font-body); font-size: clamp(1.375rem, 1.9vw, 1.625rem); font-weight: 600; font-variation-settings: 'opsz' 36; letter-spacing: -.012em; line-height: 1.15; color: var(--steel); }
.v3-rec-clip-date { margin: .35rem 0 0; font-family: var(--font-display); font-size: var(--t-meta); font-weight: 500; line-height: 1.4; color: var(--mist); font-variant-numeric: tabular-nums; }
.v3-rec-clip h3 { margin: 1rem 0 0; padding-top: .9rem; border-top: 1px solid var(--rule-light); font-family: var(--font-display); font-size: 1rem; font-weight: 500; font-stretch: 100%; font-variation-settings: 'wdth' 100; letter-spacing: 0; line-height: 1.45; text-wrap: pretty; }
.v3-rec-clip h3 a { color: var(--lake); text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: .22em; transition: color .25s var(--ease-out), text-decoration-color .25s var(--ease-out); }
.v3-rec-clip h3 a:is(:hover, :focus-visible) { color: var(--ink); text-decoration-color: currentColor; }
.v3-rec-clip-arrow { display: inline-block; margin-left: .35em; vertical-align: .02em; transition: transform .3s var(--ease-out); }
.v3-rec-clip h3 a:is(:hover, :focus-visible) .v3-rec-clip-arrow { transform: translate(2px, -2px); }
.v3-rec-note { margin: clamp(1.75rem, 3vw, 2.25rem) 0 0; }
@media print { .v3-rec-quotes > li[hidden] { display: block !important; } .v3-rec-more { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .v3-rec-quotes.is-animating, .v3-rec-quotes > li.is-shown, .v3-rec-quotes > li.is-leaving, .v3-rec-more-icon, .v3-rec-clip-arrow { transition: none; } }

/* Reveals (pages.js): fade and a short rise, as on home. Reduced motion: pages.js never hides anything. */
.v3-fx .v3-fx-item { transition: opacity var(--fx-rise) var(--ease-out) var(--fx-delay, 0ms), transform var(--fx-rise) var(--ease-out) var(--fx-delay, 0ms); }
.v3-fx .v3-fx-item:not(.is-in) { opacity: 0; transform: translateY(1.25rem); }

/* ==========================================================================================================================
   CONTACT (page-contact.php), rebuilt 2026-10-07 (Dan). One band on the studio backdrop: the ways to reach Bedi & Singer
   at left (phone and email at heading size, the partners' emails), the form at right, both above the fold at 1440 x 900.
   Then on white: the map beside the office and the courts covered.
   ========================================================================================================================== */
.v2-page-contact { --v3-gap: clamp(2.5rem, 5vw, 5rem); }
.v3-ct-band { background: var(--hero-backdrop); color: var(--white); padding: clamp(2.75rem, 5vw, 4rem) 0 clamp(3rem, 6vw, 4.5rem); }
.v3-ct-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 2.5rem var(--v3-gap); align-items: start; }
.v3-ct-reach h1 { font-size: var(--t-h1); line-height: 1.02; letter-spacing: -.02em; color: var(--white); text-wrap: balance; }
.v3-ct-reach .lede { margin: 1.1rem 0 0; max-width: 32rem; color: var(--ice); text-wrap: pretty; }
/* Phone and email: heading size, one per line, a small sky label before each. */
.v3-ct-lines { display: grid; gap: 1rem; margin: clamp(2rem, 3.5vw, 2.75rem) 0 0; padding-top: 1.5rem; border-top: 1px solid var(--rule-dark); }
.v3-ct-lines > div { display: grid; grid-template-columns: 4rem minmax(0, 1fr); align-items: baseline; }
.v3-ct-lines dt { font-family: var(--font-display); font-size: var(--t-meta); font-weight: 600; color: var(--sky); }
.v3-ct-lines dd { margin: 0; }
.v3-ct-lines a { display: inline-block; padding-block: .2rem; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.375rem, 2vw, 1.75rem); line-height: 1.2; letter-spacing: -.01em; color: var(--white); text-decoration: underline; text-decoration-color: var(--sky); text-decoration-thickness: 1.5px; text-underline-offset: .22em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.v3-ct-lines a:hover { color: var(--sky); }
/* The partners' direct emails. */
.v3-ct-partners { margin-top: clamp(2rem, 3.5vw, 2.5rem); padding-top: 1.5rem; border-top: 1px solid var(--rule-dark); }
.v3-ct-partners h2 { margin: 0 0 .75rem; font-size: 1rem; font-stretch: 100%; font-variation-settings: 'wdth' 100; font-weight: 600; letter-spacing: 0; line-height: 1.3; color: var(--sky); }
.v3-ct-partners ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .5rem; }
.v3-ct-partners li { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem 1.25rem; }
.v3-ct-partner { min-width: 10.5rem; padding-block: .2rem; font-family: var(--font-display); font-weight: 600; font-size: 1.0625rem; color: var(--white); text-decoration: none; }
.v3-ct-partner:hover { color: var(--sky); text-decoration: underline; text-underline-offset: .2em; }
.v3-ct-partner-email { padding-block: .2rem; font-family: var(--font-display); font-weight: 500; font-size: 1.0625rem; color: var(--ice); text-decoration: underline; text-decoration-color: rgba(156, 195, 221, .5); text-underline-offset: .22em; }
.v3-ct-partner-email:hover { color: var(--white); text-decoration-color: var(--sky); }
.v3-ct :is(.v3-ct-band) :focus-visible { outline-color: var(--sky); }

/* The form: a white panel. WPForms' own styles are kept for behavior and reset to the site's type, colors, and corners
   through its CSS variables. Errors in steel with a lake rule (no red: client). */
.v3-ct-form { padding: clamp(1.5rem, 2.6vw, 2.25rem); background: var(--white); color: var(--ink); border-radius: 2px; }
.v3-ct-form h2 { margin: 0 0 .25rem; font-size: clamp(1.375rem, 1.9vw, 1.625rem); color: var(--steel); }
.v3-ct-form :focus-visible { outline-color: var(--lake); }
.v3-ct-form .wpforms-container { margin: 0 !important;
  --wpforms-field-border-radius: 2px; --wpforms-field-border-color: rgba(30, 58, 82, .35); --wpforms-field-border-size: 1px;
  --wpforms-field-background-color: #FFFFFF; --wpforms-field-text-color: #0E1A24; --wpforms-field-menu-color: #FFFFFF;
  --wpforms-label-color: #1E3A52; --wpforms-label-sublabel-color: #4A667C; --wpforms-label-error-color: #1E3A52;
  --wpforms-button-border-radius: 2px; --wpforms-button-background-color: #1E3A52; --wpforms-button-text-color: #FFFFFF;
  --wpforms-field-size-input-height: 46px; --wpforms-field-size-font-size: 16px; --wpforms-field-size-input-spacing: 14px;
  --wpforms-label-size-font-size: 15px; --wpforms-label-size-sublabel-font-size: 14px;
  --wpforms-button-size-font-size: 15px; --wpforms-button-size-height: 50px; --wpforms-button-size-padding-h: 24px; --wpforms-button-size-margin-top: 8px; }
.v3-ct-form .wpforms-container .wpforms-field { padding: 10px 0; }
.v3-ct-form .wpforms-container :is(.wpforms-field-label, .wpforms-field-sublabel, .wpforms-field-description, input, textarea, button) { font-family: var(--font-display) !important; }
.v3-ct-form .wpforms-container .wpforms-field-label { font-weight: 600 !important; }
.v3-ct-form .wpforms-container .wpforms-field-description { font-size: 14px !important; line-height: 1.45 !important; color: var(--mist) !important; }
.v3-ct-form .wpforms-container .wpforms-required-label { color: var(--lake) !important; }
.v3-ct-form .wpforms-container textarea.wpforms-field-small { height: 80px !important; }
.v3-ct-form .wpforms-container :is(input, textarea, select) { font-family: var(--font-display) !important; }
.v3-ct-form .wpforms-container select { color: var(--ink); }
.v3-ct-form .wpforms-container select:focus { border-color: var(--lake) !important; box-shadow: 0 0 0 1px var(--lake) !important; }
.v3-ct-form .wpforms-container select.wpforms-error { border-color: var(--lake) !important; box-shadow: inset 3px 0 0 var(--lake) !important; }
.v3-ct-form .wpforms-container input:focus, .v3-ct-form .wpforms-container textarea:focus { border-color: var(--lake) !important; box-shadow: 0 0 0 1px var(--lake) !important; }
.v3-ct-form .wpforms-container :is(input, textarea).wpforms-error { border-color: var(--lake) !important; box-shadow: inset 3px 0 0 var(--lake) !important; }
.v3-ct-form .wpforms-container label.wpforms-error, .v3-ct-form .wpforms-container em.wpforms-error { color: var(--steel) !important; font-weight: 600; }
.v3-ct-form .wpforms-container .wpforms-submit-container { padding-top: 6px !important; }
.v3-ct-form .wpforms-container button.wpforms-submit { width: 100%; font-weight: 600 !important; transition: background-color .25s var(--ease-out) !important; }
.v3-ct-form .wpforms-container button.wpforms-submit:hover { background: var(--lake) !important; }
.v3-ct-form .wpforms-confirmation-container-full { margin: 0; padding: 1.25rem 1.25rem 1.25rem 1.5rem; background: var(--ice); border: 0; border-left: 3px solid var(--lake); color: var(--ink); }
.v3-ct-form-note { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--rule-light); }
.v3-ct-form-note p { margin: 0; font-size: .9375rem; line-height: 1.55; color: var(--mist); }

/* The office: the map beside the address and the courts covered. The map is half desaturated so it sits with the palette
   while its pin and labels stay easy to find (Dan, 2026-10-07: full greyscale hid the pin). */
.v3-ct-place { padding: clamp(3rem, 6vw, 4.5rem) 0 var(--space-section); }
.v3-ct-place-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: 2.5rem var(--v3-gap); align-items: stretch; }
.v3-ct-map { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--fog); border-top: 2px solid var(--steel); }
.v3-ct-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: grayscale(.45); }
/* The column runs the map's full height: the office at its top, the courts covered at its foot (level with the map's
   bottom edge), open space between. */
.v3-ct-details { display: flex; flex-direction: column; justify-content: space-between; gap: 2.5rem; padding-top: 1.25rem; border-top: 2px solid var(--steel); }
.v3-ct-details dl { display: grid; gap: 1.5rem; margin: 0; }
.v3-ct-coverage { padding-top: 1.25rem; border-top: 1px solid var(--rule-light); }
.v3-ct-details dt { font-family: var(--font-display); font-size: .9375rem; font-weight: 650; line-height: 1.4; color: var(--mist); }
.v3-ct-details dd { margin: .35rem 0 0; font-family: var(--font-display); font-weight: 600; font-size: clamp(1.125rem, 1.4vw, 1.3125rem); line-height: 1.35; color: var(--steel); }
.v3-ct-details address { font-style: normal; }
.v3-ct-details .v3-ct-directions { margin-top: .85rem; font-size: 1rem; }
.v3-ct-directions .text-link--arrow { padding-block: .6rem; margin-block: -.6rem; }
@media (min-width: 961px) and (max-width: 1180px) {
  .v3-ct-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
}
@media (max-width: 560px) {
  /* Phones: each field the full width. */
  .v3-ct-form .wpforms-container .wpforms-field.wpforms-one-half { float: none; width: 100%; margin-left: 0; }
}
@media (max-width: 960px) {
  .v3-ct-grid, .v3-ct-place-grid { grid-template-columns: minmax(0, 1fr); }
  .v3-ct-form { max-width: 36rem; }
}

/* ==========================================================================================================================
   404: one screen on the studio backdrop. Heading, lede, and contact at left; where to go next at right.
   ========================================================================================================================== */
.error404 { --v3-gap: clamp(2.5rem, 6vw, 6rem); }
.v3-nf { background: var(--white); color: var(--ink); padding: clamp(3rem, 6vw, 5rem) 0 clamp(3.5rem, 7vw, 5.5rem); }
/* Two rows shared by both columns (the nav is a subgrid): the heading beside the hubs, then the contact pair beside the
   page links, both under one rule (the last hub's). */
.v3-nf-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-rows: auto auto; column-gap: var(--v3-gap); }
.v3-nf-title { grid-column: 1; grid-row: 1; }
.v3-nf-nav { grid-column: 2; grid-row: 1 / 3; display: grid; grid-template-rows: subgrid; }
.v3-nf h1 { font-size: var(--t-h1); line-height: 1.02; letter-spacing: -.02em; color: var(--steel); text-wrap: balance; }
.v3-nf .lede { margin: 1.25rem 0 0; max-width: 26rem; color: var(--ink); text-wrap: balance; }
.v3-nf-contact { grid-column: 1; grid-row: 2; align-self: start; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--rule-light); }
.v3-nf-phone { padding-block: .5rem; margin-block: -.5rem; font-family: var(--font-display); font-weight: 700; font-size: 1.375rem; line-height: 1.2; color: var(--steel); text-decoration: none; font-variant-numeric: tabular-nums; }
.v3-nf-phone:hover { color: var(--lake); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .2em; }
.v3-nf-nav h2 { padding-bottom: .9rem; border-bottom: 1px solid var(--rule-light); font-size: 1.0625rem; font-stretch: 100%; font-variation-settings: 'wdth' 100; font-weight: 600; letter-spacing: 0; line-height: 1.3; color: var(--mist); }
/* Each hub row is one link (the title's link stretched over the row), with the site's arrow after the title. */
.v3-nf-hubs li { position: relative; padding: 1.25rem 0; border-bottom: 1px solid var(--rule-light); }
.v3-nf-hubs a { display: inline-flex; align-items: center; gap: .65rem; padding-block: .2rem; font-family: var(--font-display); font-size: clamp(1.1875rem, 1.6vw, 1.375rem); font-weight: 700; line-height: 1.25; letter-spacing: -.005em; color: var(--steel); text-decoration: none; }
.v3-nf-hubs a::after { content: ''; position: absolute; inset: 0; }
.v3-nf-hubs .text-link-arrow { color: var(--lake); transition: transform .35s var(--ease-out); }
.v3-nf-hubs li:hover .v3-nf-hub-label, .v3-nf-hubs a:focus-visible .v3-nf-hub-label { text-decoration: underline; text-decoration-color: var(--lake); text-decoration-thickness: 1.5px; text-underline-offset: .22em; }
.v3-nf-hubs li:hover .text-link-arrow, .v3-nf-hubs a:focus-visible .text-link-arrow { transform: translateX(.35rem); }
.v3-nf-hubs li:hover p { color: var(--steel); }
/* The footer under the 404 skips the hub summaries the page has just shown. */
.error404 .site-footer .footer-hub-note, .error404 .site-footer .footer-hubs p:not(.footer-hub) { display: none; }
.v3-nf-hubs p { margin: .4rem 0 0; max-width: 36rem; font-size: 1rem; line-height: 1.5; color: var(--ink); }
.v3-nf-links { display: grid; grid-template-columns: repeat(3, max-content); align-content: start; gap: .1rem 2.5rem; padding-top: 1.05rem; }
.v3-nf-links a { position: relative; display: inline-block; padding: .45rem 0 .45rem 1.1rem; font-family: var(--font-display); font-size: 1rem; font-weight: 600; line-height: 1.4; color: var(--lake); text-decoration: none; }
.v3-nf-links a::before { content: ''; position: absolute; left: 0; top: calc(.45rem + .6em); width: 5px; height: 5px; border-radius: 50%; background: var(--lake); }
.v3-nf-links a:hover { color: var(--steel); text-decoration: underline; text-underline-offset: .2em; }

/* ==========================================================================================================================
   RESPONSIVE
   ========================================================================================================================== */
@media (max-width: 1180px) {
  .v3-nf-links { grid-template-columns: repeat(2, max-content); }
}
@media (max-width: 860px) {
  /* Recognition (Reviews) */
  .practice-quote-head { grid-row: auto; margin-bottom: 1.75rem; }
  .practice-quote-head + .practice-quote-list { grid-row: auto; }
  .v3-rec-callout { margin-left: 0; }
  .v3-rec-clients-body { margin-left: 0; }
  .v3-rec-judges { grid-template-columns: minmax(0, 1fr); }
  .v3-rec-clips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v3-marks { grid-template-columns: minmax(0, 1fr); }
  .v3-mark + .v3-mark { margin-top: 2rem; }
  .v3-mark + .v3-mark::before { display: none; }
  /* 404 */
  .v3-nf-grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .v3-nf-title, .v3-nf-contact, .v3-nf-nav { grid-column: 1; grid-row: auto; }
  .v3-nf-nav { display: block; margin-top: 3rem; }
  .v3-nf-contact { margin-top: 2rem; padding-top: 0; border-top: 0; }
}
@media (max-width: 600px) {
  .v3-rec-clips { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .v3-nf-links { grid-template-columns: minmax(0, 1fr); }
}