/* v4 practice pages and the Practice Areas index (2026-10-08). Loaded after v4/global.css on practice pages. */
:root { --v4-side-w: 16rem; --v4-pa-gap: clamp(2.5rem, 5vw, 5rem); }


/* Layout: the sidebar left, the reading column right. */
/* The sidebar's cell runs the full row, so its sticky block follows the reading column down. */
.v4-pa-side, .v4-page-side, .v4-person-side { align-self: stretch; }
.v4-pa-layout { display: grid; grid-template-columns: var(--v4-side-w) minmax(0, 1fr); gap: var(--v4-pa-gap); align-items: start; padding-top: clamp(2.5rem, 5vw, 4rem); padding-bottom: clamp(3.5rem, 7vw, 6.5rem); }
.v4-pa-sticky { position: sticky; top: calc(var(--header-h) + 1.5rem); display: grid; gap: 2.25rem; }
.v4-side-label { margin: 0 0 .6rem; font-family: var(--font-display); font-size: .74rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--slate); }
.v4-toc ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--stone); }
.v4-toc a { display: block; padding: .5rem 0; border-bottom: 1px solid var(--stone); font-family: var(--font-display); font-size: .9rem; font-weight: 500; line-height: 1.35; color: var(--ink); text-decoration: none; transition: color .2s var(--ease-out); }
.v4-toc a:hover { color: var(--lake); }
.v4-call { display: grid; gap: .15rem; }
.v4-call-phone { font-family: var(--font-serif); font-size: 1.6rem; line-height: 1.15; color: var(--ink); text-decoration: none; }
.v4-call-email { font-family: var(--font-display); font-size: .95rem; color: var(--ink); text-decoration: none; word-break: break-all; }
.v4-call-phone:hover, .v4-call-email:hover { color: var(--lake); }
.v4-call-note { margin: .75rem 0 0; font-size: .85rem; line-height: 1.5; color: var(--slate); }

/* The reading column. */
.v4-pa-main { max-width: 52rem; }
.v4-pa-section + .v4-pa-section { margin-top: clamp(2.75rem, 5vw, 4.25rem); }
.v4-pa-section h2 { font-size: var(--t-h2); max-width: 24ch; margin-bottom: 1.1rem; }
.v4-pa-copy { max-width: 42rem; }
.v4-pa-copy p { margin: 0 0 1.1em; font-size: 1.0625rem; line-height: 1.65; }
.v4-pa-copy p.is-lede { font-family: var(--font-serif); font-size: clamp(1.25rem, 1.1rem + .6vw, 1.5rem); line-height: 1.4; color: var(--ink); }
.v4-pa-copy p.is-lead { font-size: 1.15rem; line-height: 1.55; }
.v4-pa-copy ul, .v4-pa-copy ol { margin: 0 0 1.25em; padding-left: 1.2em; list-style: disc; }
.v4-pa-copy ol { list-style: decimal; }
.v4-pa-copy li { margin: 0 0 .45em; line-height: 1.55; }
.v4-pa-copy li::marker { color: var(--lake); }
.v4-pa-copy a { color: var(--lake); }
.v4-pa-copy h3 { font-size: 1.3rem; margin: 1.75rem 0 .6rem; }
.v4-record { margin: 1.5rem 0; padding: 1.5rem 1.75rem; background: var(--paper-2); }
.v4-record p { margin: 0; }
.v4-record-note { margin: .75rem 0 0 !important; font-family: var(--font-display); font-size: .82rem !important; color: var(--slate); }

/* The answer: a charcoal card at the top of the column. */
.v4-answer { background: var(--charcoal); color: var(--paper); padding: clamp(1.75rem, 3vw, 2.5rem); margin-bottom: clamp(2.75rem, 5vw, 4rem); }
.v4-answer-q { margin: 0 0 .5rem; font-family: var(--font-display); font-size: .74rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--smoke); }
.v4-answer-yes { margin: 0 0 1rem; font-family: var(--font-serif); font-size: clamp(2.5rem, 2rem + 2vw, 3.75rem); line-height: 1; color: var(--lake-light); }
.v4-answer-statement { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); color: var(--paper); margin-bottom: 1rem; max-width: 24ch; }
.v4-answer-body p { margin: 0 0 .9em; font-size: 1rem; line-height: 1.6; color: var(--paper); max-width: 60ch; }
.v4-answer-body p:last-child { margin-bottom: 0; }
.v4-answer .practice-review-note { margin: 1.25rem 0 0; }
/* The lawyers named with the answer: round two's chips. */
.v4-answer-people { list-style: none; margin: 1.5rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .75rem 1.75rem; }
.v4-chip { display: inline-flex; align-items: center; gap: .65rem; font-family: var(--font-display); font-weight: 600; font-size: .9rem; color: var(--paper); text-decoration: none; transition: color .2s var(--ease-out); }
.v4-chip img, .v4-chip-placeholder { width: 2.4rem; height: 2.4rem; border-radius: 50%; object-fit: cover; object-position: 50% 18%; flex: none; }
.v4-chip-placeholder { display: grid; place-items: center; background: var(--charcoal-2); color: var(--smoke); font-family: var(--font-serif); font-style: italic; }
.v4-chip:hover { color: var(--lake-light); }

/* Groups of pages (hubs and the index): a heading, then links stacked, no bullets, no numerals. */
.v4-pa-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 3rem; }
.v4-group > h3 { font-family: var(--font-display); font-size: .76rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--slate); padding-bottom: .6rem; margin: 0 0 .6rem; border-bottom: 1px solid var(--stone); line-height: 1.3; }
.v4-group ul { list-style: none; margin: 0; padding: 0; }
.v4-group li a { display: inline-block; padding: .28rem 0; font-family: var(--font-display); font-weight: 450; font-size: .95rem; line-height: 1.35; color: var(--ink); text-decoration: none; transition: color .25s var(--ease-out); }
.v4-group li a:hover { color: var(--lake); }

/* People in a section: compact cards, or the partners' portraits at size. */
.v4-people-row, .v4-portraits { list-style: none; margin: 1.5rem 0 0; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; gap: 1.25rem 2.5rem; }
.v4-people-row li, .v4-portraits li { display: block; flex: 0 0 auto; }
.v4-people-card { display: flex; align-items: center; gap: .9rem; text-decoration: none; color: var(--ink); }
.v4-photo--small { width: 3.5rem; aspect-ratio: 4 / 5; flex: none; }
.v4-people-text { display: grid; }
.v4-people-name { font-family: var(--font-serif); font-size: 1.15rem; line-height: 1.15; }
.v4-people-role { font-family: var(--font-display); font-size: .74rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--slate); margin-top: .2rem; }
.v4-people-card:hover .v4-people-name { color: var(--lake); }
.v4-portraits { gap: 2rem; }
.v4-portraits li { width: min(13rem, 42%); }
.v4-portraits .v4-people-card { display: grid; gap: .5rem; width: 100%; }
.v4-portraits .v4-photo--small { width: 100%; }
.v4-portraits .v4-people-name { font-size: 1.3rem; }
.v4-photo--placeholder { display: grid; place-items: center; background: var(--charcoal); color: var(--smoke); font-family: var(--font-serif); font-style: italic; font-size: 2rem; }

/* Matters on a practice page: the ledger entries, quiet. */
.v4-pa-matters .matter-callouts { list-style: none; margin: 0; padding: 0; }
.v4-pa-matters .matter-callout { padding: 1.25rem 0; border-top: 1px solid var(--stone); }
.v4-pa-matters .matter-callout h3 { font-size: 1.25rem; margin: 0 0 .4rem; }
.v4-pa-matters .matter-callout-outcome { color: var(--lake); }
.v4-pa-matters .matter-callout p { margin: 0 0 .35rem; font-size: .95rem; color: var(--slate); }

/* The FAQ: an accordion, one answer open at a time. */
.v4-faq { border-top: 1px solid var(--stone); }
.v4-faq-item { border-bottom: 1px solid var(--stone); }
.v4-faq-item summary { cursor: pointer; list-style: none; position: relative; padding: 1.1rem 2.75rem 1.1rem 0; font-family: var(--font-serif); font-size: 1.25rem; line-height: 1.3; }
.v4-faq-item summary::-webkit-details-marker { display: none; }
.v4-faq-item summary::after { content: '+'; position: absolute; right: .25rem; top: 50%; transform: translateY(-50%); font-family: var(--font-display); font-weight: 300; font-size: 1.6rem; line-height: 1; color: var(--lake); }
.v4-faq-item[open] summary::after { content: '\2212'; }
.v4-faq-item summary:hover { color: var(--lake); }
.v4-faq-a { padding: 0 0 1.25rem; }
.v4-faq-a p:last-child { margin-bottom: 0; }

/* The close. */
.v4-pa-closing { margin-top: clamp(3rem, 6vw, 4.5rem); padding: clamp(1.75rem, 3vw, 2.5rem); background: var(--paper-2); }
.v4-pa-closing h2 { font-size: 1.6rem; margin-bottom: .9rem; }
.v4-pa-closing .v4-pa-copy p { font-size: 1rem; }
.v4-pa-closing-contact { margin: 1.25rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem 2rem; font-family: var(--font-serif); font-size: 1.5rem; }
.v4-pa-closing-contact a { color: var(--ink); text-decoration: none; }
.v4-pa-closing-contact a:hover { color: var(--lake); }

/* The judge's band inside the reading column spans the whole page. */
/* The judge's words as a panel in the reading column (the sketch, faint on ink). */
.v4-pa-main .v4-bench { margin: clamp(2.75rem, 5vw, 4.25rem) 0; }
.v4-pa-main .v4-bench .wrap { padding: clamp(2.25rem, 4vw, 3.25rem) clamp(1.5rem, 3vw, 2.5rem); }
.v4-pa-main .v4-bench-quote p { font-size: clamp(1.35rem, 1.05rem + 1.1vw, 1.9rem); }

/* The index. */
.v4-dir { padding-top: clamp(1.5rem, 3vw, 2.5rem); padding-bottom: clamp(3.5rem, 7vw, 6.5rem); }
.v4-dir-main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: clamp(2rem, 4vw, 4rem); padding: clamp(2.25rem, 4vw, 3.5rem) 0; border-top: 1px solid var(--stone); }
.v4-dir-main:first-child { border-top: 0; }
.v4-dir-head h2 { font-size: var(--t-h2); max-width: 16ch; }
.v4-dir-head h2 a { color: inherit; text-decoration: none; }
.v4-dir-head h2 a:hover { color: var(--lake); }
.v4-dir-scope { margin: .6rem 0 0; font-family: var(--font-display); font-size: .74rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--slate); }
.v4-dir-line { margin: 1rem 0 0; color: var(--slate); max-width: 44ch; line-height: 1.55; }
.v4-dir-cases { margin: .75rem 0 0; font-family: var(--font-serif); font-size: 1.1rem; }
.v4-dir-head .text-link { display: inline-flex; margin-top: 1.25rem; }
.v4-dir-groups { align-self: start; }

@media (max-width: 1100px) { :root { --v4-side-w: 15rem; } }
@media (max-width: 960px) {
  .v4-pa-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .v4-pa-sticky { position: static; grid-template-columns: 1fr 1fr; gap: 2rem; }
  .v4-dir-main { grid-template-columns: 1fr; }
  .v4-bench--pair .v4-bench-quotes { grid-template-columns: 1fr; }
}
@media (max-width: 640px) { .v4-pa-sticky { grid-template-columns: 1fr; } .v4-pa-groups { grid-template-columns: 1fr; } .v4-portraits .v4-people-card { width: 46%; } }
