/* Usher Law Group — 2026 redesign. Charcoal + gold, cream paper (mockup style, 2026-09-15). */
:root {
  --topbar-h: 54px;
  --ink: #161a1c;
  --ink-2: #1d2225;
  --ink-3: #262c30;
  --cream: #fdfaf4;
  --sand: #f3ede3;
  --sand-2: #f7f2e9;
  --white: #ffffff;
  --gold: #d7c266; /* 2026-10-03: hue-locked to the logo gold #eed87b (same hue 95.2deg and chroma), 8 points darker */
  --gold-light: #eed87b; /* the logo gold exactly */
  --gold-grad: linear-gradient(100deg, #e2cd70 0%, #bfac51 100%); /* same hue, lighter and darker shades of it */
  --gold-text: #766809; /* same hue, dark enough for 5.2:1 on cream */ /* was #946a22; darkened 2026-09-16 for 4.5:1 contrast on cream */
  --text: #1b1c1d;
  --text-soft: #56585a;
  --on-dark: #eeeae1;
  --muted-dark: #a6a39b;
  --line: #e6ddce;
  --line-2: #ded3c1;
  --line-dark: #2e3438;
  --serif: "Source Serif 4", "Source Serif Pro", Georgia, "Times New Roman", serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --wrap: 1180px;
  --radius: 2px;
  --shadow: 0 18px 40px -26px rgba(22, 26, 28, .45);
  --header-h: 108px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 16px); }
body { margin: 0; font-family: var(--sans); font-size: 1rem; line-height: 1.7; color: var(--text); background: var(--cream); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
button { font: inherit; }
svg.icon { width: 1em; height: 1em; fill: currentColor; flex: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--gold); color: var(--ink); padding: 10px 16px; font-weight: 700; text-decoration: none; }
.skip:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

.wrap { width: min(100% - 48px, var(--wrap)); margin-inline: auto; }
.narrow { width: min(100% - 48px, 820px); margin-inline: auto; }

/* ---------- Type ---------- */
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 400; line-height: 1.12; letter-spacing: -.015em; margin: 0 0 .5em; color: var(--text); }
h1 { font-size: clamp(2.4rem, 4.8vw, 4rem); }
h2 { font-size: clamp(1.9rem, 3.2vw, 2.75rem); }
h3 { font-size: clamp(1.3rem, 1.8vw, 1.55rem); }
p { margin: 0 0 1.1em; }
.eyebrow { font-family: var(--sans); font-size: .7rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-text); margin: 0 0 .9rem; }
.dark .eyebrow, .eyebrow.on-dark { color: var(--gold); }
.lede { font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.6; color: var(--text-soft); max-width: 62ch; }
.dark .lede { color: var(--muted-dark); }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem 1.35rem; border-radius: var(--radius); font-family: var(--sans); font-weight: 600; font-size: .9rem; letter-spacing: .01em; text-decoration: none; border: 1px solid transparent; cursor: pointer; white-space: nowrap; transition: filter .2s, background .2s, color .2s, border-color .2s, transform .2s; }
.btn:hover { transform: translateY(-1px); }
.btn .arr { font-size: 1.05em; line-height: 1; }
.btn-gold { background: var(--gold-grad); color: #1a1508; box-shadow: 0 8px 20px -16px rgba(170, 150, 75, .7); }
.btn-gold:hover { filter: brightness(1.06); }
.btn-dark { background: transparent; color: var(--white); border-color: rgba(255, 255, 255, .28); }
.btn-dark:hover { border-color: var(--gold); color: var(--gold-light); }
.btn-ink { background: var(--ink); color: var(--white); }
.btn-ink:hover { background: var(--ink-3); }
.btn-line { background: transparent; color: var(--text); border-color: var(--line-2); }
.btn-line:hover { border-color: var(--gold); color: var(--gold-text); }
.btn-block { width: 100%; }
.link-arrow { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; font-size: .85rem; text-decoration: none; color: var(--gold-text); }
.dark .link-arrow { color: var(--gold); }
.link-arrow:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Top bar + language picker ---------- */
.topbar { position: relative; z-index: 70; background: #0e1112; color: var(--muted-dark); font-size: .84rem; border-bottom: 1px solid rgba(255, 255, 255, .05); }
.topbar .wrap { display: flex; align-items: center; gap: 1.25rem; min-height: var(--topbar-h); width: min(100% - 48px, 1440px); }
/* Top bar type follows USCISDelay.com: Playfair Display for the address and phone, spaced Inter capitals for labels */
.tb-address { display: inline-flex; align-items: center; gap: .6rem; min-width: 0; }
.tb-address svg { width: 18px; height: 18px; color: var(--gold); flex: none; }
.tb-addr { font-family: "Playfair Display", var(--serif); font-size: 1.05rem; font-weight: 500; font-style: italic; color: var(--white); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tb-hours { font-size: .68rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); white-space: nowrap; padding-left: .8rem; border-left: 1px solid var(--line-dark); }
.topbar .tb-address:hover .tb-addr { color: var(--gold-light); }
.site-search { position: relative; margin-left: auto; flex: 0 1 390px; min-width: 150px; }
.site-search input { width: 100%; height: 38px; padding: 0 2.4rem 0 2.35rem; background: rgba(255, 255, 255, .06); border: 1px solid var(--line-dark); border-radius: 999px; color: var(--white); font: 500 .9rem var(--sans); transition: border-color .2s, background .2s, box-shadow .2s; -webkit-appearance: none; appearance: none; }
.site-search input::placeholder { color: #928f88; }
.site-search input:focus { outline: none; border-color: var(--gold); background: rgba(255, 255, 255, .1); box-shadow: 0 0 0 3px rgba(201, 161, 79, .2); }
.site-search input::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.ss-icon { position: absolute; left: .85rem; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); color: var(--gold); pointer-events: none; }
.ss-key { position: absolute; right: .65rem; top: 50%; transform: translateY(-50%); font: 600 .68rem var(--sans); color: var(--muted-dark); border: 1px solid var(--line-dark); border-radius: 4px; padding: .05rem .4rem; pointer-events: none; }
.site-search input:focus ~ .ss-key, .site-search input:not(:placeholder-shown) ~ .ss-key { display: none; }
.ss-results { position: absolute; top: calc(100% + 8px); left: 0; right: 0; min-width: 380px; background: var(--white); color: var(--text); border: 1px solid var(--line); border-top: 2px solid var(--gold); box-shadow: 0 24px 60px -18px rgba(0, 0, 0, .55); z-index: 90; padding: .4rem; max-height: min(72vh, 480px); overflow-y: auto; text-align: left; }
.ss-item { display: flex; gap: .75rem; align-items: flex-start; padding: .6rem .7rem; text-decoration: none; color: var(--text) !important; }
.ss-item[aria-selected="true"], .ss-item:hover { background: var(--sand); }
.ss-type { flex: none; min-width: 5.8rem; margin-top: .15rem; padding: .22rem .45rem; font-size: .58rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-align: center; color: var(--gold-text); background: var(--sand-2); border: 1px solid var(--line); }
.ss-text strong { display: block; font-family: var(--serif); font-weight: 600; font-size: 1rem; line-height: 1.3; }
.ss-text > span { display: block; font-size: .79rem; color: var(--text-soft); line-height: 1.45; margin-top: .12rem; }
.ss-text mark { background: rgba(201, 161, 79, .3); color: inherit; padding: 0 1px; }
.ss-empty { padding: .8rem .9rem; font-size: .88rem; color: var(--text-soft); list-style: none; }
.ss-empty a { color: var(--gold-text) !important; font-weight: 600; }
.ss-foot { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .7rem .3rem; margin-top: .3rem; border-top: 1px solid var(--line); font-size: .72rem; color: var(--text-soft); }
.ss-foot a { color: var(--gold-text) !important; font-weight: 600; text-decoration: none; }
.tb-phone { display: inline-flex; align-items: center; gap: .5rem; font-family: "Playfair Display", var(--serif); font-size: 1.15rem; font-weight: 600; letter-spacing: .01em; white-space: nowrap; }
.topbar .tb-phone { color: var(--white); }
.tb-phone svg { width: 17px; height: 17px; color: var(--gold); flex: none; }
.tb-phone .tb-call { font-family: var(--sans, Inter, sans-serif); font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.topbar a { color: var(--on-dark); text-decoration: none; }
.topbar a:hover { color: var(--gold-light); }
.langpick { position: relative; z-index: 60; }
.langpick-btn { display: inline-flex; align-items: center; gap: .45rem; height: 38px; background: transparent; color: var(--on-dark); border: 1px solid var(--line-dark); border-radius: 999px; padding: 0 .85rem; font-size: .84rem; font-weight: 600; letter-spacing: .03em; line-height: 1; cursor: pointer; transition: border-color .2s, color .2s; }
.langpick-btn:hover, .langpick.open .langpick-btn { border-color: var(--gold); color: var(--gold-light); }
.langpick-globe { width: 14px; height: 14px; color: var(--gold); flex: none; }
.langpick-caret { width: 10px; height: 10px; color: var(--gold); flex: none; transition: transform .2s; }
.langpick.open .langpick-caret { transform: rotate(180deg); }
.langpick-menu { position: absolute; top: calc(100% + 8px); left: 50%; min-width: 220px; max-height: min(70vh, 380px); overflow-y: auto; margin: 0; padding: 6px; list-style: none; background: var(--ink); border: 1px solid var(--line-dark); border-top: 2px solid var(--gold); box-shadow: 0 20px 48px rgba(0, 0, 0, .55); opacity: 0; visibility: hidden; transform: translate(-50%, -6px); transition: opacity .2s, transform .2s, visibility .2s; }
.langpick.open .langpick-menu { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition: opacity .2s, transform .2s, visibility 0s; }
.langpick-menu li { display: flex; align-items: baseline; gap: 12px; padding: .55rem .75rem; color: var(--on-dark); cursor: pointer; transition: background-color .15s, color .15s; }
.langpick-menu li .nm { font-size: .9rem; font-weight: 600; line-height: 1.2; }
.langpick-menu li .en { margin-left: auto; align-self: center; font-size: .7rem; letter-spacing: .03em; color: var(--muted-dark); }
.langpick-menu li:hover, .langpick-menu li:focus { background: var(--ink-3); outline: none; }
.langpick-menu li:hover .nm, .langpick-menu li.is-active .nm, .langpick-menu li.is-active .en { color: var(--gold-light); }
.langpick-menu li.is-active { background: rgba(201, 161, 79, .1); }
/* Hidden Google Translate engine (the picker drives it) */
#google_translate_element { position: absolute !important; left: -9999px !important; top: -9999px !important; width: 0 !important; height: 0 !important; overflow: hidden; }
body { top: 0 !important; }
iframe.goog-te-banner-frame, .goog-te-banner-frame.skiptranslate, .skiptranslate > iframe { display: none !important; visibility: hidden !important; }
#goog-gt-tt, .goog-te-balloon-frame, .goog-tooltip, .VIpgJd-ZVi9od-aZ2wEe-wOHMyf { display: none !important; }
font { font: inherit !important; color: inherit !important; letter-spacing: inherit !important; background: transparent !important; vertical-align: baseline !important; box-shadow: none !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }
/* Translated text runs longer than English */
html[class*="translated-"] .btn { white-space: normal; text-align: center; line-height: 1.3; }
html[class*="translated-"] h1 { font-size: clamp(1.9rem, 3.8vw, 3.3rem); }
html[class*="translated-"] h1, html[class*="translated-"] h2, html[class*="translated-"] h3 { overflow-wrap: break-word; }
html[class*="translated-"] main [class] > * { min-width: 0; }
@media (min-width: 1181px) {
  html[class*="translated-"] .main-nav a, html[class*="translated-"] .main-nav button.nav-top { padding-inline: .45rem; font-size: .8rem; }
  html[class*="translated-"] .header-phone { display: none; }
  html[class*="translated-"] .header-cta .btn { max-width: 11rem; padding-inline: 1rem; font-size: .8rem; }
}

/* ---------- Header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: var(--ink); color: var(--on-dark); border-bottom: 1px solid rgba(255, 255, 255, .06); transition: box-shadow .2s; }
.site-header.scrolled { box-shadow: 0 10px 30px rgba(0, 0, 0, .35); }
.site-header .wrap { display: flex; align-items: center; gap: 1.75rem; min-height: var(--header-h); width: min(100% - 48px, 1440px); }
.brand { display: flex; align-items: center; gap: 1.1rem; text-decoration: none; color: var(--white); flex: none; }
.brand img { width: 84px; height: 84px; object-fit: contain; filter: drop-shadow(0 4px 14px rgba(201, 161, 79, .28)); }
.brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand-name { font-family: var(--serif); font-weight: 700; font-size: 1.85rem; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.brand-sub { font-size: .74rem; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-light); margin-top: .55rem; white-space: nowrap; }
.main-nav { margin-left: auto; }
.main-nav > ul { display: flex; align-items: center; gap: .1rem; list-style: none; margin: 0; padding: 0; }
.main-nav a, .main-nav button.nav-top { display: inline-flex; align-items: center; gap: .3rem; padding: .6rem .7rem; color: var(--on-dark); text-decoration: none; background: none; border: 0; cursor: pointer; font-size: .9rem; font-weight: 500; white-space: nowrap; }
.main-nav a:hover, .main-nav button.nav-top:hover, .main-nav [aria-current="page"], .main-nav .is-active > .nav-top { color: var(--gold-light); }
.nav-top .icon { width: .65em; height: .65em; transition: transform .2s; }
.has-mega { position: static; }
.has-mega[data-open] .nav-top .icon { transform: rotate(180deg); }
.mega { position: absolute; left: 0; right: 0; top: 100%; background: var(--ink-2); border-top: 1px solid var(--line-dark); box-shadow: 0 30px 50px -20px rgba(0, 0, 0, .6); padding: 2.25rem 0 2.5rem; display: none; }
.has-mega[data-open] .mega { display: block; }
.mega .wrap { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1fr; gap: 2.25rem; min-height: 0; align-items: start; }
.mega h3 { font-size: 1.1rem; color: var(--white); margin-bottom: .8rem; display: flex; align-items: center; gap: .55rem; }
.mega h3 .icon { color: var(--gold); width: 1.3em; height: 1.3em; }
.mega h3 a { padding: 0; font-size: inherit; color: inherit; font-weight: 400; }
.mega ul { list-style: none; margin: 0; padding: 0; }
.mega li a { display: block; padding: .28rem 0; font-weight: 400; font-size: .88rem; color: var(--muted-dark); }
.mega li a:hover { color: var(--gold-light); }
.mega .mega-cta { background: var(--sand); color: var(--text); padding: 1.5rem; }
.mega .mega-cta h3 { color: var(--text); }
.mega .mega-cta p { color: var(--text-soft); font-size: .9rem; }
.main-nav .mega .mega-cta .btn { color: #1a1508; background: var(--gold-grad); padding: .8rem 1.2rem; font-size: .88rem; font-weight: 600; }
.main-nav .mega .mega-cta .link-arrow { color: var(--gold-text); padding: 0; font-size: .85rem; font-weight: 600; }
.mega .mega-cta .eyebrow { color: #4b4c4d; font-size: .64rem; }
.header-cta { display: flex; align-items: center; gap: 1.1rem; }
.header-phone { text-decoration: none; color: var(--white); font-weight: 700; font-size: .95rem; white-space: nowrap; letter-spacing: .01em; }
.header-phone:hover { color: var(--gold-light); }
.header-cta .btn { padding: .8rem 1.2rem; }
.menu-toggle { display: none; margin-left: auto; background: none; border: 1px solid var(--line-dark); color: var(--white); width: 44px; height: 44px; border-radius: var(--radius); cursor: pointer; align-items: center; justify-content: center; }
.menu-toggle span, .menu-toggle span::before, .menu-toggle span::after { display: block; width: 20px; height: 2px; background: currentColor; position: relative; content: ""; }
.menu-toggle span::before { position: absolute; top: -6px; }
.menu-toggle span::after { position: absolute; top: 6px; }

/* ---------- Sections ---------- */
.sec { padding: clamp(64px, 8vw, 110px) 0; }
.sec-tight { padding: clamp(44px, 5vw, 72px) 0; }
.dark { background: var(--ink); color: var(--on-dark); }
.dark h1, .dark h2, .dark h3 { color: var(--white); }
.sand { background: var(--sand); }
.cream { background: var(--cream); }
.sec-head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2rem; margin-bottom: clamp(2rem, 4vw, 3rem); }
.sec-head h2 { margin: 0; }
.sec-head .side { margin: 0; max-width: 42ch; color: var(--text-soft); font-family: var(--serif); font-size: 1.06rem; line-height: 1.65; align-self: start; padding-top: .3rem; }
.dark .sec-head .side { color: var(--muted-dark); }
.sec-head.split { grid-template-columns: 1.2fr .8fr; align-items: start; }

/* ---------- Home hero ---------- */
.hero { position: relative; background: var(--ink); color: var(--on-dark); overflow: hidden; }
.hero-photo { position: absolute; top: 0; bottom: 0; right: 0; width: 50%; }
.hero-photo picture, .hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.hero-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink) 0%, rgba(22, 26, 28, .55) 22%, rgba(22, 26, 28, 0) 50%), linear-gradient(0deg, rgba(22, 26, 28, .35), transparent 30%); }
.hero .wrap { position: relative; min-height: clamp(520px, 62vh, 680px); display: flex; align-items: center; }
.hero-copy { max-width: 560px; padding: clamp(56px, 7vw, 96px) 0; }
.hero h1 { color: var(--white); font-size: clamp(2.6rem, 5vw, 4.25rem); line-height: 1.05; margin-bottom: 1.4rem; }
.hero .sub { font-family: var(--serif); font-size: clamp(1.1rem, 1.5vw, 1.3rem); color: var(--on-dark); line-height: 1.5; margin-bottom: .9rem; }
.hero .small { font-size: .95rem; color: var(--muted-dark); margin-bottom: 2rem; max-width: 52ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }

/* ---------- Trust strip ---------- */
.trust-strip { background: var(--sand); border-bottom: 1px solid var(--line); }
.trust-strip ul { list-style: none; margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 1px; background: var(--line-2); border-inline: 1px solid var(--line-2); }
.trust-strip.four ul { grid-template-columns: repeat(4, 1fr); }
.trust-strip li { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .45rem; padding: 1.15rem .75rem; text-align: center; font-size: .78rem; font-weight: 600; color: #3b3c3d; background: var(--sand); }
.trust-strip.four li { font-size: .76rem; }
.trust-strip svg { width: 17px; height: 17px; color: var(--gold-text); }
@media (max-width: 980px) {
  .trust-strip ul { grid-template-columns: repeat(3, 1fr); }
  .trust-strip ul li:last-child { grid-column: span 2; }
  .trust-strip.four ul { grid-template-columns: repeat(2, 1fr); }
  .trust-strip.four ul li:last-child { grid-column: auto; }
}
@media (max-width: 640px) {
  .trust-strip ul { grid-template-columns: repeat(2, 1fr); width: 100%; border-inline: 0; }
  .trust-strip ul li:last-child { grid-column: 1 / -1; }
  .trust-strip.four ul li:last-child { grid-column: auto; }
  .trust-strip li { padding: .9rem .5rem; }
}

/* ---------- Pillar cards (big dark photo cards) ---------- */
.pillars { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.pillar { position: relative; min-height: 300px; display: flex; flex-direction: column; justify-content: flex-start; padding: 2.5rem 2.25rem 2.25rem; color: var(--white); text-decoration: none; overflow: hidden; background: var(--ink-2); }
.pillar picture { position: absolute; inset: 0; }
.pillar img { width: 100%; height: 100%; object-fit: cover; opacity: .38; filter: grayscale(.35) sepia(.2); transition: transform .8s, opacity .4s; }
.pillar::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(22, 26, 28, .25) 0%, rgba(22, 26, 28, .88) 100%); }
.pillar > :not(picture) { position: relative; z-index: 1; }
.pillar h3 { color: var(--white); font-size: clamp(1.5rem, 2.3vw, 2rem); margin-bottom: .6rem; }
.pillar p { color: var(--on-dark); font-size: .92rem; margin: 0 0 1rem; max-width: 44ch; }
.pillar .link-arrow { color: var(--gold-light); margin-top: auto; padding-top: .5rem; }
/* Even cards: headings reserve two lines so descriptions and links line up side by side */
.pillar h3 { max-width: 17ch; }
.pillar p { max-width: 40ch; }
@media (min-width: 981px) { .pillar h3 { min-height: 2.24em; } .pillar h3 + p { min-height: 4.8em; } }
.pillar:hover img { transform: scale(1.04); opacity: .48; }

/* ---------- Practice cards ---------- */
.practice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.practice-grid.four { grid-template-columns: repeat(4, 1fr); }
.practice-card { background: var(--white); border: 1px solid var(--line); padding: 1.5rem 1.5rem 1.35rem; display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s, box-shadow .2s; }
.practice-card:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: var(--shadow); }
.practice-card h3 { font-size: 1.3rem; margin: 0 0 .6rem; }
.practice-card p { font-size: .9rem; color: var(--text-soft); margin-bottom: 1rem; line-height: 1.6; }
.practice-card .link-arrow { margin-top: auto; }
.practice-card .eyebrow { margin-bottom: .6rem; font-size: .64rem; }
.practice-grid.two { grid-template-columns: repeat(2, 1fr); margin: 1.5rem 0; }
.prose .practice-card, .prose .practice-card:hover { text-decoration: none; color: inherit; }
.prose .practice-card .link-arrow { color: var(--gold-text); }
.prose .practice-card p { font-size: .9rem; color: var(--text-soft); }
.prose .practice-card h3 { margin: 0 0 .6rem; }
.prose .practice-card .eyebrow { font-size: .64rem; color: var(--gold-text); margin-bottom: .6rem; }

/* ---------- Case stories ---------- */
.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.case-card { background: var(--sand-2); color: var(--text); padding: 1.6rem 1.6rem 1.4rem; display: flex; flex-direction: column; }
.case-card h3 { color: var(--text) !important; font-size: 1.35rem; margin-bottom: .7rem; }
.case-card p { font-size: .9rem; color: var(--text-soft); margin-bottom: 1.1rem; line-height: 1.6; }
.case-card .eyebrow { color: var(--gold-text) !important; font-size: .64rem; margin-bottom: .7rem; }
.case-card .link-arrow { margin-top: auto; color: var(--gold-text) !important; }
.dark .disclaimer { color: var(--muted-dark); }

/* ---------- Team ---------- */
.team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.person { text-decoration: none; color: inherit; display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--line); transition: border-color .2s, box-shadow .2s, transform .2s; }
.person:hover { border-color: var(--gold); box-shadow: var(--shadow); transform: translateY(-2px); }
.person .photo { position: relative; overflow: hidden; aspect-ratio: 6 / 5; background: var(--sand); }
.person .photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; transition: transform .6s; }
.person:hover .photo img { transform: scale(1.03); }
.monogram { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-weight: 600; font-size: 3.4rem; color: var(--gold-text); background: #e8e1d5; letter-spacing: .04em; }
.person .meta { padding: 1.1rem 1.25rem 1.25rem; display: flex; flex-direction: column; flex: 1; }
.person h3 { font-size: 1.3rem; margin: 0 0 .25rem; }
.person .role { font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.person p { font-size: .86rem; color: var(--text-soft); margin: .7rem 0 .9rem; line-height: 1.55; }
.person .link-arrow { margin-top: auto; }

/* ---------- Reviews ---------- */
.quote-band { background: var(--ink); color: var(--on-dark); padding: clamp(56px, 7vw, 88px) 0; }
.quote-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.quote-nav { display: flex; gap: .5rem; }
.quote-nav button { width: 42px; height: 42px; border: 1px solid var(--line-dark); background: transparent; color: var(--on-dark); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius); }
.quote-nav button:hover { border-color: var(--gold); color: var(--gold-light); }
.quote-nav .icon { width: 18px; height: 18px; }
.quotes { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.quotes::-webkit-scrollbar { display: none; }
.quote { scroll-snap-align: start; margin: 0; padding-right: 2rem; }
.quote blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.25rem, 2.2vw, 1.75rem); line-height: 1.45; color: var(--white); max-width: 60ch; }
.quote cite { display: block; font-style: normal; font-size: .82rem; color: var(--muted-dark); margin-top: 1rem; }
.quote-count { font-size: .78rem; color: var(--muted-dark); letter-spacing: .08em; }
.stars { display: inline-flex; gap: 3px; color: var(--gold); }
.stars .icon { width: 14px; height: 14px; }
.review-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.review-grid.masonry { display: block; columns: 2 380px; column-gap: 1rem; }
.review-grid.masonry .review { break-inside: avoid; margin-bottom: 1rem; }
.review { background: var(--white); border: 1px solid var(--line); padding: 1.5rem 1.6rem; display: flex; flex-direction: column; gap: .75rem; margin: 0; }
.review h3 { font-size: 1.15rem; margin: 0; }
.review blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: 1rem; line-height: 1.6; color: #2c2d2e; }
.review blockquote p { margin: 0 0 .8em; }
.review blockquote p:last-child { margin-bottom: 0; }
.review cite { font-style: normal; font-size: .8rem; color: var(--text-soft); }
.review[hidden] { display: none; }
.rating-head { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 1.5rem; flex-wrap: wrap; }
.rating-head h2 { margin: 0; }
.rating-score { font-family: var(--serif); font-size: 1.6rem; color: var(--gold-text); white-space: nowrap; }
.rating-note { font-size: .88rem; color: var(--text-soft); margin: 0 0 1.25rem; }
.pill-row { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.75rem; }
.pill { padding: .4rem .9rem; border: 1px solid var(--line-2); background: var(--white); text-decoration: none; font-size: .82rem; border-radius: 99px; color: var(--text); }
button.pill { font: inherit; font-size: .82rem; cursor: pointer; }
.pill:hover, .pill[aria-current="page"], .pill[aria-pressed="true"] { border-color: var(--ink); background: var(--ink); color: var(--white); }
.disclaimer { font-size: .78rem; color: var(--text-soft); margin-top: 1.25rem; }
.disclaimer a { color: inherit; }

/* ---------- Office / consult ---------- */
.office-row { display: grid; grid-template-columns: 1.3fr .9fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.office-row h2 { margin-bottom: 1rem; }
.office-row p { color: var(--text-soft); }
.consult-card { background: var(--white); border: 1px solid var(--line); padding: 1.75rem; box-shadow: var(--shadow); }
.consult-card h3 { font-size: 1.35rem; margin-bottom: .5rem; }
.consult-card p { font-size: .9rem; color: var(--text-soft); }
.office-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2rem; margin: 1.5rem 0 0; }
.office-facts dt { font-size: .64rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-text); }
.office-facts dd { margin: .2rem 0 0; font-size: .92rem; color: var(--text); }
.office-facts a { color: var(--text); }

/* Eyebrows inside cards keep their own size and color (card paragraph rules would otherwise win) */
.info-card .eyebrow, .consult-card .eyebrow, .office-row .eyebrow, .form-card .eyebrow { font-size: .68rem; color: var(--gold-text); margin: 0 0 .7rem; }

/* ---------- FAQ ---------- */
.faq { border-top: 1px solid var(--line); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: flex-start; gap: .75rem; padding: 1rem 0; font-family: var(--serif); font-size: 1.12rem; line-height: 1.35; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary > span { flex: 1; }
.faq summary::before { content: ""; flex: none; width: 0; height: 0; margin-top: .45em; border-left: 6px solid var(--gold-text); border-top: 5px solid transparent; border-bottom: 5px solid transparent; transition: transform .2s; }
.faq details[open] summary::before { transform: rotate(90deg); }
.faq .answer { padding: 0 0 1.1rem 1.2rem; color: var(--text-soft); font-size: .95rem; }
.faq .answer p:last-child { margin-bottom: 0; }

/* ---------- Common questions cards ---------- */
.qa-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.qa-card { background: var(--white); border: 1px solid var(--line); padding: 1.35rem 1.4rem; }
.qa-card h3 { font-size: 1.12rem; margin-bottom: .5rem; }
.qa-card p { margin: 0; font-size: .88rem; color: var(--text-soft); line-height: 1.6; }

/* ---------- Inner page hero ---------- */
.page-hero { position: relative; background: var(--ink); color: var(--on-dark); overflow: hidden; }
.page-hero::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 85% 0%, rgba(201, 161, 79, .08), transparent 55%), repeating-linear-gradient(90deg, rgba(255, 255, 255, .012) 0 1px, transparent 1px 96px); pointer-events: none; }
.page-hero .wrap { position: relative; padding: clamp(40px, 5.5vw, 72px) 0 clamp(44px, 6vw, 76px); }
.page-hero h1 { color: var(--white); max-width: 24ch; font-size: clamp(2.2rem, 4.2vw, 3.5rem); margin-bottom: .9rem; }
.page-hero .lede { margin-bottom: 1.75rem; color: var(--on-dark); font-size: clamp(1rem, 1.3vw, 1.12rem); max-width: 64ch; }
.page-hero .post-meta { margin: -.2rem 0 1.5rem; }
.crumbs { font-size: .74rem; margin-bottom: 1.4rem; color: var(--muted-dark); }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .45rem; margin: 0; padding: 0; }
.crumbs li + li::before { content: "›"; margin-right: .45rem; color: var(--muted-dark); }
.crumbs a { color: var(--on-dark); text-decoration: none; }
.crumbs a:hover { color: var(--gold-light); }
.post-meta { display: flex; flex-wrap: wrap; gap: 1.1rem; font-size: .82rem; color: var(--muted-dark); }

/* ---------- Heading panel (fills the right side of dark page headings) ---------- */
.page-hero .wrap.has-panel { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hero-panel { position: relative; background: linear-gradient(160deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015)); border: 1px solid var(--line-dark); border-top: 2px solid var(--gold); padding: 1.35rem 1.5rem 1.4rem; display: grid; gap: 1rem; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .7); }
.hp-team { display: flex; align-items: center; gap: .9rem; }
.hp-avatars { display: flex; flex: none; }
.hp-avatars img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; object-position: 50% 12%; border: 2px solid var(--ink); background: var(--ink-3); }
.hp-avatars img + img { margin-left: -13px; }
.hp-team strong { display: block; color: var(--white); font-family: var(--serif); font-weight: 600; font-size: 1.05rem; line-height: 1.25; }
.hp-team .hp-names { display: block; font-size: .72rem; color: var(--muted-dark); margin-top: .15rem; }
.hp-rating { display: flex; align-items: center; gap: .9rem; padding-top: 1rem; border-top: 1px solid var(--line-dark); text-decoration: none; }
.hp-score { font-family: var(--serif); font-size: 2.4rem; line-height: 1; color: var(--gold-light); }
.hp-rating-text { display: grid; gap: .2rem; }
.hp-count { font-size: .76rem; color: var(--muted-dark); }
.hp-rating:hover .hp-count { color: var(--gold-light); }
.hp-quote { margin: 0; padding-top: 1rem; border-top: 1px solid var(--line-dark); }
.hp-quote blockquote { margin: 0; font-family: var(--serif); font-style: italic; font-size: .98rem; line-height: 1.55; color: var(--on-dark); }
.hp-quote figcaption { margin-top: .5rem; font-size: .74rem; color: var(--muted-dark); }
.hp-list { list-style: none; margin: 0; padding: 1rem 0 0; border-top: 1px solid var(--line-dark); display: grid; gap: .45rem; font-size: .84rem; color: var(--on-dark); }
.hp-list li { display: flex; align-items: center; gap: .6rem; }
.hp-list li::before { content: ""; flex: none; width: 11px; height: 6px; border-left: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: rotate(-45deg) translateY(-2px); }
@media (max-width: 1100px) { .page-hero .wrap.has-panel { grid-template-columns: minmax(0, 1fr) 320px; } }
@media (max-width: 980px) {
  .page-hero .wrap.has-panel { grid-template-columns: 1fr; gap: 2rem; }
  .hero-panel { max-width: 520px; }
  .hp-quote, .hp-list { display: none; }
}

/* ---------- Article layout ---------- */
.with-aside { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: clamp(2.5rem, 5vw, 4.5rem); align-items: start; }
.aside { position: sticky; top: calc(var(--header-h) + 20px); display: grid; gap: 1rem; }
.side-card { background: var(--sand); border: 1px solid var(--line); padding: 1.35rem 1.4rem; }
.side-card .eyebrow { color: #4b4c4d; font-size: .64rem; margin-bottom: .55rem; }
.side-card h3 { font-size: 1.3rem; margin-bottom: .5rem; }
.side-card p { font-size: .84rem; color: var(--text-soft); line-height: 1.55; margin-bottom: 1rem; }
.side-card .btn { width: 100%; }
.side-card .contact-lines { font-size: .84rem; margin: 1rem 0 0; line-height: 1.7; }
.side-card .contact-lines a { color: var(--text); text-decoration: none; }
.related-list { list-style: none; margin: 0; padding: 0; }
.related-list li + li { border-top: 1px solid var(--line-2); }
.related-list a { display: block; padding: .55rem 0; text-decoration: none; font-size: .86rem; color: var(--gold-text); line-height: 1.45; }
.related-list a:hover { color: var(--text); }
.related-list a[aria-current="page"] { color: var(--text); font-weight: 600; }

/* ---------- Prose ---------- */
.prose { max-width: 72ch; }
.prose > :first-child { margin-top: 0; }
.prose h2 { font-size: clamp(1.55rem, 2.3vw, 2rem); margin: 2em 0 .55em; }
.prose h3 { font-size: clamp(1.2rem, 1.7vw, 1.4rem); margin: 1.7em 0 .45em; }
.prose h4 { font-size: 1.15rem; margin: 1.5em 0 .4em; }
.prose p, .prose li { color: #37393b; font-size: .98rem; }
.prose a { color: var(--gold-text); text-decoration: underline; text-decoration-color: rgba(148, 106, 34, .45); text-underline-offset: 3px; }
.prose a:hover { color: var(--text); }
.prose ul, .prose ol { padding-left: 1.25rem; margin: 0 0 1.3em; }
.prose li { margin-bottom: .45em; }
.prose li::marker { color: var(--gold-text); }
.prose blockquote { margin: 1.6em 0; padding: .3em 0 .3em 1.4rem; border-left: 2px solid var(--gold); font-family: var(--serif); font-style: italic; font-size: 1.2rem; line-height: 1.5; color: var(--text); }
.prose table { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-size: .92rem; display: block; overflow-x: auto; }
.prose th, .prose td { border: 1px solid var(--line); padding: .6rem .8rem; text-align: left; vertical-align: top; }
.prose th { background: var(--sand); }
.callout { background: var(--sand); border-left: 3px solid var(--gold); padding: 1.1rem 1.35rem; margin: 2em 0; font-size: .95rem; }
.prose .faq-title { margin-top: 2.2em; }

/* ---------- Blog cards ---------- */
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.post-card { background: var(--white); border: 1px solid var(--line); padding: 1.5rem; display: flex; flex-direction: column; text-decoration: none; color: inherit; transition: border-color .2s, transform .2s, box-shadow .2s; }
.post-card:hover { border-color: var(--gold); transform: translateY(-2px); box-shadow: var(--shadow); }
.post-card time { font-size: .66rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.post-card h3 { font-size: 1.28rem; margin: .7rem 0; }
.post-card p { font-size: .88rem; color: var(--text-soft); line-height: 1.6; }
.post-card .link-arrow { margin-top: auto; }

/* ---------- Bio ---------- */
.bio-hero { position: relative; background: var(--ink); color: var(--on-dark); }
.bio-hero .grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); width: min(100%, 1320px); margin-inline: auto; min-height: clamp(460px, 56vh, 620px); }
.bio-hero .intro { padding: clamp(40px, 5vw, 72px) clamp(24px, 4vw, 64px) clamp(40px, 5vw, 72px) max(24px, calc((min(100vw, 1320px) - var(--wrap)) / 2)); align-self: center; }
.bio-hero h1 { color: var(--white); font-size: clamp(2.3rem, 4.2vw, 3.6rem); margin-bottom: .35rem; }
.bio-hero .role { font-family: var(--serif); font-size: 1.15rem; color: var(--gold-light); margin: 0 0 1rem; }
.bio-hero .lede { color: var(--on-dark); font-size: 1rem; margin-bottom: 1.6rem; max-width: 46ch; }
.bio-photo { position: relative; min-height: 360px; background: var(--ink-2); }
.bio-photo picture, .bio-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; }
.bio-photo .monogram { position: absolute; inset: 0; font-size: clamp(4rem, 8vw, 7rem); background: linear-gradient(145deg, #23292c, #161a1c); }
.bio-body .facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1rem 2rem; margin: 2rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.bio-body .facts dt { font-size: .64rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-text); }
.bio-body .facts dd { margin: .25rem 0 0; font-size: .92rem; }

/* ---------- Contact ---------- */
.contact-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.25rem; align-items: start; }
.form-card { background: var(--sand); border: 1px solid var(--line); padding: clamp(1.5rem, 3vw, 2.25rem); }
.form-card h2 { font-size: clamp(1.8rem, 2.6vw, 2.3rem); margin-bottom: 1.25rem; }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.form .full { grid-column: 1 / -1; }
.form input, .form select, .form textarea { width: 100%; padding: .8rem .9rem; border: 1px solid var(--line-2); background: var(--white); font: inherit; font-size: .92rem; border-radius: var(--radius); color: var(--text); }
.form input::placeholder, .form textarea::placeholder { color: #8b8c8d; }
.form input:focus, .form select:focus, .form textarea:focus { border-color: var(--gold); outline: 2px solid rgba(201, 161, 79, .3); outline-offset: 0; }
.form textarea { min-height: 150px; resize: vertical; }
.form .consent, .form-note { font-size: .76rem; color: var(--text-soft); margin: 0; }
.info-stack { display: grid; gap: 1rem; }
.info-card { background: var(--white); border: 1px solid var(--line); padding: 1.5rem 1.6rem; }
.info-card h3 { font-size: 1.25rem; margin-bottom: .6rem; }
.info-card p { margin: 0 0 .8rem; font-size: .92rem; color: #37393b; }
.info-card p:last-child { margin-bottom: 0; }
.info-card a { color: var(--text); }
.office-map { display: block; border: 1px solid var(--line); margin-top: .5rem; }
.office-map img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; filter: grayscale(.35) sepia(.1); }

/* ---------- Directory (site map, search) ---------- */
.directory { list-style: none; margin: 0; padding: 0; columns: 2 300px; column-gap: 3rem; }
.directory li { break-inside: avoid; border-bottom: 1px solid var(--line); }
.directory a { display: block; padding: .5rem 0; color: var(--gold-text); font-size: .88rem; text-decoration: underline; text-decoration-color: rgba(148, 106, 34, .35); text-underline-offset: 3px; }
.directory a:hover { color: var(--text); }
.search-form { display: flex; border: 1px solid var(--line-2); background: var(--white); max-width: 560px; margin-bottom: 2rem; }
.search-form input { flex: 1; min-width: 0; background: transparent; border: 0; padding: .8rem 1rem; color: var(--text); font: inherit; font-size: .95rem; }
.search-form button { background: var(--gold-grad); color: #1a1508; border: 0; padding: 0 1.2rem; font-weight: 600; cursor: pointer; }

/* ---------- Gallery (retired, styles kept for the lightbox script) ---------- */
.lightbox { position: fixed; inset: 0; z-index: 200; background: rgba(10, 10, 10, .94); display: none; align-items: center; justify-content: center; }
.lightbox.open { display: flex; }

/* ---------- Footer ---------- */
.site-footer { background: var(--ink); color: var(--muted-dark); font-size: .84rem; }
.site-footer .top { display: grid; grid-template-columns: 1.25fr 1fr .8fr 1fr; gap: 2.5rem; padding: clamp(48px, 6vw, 72px) 0 2.5rem; }
.site-footer .brand { margin-bottom: 1rem; }
.site-footer .brand img { width: 72px; height: 72px; }
.site-footer .brand-name { font-size: 1.45rem; }
.site-footer .brand-sub { font-size: .66rem; }
.site-footer .about { max-width: 34ch; line-height: 1.6; }
.site-footer h3 { font-family: var(--sans); font-size: .85rem; font-weight: 600; color: var(--white); margin-bottom: .9rem; letter-spacing: 0; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer li { margin-bottom: .5rem; line-height: 1.45; }
.site-footer a { color: var(--on-dark); text-decoration: none; }
.site-footer a:hover { color: var(--gold-light); }
.site-footer .contact p { margin: 0 0 .5rem; }
.social { display: flex; gap: .5rem; margin-top: 1.1rem; }
.social a { width: 34px; height: 34px; border: 1px solid var(--line-dark); display: inline-flex; align-items: center; justify-content: center; }
.social a:hover { border-color: var(--gold); }
.social .icon { width: 18px; height: 18px; }
.site-footer .legal { border-top: 1px solid var(--line-dark); padding: 1.4rem 0 2rem; font-size: .74rem; display: grid; gap: .6rem; line-height: 1.6; }
.site-footer .legal .row { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; }

/* ---------- Mobile call bar ---------- */
.callbar { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1480px) {
  .header-phone { display: none; } /* the number stays in the top bar */
}
@media (min-width: 1181px) and (max-width: 1360px) {
  .site-header .wrap { gap: 1.25rem; }
  .brand img { width: 70px; height: 70px; }
  .brand-name { font-size: 1.5rem; }
  .brand-sub { font-size: .64rem; letter-spacing: .26em; }
  .main-nav a, .main-nav button.nav-top { padding-inline: .55rem; }
  html[class*="translated-"] .brand img { width: 56px; height: 56px; }
  html[class*="translated-"] .brand-name { font-size: 1.2rem; }
  html[class*="translated-"] .brand-sub { display: none; }
  html[class*="translated-"] .main-nav a, html[class*="translated-"] .main-nav button.nav-top { padding-inline: .35rem; font-size: .76rem; }
}
@media (min-width: 981px) and (max-width: 1180px) {
  .site-header .wrap { gap: 1rem; }
  .brand img { width: 60px; height: 60px; }
  .brand-name { font-size: 1.3rem; }
  .brand-sub { font-size: .6rem; letter-spacing: .22em; }
  .main-nav a, .main-nav button.nav-top { padding: .6rem .45rem; font-size: .84rem; }
  .header-cta .btn { padding: .75rem .9rem; font-size: .82rem; }
  html[class*="translated-"] .main-nav a, html[class*="translated-"] .main-nav button.nav-top { padding-inline: .3rem; font-size: .74rem; }
  html[class*="translated-"] .header-cta .btn { max-width: 9rem; padding-inline: .7rem; font-size: .74rem; }
  html[class*="translated-"] .brand-sub { display: none; }
}
@media (max-width: 1100px) {
  .practice-grid.four { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 981px) and (max-width: 1100px) {
  .main-nav .nav-home { display: none; } /* the logo links home */
  html[class*="translated-"] .brand img { width: 46px; height: 46px; }
  html[class*="translated-"] .brand-name { font-size: .98rem; }
  html[class*="translated-"] .site-header .wrap { gap: .6rem; }
}
@media (max-width: 980px) {
  :root { --header-h: 84px; }
  .tb-address { display: none; }
  .site-search { margin-left: 0; flex: 1 1 auto; }
  .menu-toggle { display: inline-flex; }
  .main-nav { position: fixed; inset: calc(var(--header-h) + var(--topbar-h)) 0 0 0; background: var(--ink); overflow-y: auto; padding: 1rem 24px 6rem; display: none; margin: 0; }
  .site-header.scrolled .main-nav { inset-block-start: var(--header-h); }
  body.nav-open .main-nav { display: block; }
  body.nav-open { overflow: hidden; }
  .main-nav > ul { flex-direction: column; align-items: stretch; gap: 0; }
  .main-nav > ul > li { border-bottom: 1px solid var(--line-dark); }
  .main-nav a, .main-nav button.nav-top { width: 100%; justify-content: space-between; padding: .95rem 0; font-size: 1.02rem; }
  .mega { position: static; box-shadow: none; border: 0; padding: 0 0 1rem; background: transparent; }
  .mega .wrap { grid-template-columns: 1fr; gap: 1.25rem; width: 100%; }
  .mega .mega-cta { display: none; }
  .header-cta { display: none; }
  .hero-photo { position: relative; width: 100%; height: clamp(300px, 70vw, 460px); }
  .hero-photo::after { background: linear-gradient(0deg, var(--ink) 0%, rgba(22, 26, 28, 0) 45%); }
  .hero .wrap { min-height: 0; }
  .hero-copy { padding: 0 0 clamp(48px, 8vw, 72px); margin-top: -2rem; }
  .with-aside, .contact-grid, .office-row, .sec-head, .sec-head.split { grid-template-columns: 1fr; }
  .aside { position: static; }
  .practice-grid, .case-grid, .team-grid, .card-grid, .qa-grid { grid-template-columns: repeat(2, 1fr); }
  .pillars { grid-template-columns: 1fr; }
  .site-footer .top { grid-template-columns: 1fr 1fr; }
  .bio-hero .grid { grid-template-columns: 1fr; }
  .bio-hero .intro { padding: 36px 24px 44px; order: 2; }
  .bio-photo { min-height: 0; aspect-ratio: 4 / 3.4; }
}
@media (max-width: 640px) {
  body { padding-bottom: 60px; }
  .wrap, .narrow { width: min(100% - 36px, var(--wrap)); }
  .brand { gap: .75rem; }
  .brand img { width: 58px; height: 58px; }
  .brand-name { font-size: 1.28rem; }
  .brand-sub { font-size: .6rem; letter-spacing: .2em; }
  @media (max-width: 380px) { .brand img { width: 48px; height: 48px; } .brand-name { font-size: 1.1rem; } .brand-sub { font-size: .52rem; letter-spacing: .16em; } }
  .practice-grid.two { grid-template-columns: 1fr; }
  .practice-grid, .practice-grid.four, .case-grid, .team-grid, .card-grid, .qa-grid, .review-grid { grid-template-columns: 1fr; }
  .form { grid-template-columns: 1fr; }
  .site-footer .top { grid-template-columns: 1fr; }
  .office-facts { grid-template-columns: 1fr; }
  .pillar { min-height: 260px; padding: 1.6rem; }
  .langpick-menu { left: auto; right: -48px; transform: translateY(-6px); }
  .langpick.open .langpick-menu { transform: translateY(0); }
  .callbar { display: grid; grid-template-columns: 1fr 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; background: var(--ink); border-top: 1px solid var(--line-dark); }
  .callbar a { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .95rem .5rem; text-decoration: none; font-weight: 600; font-size: .85rem; white-space: nowrap; color: var(--white); }
  .callbar a + a { background: var(--gold-grad); color: #1a1508; }
}

/* ---------- Top bar responsive ---------- */
@media (max-width: 1240px) { .tb-hours { display: none; } }
@media (max-width: 980px) { .langpick-menu { left: auto; right: 0; transform: translateY(-6px); } .langpick.open .langpick-menu { transform: translateY(0); } }
@media (max-width: 640px) {
  :root { --topbar-h: 52px; }
  .topbar .wrap { gap: .5rem; width: min(100% - 24px, 1440px); }
  .tb-phone span { display: none; }
  .tb-phone { width: 38px; height: 38px; justify-content: center; border: 1px solid var(--line-dark); border-radius: 50%; }
  .ss-key { display: none; }
  .site-search input { padding-right: .8rem; font-size: 16px; }
  .ss-results { min-width: 0; }
  .langpick-current { display: none; }
  .langpick-btn { padding: 0 .6rem; }
}

/* ---------- Trust strip buttons + popups ---------- */
.trust-strip li:has(> .trust-btn) { padding: 0; }
.trust-btn { position: relative; width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; padding: 1.05rem .75rem .95rem; background: var(--sand); border: 0; cursor: pointer; font: 600 .8rem var(--sans); color: #3b3c3d; text-align: center; transition: background .2s, color .2s; }
.trust-btn svg { width: 19px; height: 19px; color: var(--gold-text); transition: transform .25s; }
.trust-more { font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); opacity: .7; transition: opacity .2s; }
.trust-btn:hover, .trust-btn:focus-visible { background: var(--white); color: var(--text); }
.trust-btn:hover svg, .trust-btn:focus-visible svg { transform: translateY(-2px) scale(1.08); }
.trust-btn:hover .trust-more, .trust-btn:focus-visible .trust-more { opacity: 1; }
.trust-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.info-pop { padding: 0; border: 0; background: transparent; width: min(640px, calc(100vw - 24px)); max-width: none; max-height: calc(100vh - 24px); overflow: visible; color: var(--text); }
.info-pop::backdrop { background: rgba(10, 12, 13, .64); backdrop-filter: blur(3px); }
.info-pop[open] .ip-card { animation: ipIn .22s ease-out; }
@keyframes ipIn { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
.ip-card { position: relative; background: var(--cream); border-top: 3px solid var(--gold); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .65); padding: clamp(1.4rem, 3.5vw, 2.2rem); max-height: calc(100vh - 24px); overflow-y: auto; }
.ip-close { position: absolute; top: .75rem; right: .8rem; width: 38px; height: 38px; border: 1px solid var(--line); background: var(--white); font-size: 1.35rem; line-height: 1; cursor: pointer; color: var(--text); border-radius: 50%; }
.ip-close:hover { border-color: var(--gold); color: var(--gold-text); }
.ip-head { display: flex; gap: 1rem; align-items: center; margin-bottom: 1.1rem; padding-right: 2.6rem; }
.ip-icon { flex: none; width: 56px; height: 56px; border-radius: 50%; background: var(--ink); color: var(--gold-light); display: grid; place-items: center; }
.ip-icon svg { width: 26px; height: 26px; }
.ip-head .eyebrow { margin-bottom: .3rem; }
.ip-head h2 { font-size: clamp(1.5rem, 3vw, 2rem); margin: 0; }
.ip-body { font-size: .95rem; color: #37393b; line-height: 1.65; }
.ip-body p { margin: 0 0 .9rem; }
.ip-body a { color: var(--gold-text); }
.ip-note { font-size: .84rem; color: var(--text-soft); }
.ip-body .ip-label { font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin: 1.1rem 0 .5rem; }
.ip-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.ip-chips li { font-size: .78rem; line-height: 1.3; background: var(--white); border: 1px solid var(--line); padding: .32rem .6rem; }
.ip-links { list-style: none; margin: .3rem 0 0; padding: 0; display: grid; }
.ip-links a { display: inline-block; padding: .28rem 0; font-weight: 600; font-size: .9rem; text-decoration: none; }
.ip-links a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ip-steps { margin: 0 0 1rem; padding-left: 1.3rem; display: grid; gap: .55rem; }
.ip-steps li::marker { color: var(--gold-text); font-weight: 700; }
.ip-people { display: grid; gap: .5rem; margin: .4rem 0 1rem; }
.ip-body .ip-person { display: flex; align-items: center; gap: .8rem; padding: .55rem .7rem; background: var(--white); border: 1px solid var(--line); text-decoration: none; color: var(--text); }
.ip-body .ip-person:hover { border-color: var(--gold); }
.ip-person img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; object-position: 50% 12%; }
.ip-person strong { display: block; font-family: var(--serif); font-size: 1rem; font-weight: 600; }
.ip-person span span { font-size: .8rem; color: var(--gold-text); font-weight: 600; }
.ip-facts { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem 1.5rem; margin: .4rem 0 1rem; }
.ip-facts dt { font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.ip-facts dd { margin: .15rem 0 0; font-size: .9rem; }
.ip-body .ip-rating { display: flex; align-items: center; gap: .9rem; padding: .8rem 1rem; background: var(--ink); text-decoration: none; margin-bottom: 1rem; }
.ip-checks { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .5rem; }
.ip-checks li { display: flex; gap: .65rem; }
.ip-checks li::before { content: ""; flex: none; width: 11px; height: 6px; margin-top: .5em; border-left: 2px solid var(--gold-text); border-bottom: 2px solid var(--gold-text); transform: rotate(-45deg); }
.ip-quote { margin: 0; padding: .9rem 1.1rem; background: var(--sand); border-left: 3px solid var(--gold); }
.ip-quote blockquote { margin: 0; font-family: var(--serif); font-style: italic; }
.ip-quote figcaption { font-size: .78rem; color: var(--text-soft); margin-top: .35rem; }
.ip-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; padding-top: 1.2rem; border-top: 1px solid var(--line); }
@media (max-width: 640px) {
  .ip-facts { grid-template-columns: 1fr; }
  .ip-actions .btn { flex: 1 1 100%; }
  .trust-more { display: none; }
}

/* ---------- Case spotlight (courthouse photo) ---------- */
.spotlight { position: relative; background: var(--ink); color: var(--on-dark); overflow: hidden; }
.spot-photo { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; }
.spot-photo picture, .spot-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 40%; }
.spot-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink) 0%, rgba(22, 26, 28, .78) 26%, rgba(22, 26, 28, .15) 62%, rgba(22, 26, 28, 0) 100%); }
.spotlight .wrap { position: relative; min-height: clamp(420px, 44vw, 540px); display: flex; align-items: center; }
.spot-copy { max-width: 540px; padding: clamp(56px, 7vw, 88px) 0; }
.spotlight h2 { color: var(--white); font-size: clamp(2.2rem, 4.2vw, 3.4rem); line-height: 1.08; margin-bottom: 1.1rem; }
.spotlight h2 em { font-style: italic; color: var(--gold-light); }
.spot-lede { font-size: 1.05rem; line-height: 1.65; color: var(--on-dark); margin-bottom: 1.6rem; }
.spotlight .disclaimer { color: var(--muted-dark); margin-top: 1.4rem; }
.pillar-court img { opacity: .5; filter: grayscale(.2) sepia(.15); }
@media (max-width: 980px) {
  .spot-photo { position: relative; width: 100%; height: clamp(240px, 56vw, 380px); }
  .spot-photo::after { background: linear-gradient(0deg, var(--ink) 0%, rgba(22, 26, 28, 0) 55%); }
  .spotlight .wrap { min-height: 0; }
  .spot-copy { padding: 0 0 clamp(48px, 8vw, 64px); margin-top: -2.5rem; }
}

/* ---------- Firm websites (footer) ---------- */
.firm-sites { border-top: 1px solid var(--line-dark); padding: 2.5rem 0 2.25rem; }
.fs-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1.5rem; margin-bottom: 1.4rem; }
.fs-head .eyebrow { flex-basis: 100%; margin-bottom: .2rem; }
.site-footer .fs-head h3 { font-family: "Playfair Display", var(--serif); font-size: 1.65rem; font-weight: 600; color: var(--white); margin: 0; }
.fs-head p:last-child { margin: 0; font-size: .86rem; color: var(--muted-dark); }
.fs-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.site-footer .fs-grid li { margin: 0; }
.fs-grid a { display: flex; flex-direction: column; gap: .3rem; height: 100%; padding: 1rem 1.15rem; border: 1px solid var(--line-dark); background: rgba(255, 255, 255, .02); transition: border-color .2s, background .2s, transform .2s; }
.fs-grid a:hover { border-color: var(--gold); background: rgba(201, 161, 79, .07); transform: translateY(-2px); }
.fs-name { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-family: "Playfair Display", var(--serif); font-size: 1.12rem; font-weight: 600; color: var(--white); }
.fs-name svg { width: 16px; height: 16px; color: var(--gold); flex: none; transition: transform .2s; }
.fs-grid a:hover .fs-name svg { transform: translate(2px, -2px); }
.fs-desc { font-size: .8rem; color: var(--muted-dark); line-height: 1.45; }
@media (max-width: 980px) { .fs-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .fs-grid { grid-template-columns: 1fr; } }

/* ---------- Search page ---------- */
.search-page-form { display: flex; gap: .6rem; max-width: 680px; margin-bottom: 1.5rem; }
.search-page-form input { flex: 1; min-width: 0; height: 50px; padding: 0 1rem; border: 1px solid var(--line-2); background: var(--white); font: 1rem var(--sans); color: var(--text); }
.search-page-form input:focus { outline: 2px solid rgba(201, 161, 79, .35); border-color: var(--gold); }
.search-page-results { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; max-width: 860px; }
.search-page-results .ss-item { border: 1px solid var(--line); background: var(--white); }


/* ---------- Photography (2026-09-16) ---------- */
.page-hero.has-bg::before { display: none; }
.ph-bg { position: absolute; inset: 0; }
.ph-bg picture, .ph-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 45%; opacity: .95; }
.ph-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22, 26, 28, .97) 0%, rgba(22, 26, 28, .9) 30%, rgba(22, 26, 28, .45) 62%, rgba(22, 26, 28, .2) 100%), linear-gradient(0deg, rgba(22, 26, 28, .6), rgba(22, 26, 28, 0) 40%); }
.page-hero .wrap { z-index: 1; }
.page-hero.has-bg .hero-panel { background: rgba(22, 26, 28, .62); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.pillar img { opacity: .85; filter: saturate(.95); }
.pillar-court img { opacity: .85; filter: saturate(.95); }
.pillar::after { background: linear-gradient(180deg, rgba(22, 26, 28, .45) 0%, rgba(22, 26, 28, .9) 100%), linear-gradient(90deg, rgba(22, 26, 28, .55), rgba(22, 26, 28, 0) 70%); }
.cc-img { margin: -1.6rem -1.6rem 1.2rem; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink-3); }
.cc-img picture, .cc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.case-card:hover .cc-img img { transform: scale(1.04); }
.post-card.has-img { padding: 0; overflow: hidden; }
.pc-img { aspect-ratio: 16 / 10; overflow: hidden; background: var(--sand); }
.pc-img picture, .pc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.post-card:hover .pc-img img { transform: scale(1.04); }
.pc-body { display: flex; flex-direction: column; flex: 1; padding: 1.35rem 1.5rem 1.5rem; }
.pc-body .link-arrow { margin-top: auto; }
.cta-band { position: relative; background: var(--ink); color: var(--on-dark); overflow: hidden; }
.cta-bg { position: absolute; inset: 0; }
.cta-bg picture, .cta-bg img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 55%; opacity: .75; }
.cta-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, var(--ink) 8%, rgba(22, 26, 28, .78) 45%, rgba(22, 26, 28, .2) 100%); }
.cta-band .wrap { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem 3rem; padding: clamp(56px, 7vw, 96px) 0; }
.cta-copy { max-width: 560px; }
.cta-title { font-family: var(--serif); font-size: clamp(2rem, 3.6vw, 3rem); line-height: 1.1; color: var(--white); margin: 0 0 .6rem; letter-spacing: -.015em; }
.cta-copy p:last-child { margin: 0; color: var(--on-dark); }
@media (max-width: 980px) {
  .ph-bg picture, .ph-bg img { opacity: .8; }
  .ph-bg::after { background: linear-gradient(0deg, var(--ink) 0%, rgba(22, 26, 28, .86) 55%, rgba(22, 26, 28, .6) 100%); }
  .cta-bg::after { background: linear-gradient(0deg, var(--ink) 15%, rgba(22, 26, 28, .7) 100%); }
}


/* ---------- Motto under the firm name: same width as the name, centered (2026-09-16) ---------- */
.site-header .brand-text, .site-footer .brand-text { display: inline-grid; }
.brand-sub { text-align: justify; text-align-last: justify; letter-spacing: .24em; margin-right: -.24em; }
.site-footer .brand-sub { font-size: .62rem; letter-spacing: .22em; margin-right: -.22em; }
@media (max-width: 1360px) { .site-header .brand-sub { letter-spacing: .2em; margin-right: -.2em; } }
@media (max-width: 1180px) { .site-header .brand-sub { letter-spacing: .14em; margin-right: -.14em; } }
/* ---------- ProperWage card, sister firm, Florida office ---------- */
.fs-sister-label { text-align: center; line-height: 1.5; }
.pw-card { border-top: 3px solid var(--gold); }
.pw-card .btn { width: 100%; }
.callout.pw-callout { border-left-color: var(--ink); background: var(--white); border: 1px solid var(--line); border-left: 3px solid var(--gold); }
.fs-sister { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: .2rem 1rem; margin-top: .75rem; padding: 1rem 1.15rem; border: 1px dashed var(--line-dark); transition: border-color .2s, background .2s; }
.fs-sister:hover { border-color: var(--gold); background: rgba(201, 161, 79, .07); }
.fs-sister-label { grid-row: span 2; align-self: center; font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); border: 1px solid var(--line-dark); padding: .35rem .6rem; }
.fs-sister .fs-name { justify-content: flex-start; gap: .6rem; }
.site-footer .fl-office { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--line-dark); line-height: 1.55; }
.site-footer .fl-office > span { display: block; font-size: .64rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin-bottom: .2rem; }
@media (max-width: 640px) { .fs-sister { grid-template-columns: 1fr; } .fs-sister-label { grid-row: auto; justify-self: start; } }


/* ---------- Language button: clearer (2026-09-16) ---------- */
.topbar .langpick-btn { border-color: rgba(201, 161, 79, .55); background: rgba(201, 161, 79, .1); color: var(--white); }
.langpick-label { color: var(--gold-light); font-weight: 600; }
.langpick-label::after { content: ":"; }
.langpick-code { display: none; font-weight: 700; letter-spacing: .06em; }
@media (max-width: 1240px) { .langpick-label { display: none; } }
@media (max-width: 640px) { .langpick-current { display: none; } .langpick-code { display: inline; } .langpick-btn { padding: 0 .65rem; } }
.nav-lang { display: none; }
@media (max-width: 980px) {
  .main-nav > ul > li.nav-lang { display: block; border-bottom: 0; padding: 1.2rem 0 .5rem; }
  .nav-lang-t { margin: 0 0 .7rem; font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }
  .nav-lang-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .45rem; }
  .nav-lang-grid button { padding: .6rem .4rem; border: 1px solid var(--line-dark); background: transparent; color: var(--on-dark); font: 600 .85rem var(--sans); cursor: pointer; border-radius: var(--radius); }
  .nav-lang-grid button[aria-pressed="true"] { border-color: var(--gold); color: var(--gold-light); background: rgba(201, 161, 79, .1); }
}
.lang-notice { position: fixed; left: 50%; bottom: 84px; z-index: 300; transform: translate(-50%, 20px); max-width: min(92vw, 420px); padding: .8rem 1.1rem; background: var(--ink); color: var(--white); border: 1px solid var(--gold); font-size: .9rem; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.lang-notice.show { opacity: 1; transform: translate(-50%, 0); }
/* ---------- Search results: grouped, one line each ---------- */
.ss-group + .ss-group { margin-top: .3rem; padding-top: .3rem; border-top: 1px solid var(--line); }
.ss-head { margin: .35rem .7rem .2rem; font-size: .6rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.ss-item { align-items: center; padding: .5rem .7rem; }
.ss-text { min-width: 0; flex: 1; }
.ss-text strong { font-size: .98rem; }
.ss-text > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ss-go { flex: none; color: var(--gold-text); opacity: 0; transition: opacity .15s, transform .15s; }
.ss-item[aria-selected="true"] .ss-go, .ss-item:hover .ss-go { opacity: 1; transform: translateX(2px); }
.ss-best { background: var(--sand-2); }
.ss-tag { display: inline-block; margin-left: .5rem; padding: .1rem .45rem; border-radius: 999px; background: var(--gold-grad); color: #1a1508; font-family: var(--sans); font-size: max(.62rem, 11px); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; vertical-align: .12em; }
.search-page-results .ss-group { background: var(--white); border: 1px solid var(--line); padding: .4rem; margin-bottom: .8rem; }
.search-page-results .ss-item { border: 0; }
.search-page-results .ss-text > span { white-space: normal; }
/* ---------- Related firm websites card ---------- */
.site-list { list-style: none; margin: 0; padding: 0; }
.site-list li + li { border-top: 1px solid var(--line-2); }
.site-list a { display: block; padding: .55rem 0; text-decoration: none; }
.site-list strong { display: block; font-family: var(--serif); font-weight: 600; font-size: 1.02rem; color: var(--text); }
.site-list span { display: block; font-size: .8rem; color: var(--text-soft); line-height: 1.45; }
.site-list a:hover strong { color: var(--gold-text); }
.site-card { border-top: 3px solid var(--gold); }
.callout.site-callout { background: var(--white); border: 1px solid var(--line); border-left: 3px solid var(--gold); }


/* ---------- Practice Areas menu: four columns with stacked sections (2026-09-16) ---------- */
.mega .wrap { grid-template-columns: minmax(0, 1.1fr) repeat(4, minmax(0, 1fr)); gap: 2rem 2rem; }
.mega-col, .mega-block, .mega li a { min-width: 0; }
.main-nav .mega li a, .main-nav .mega h3 a, .main-nav .mega .mega-cta .btn { white-space: normal; }
.mega h3 { align-items: flex-start; }
.mega-col { display: grid; gap: 1.6rem; align-content: start; }
.mega-block h3 { margin-bottom: .6rem; }
.mega .mega-cta { padding: 1.2rem 1.3rem; }
.mega .mega-cta h3 { font-size: 1.05rem; margin-bottom: .8rem; }
.practice-grid.five { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1360px) { .mega .wrap { gap: 1.6rem 1.25rem; } .mega li a { font-size: .84rem; } }
@media (max-width: 1180px) { .mega .wrap { gap: 1.4rem 1rem; } .mega .mega-cta { padding: 1rem; } .mega li a { font-size: .84rem; } .mega h3 { font-size: 1rem; } .practice-grid.five { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 980px) { .mega .wrap { grid-template-columns: 1fr; } .mega-col { gap: 1.2rem; } .practice-grid.five { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .practice-grid.five { grid-template-columns: 1fr; } }


/* ================================================================= 2026-09-16 review fixes */

/* ---------- Home hero: copy first in the DOM; photo right on desktop, below the copy on phones ---------- */
.hero .wrap { z-index: 1; }
.hero h1 .h1-line { display: block; color: var(--gold-light); }
@media (min-width: 981px) { .hero-copy { max-width: 660px; } .hero h1 { font-size: clamp(2.6rem, 4vw, 3.7rem); } }
.hero .sub { max-width: 52ch; }
.hero-actions { align-items: center; }
.hero-call { display: inline-flex; align-items: baseline; gap: .45rem; padding: .7rem .2rem; color: var(--white); font-weight: 600; font-size: 1.05rem; text-decoration: none; border-bottom: 1px solid transparent; }
.hero-call .hc-label { font-weight: 400; font-size: .85rem; color: var(--muted-dark); }
.hero-call:hover { color: var(--gold-light); border-bottom-color: var(--gold); }
.hero .small { margin: 1.4rem 0 0; letter-spacing: .06em; }
@media (max-width: 980px) {
  .hero { display: flex; flex-direction: column; }
  .hero .wrap { order: 0; }
  .hero-copy { padding: clamp(28px, 7vw, 48px) 0 1.5rem; margin-top: 0; }
  .hero h1 { font-size: clamp(2.05rem, 8.4vw, 3rem); margin-bottom: 1rem; }
  .hero .sub { font-size: 1.02rem; }
  .hero-photo { order: 1; position: relative; width: 100%; height: clamp(170px, 42vw, 280px); }
  .hero-photo img { object-position: 50% 22%; }
  .hero-photo::after { background: linear-gradient(180deg, var(--ink) 0%, rgba(22, 26, 28, 0) 38%); }
}

/* ---------- Compact trust line (practice pages) ---------- */
.trust-line { background: var(--sand); border-bottom: 1px solid var(--line); }
.trust-line ul { list-style: none; margin: 0 auto; padding: .8rem 0; display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 2rem; font-size: .84rem; color: var(--text-soft); }
.trust-line li { display: flex; align-items: center; gap: .6rem; margin: 0; }
.trust-line strong { color: var(--text); font-weight: 600; }
.trust-line a { color: var(--gold-text); }
.trust-line li > a { color: inherit; text-decoration: none; }
.trust-line li > a strong { color: var(--gold-text); }
.trust-line li > a:hover strong { text-decoration: underline; }
.tl-avatars { display: inline-flex; }
.tl-avatars img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; border: 2px solid var(--sand); }
.tl-avatars img + img { margin-left: -10px; }
@media (max-width: 640px) { .trust-line ul { gap: .45rem 1.2rem; font-size: .8rem; } .trust-line li:nth-child(3) { display: none; } }

/* ---------- Rating attribution ---------- */
.rating-score { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.1; }
.rating-score small { font-family: var(--sans); font-size: .72rem; color: var(--text-soft); letter-spacing: .02em; margin-top: .3rem; }
.hp-count { line-height: 1.35; }

/* ---------- Consultation form ---------- */
.consult-form { gap: 1rem .9rem; }
.consult-form .field { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.consult-form label, .consult-form legend { font-size: .86rem; font-weight: 600; color: var(--text); }
.consult-form .req { color: #9a2b1c; margin-left: .15rem; }
.form-intro { font-size: .82rem; color: var(--text-soft); margin: -.4rem 0 0; }
.field-set { border: 0; margin: 0; padding: 0; min-width: 0; }
.field-set legend { padding: 0; margin-bottom: .5rem; }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.field-set > .field-error { margin-top: .5rem; }
.legend-hint { display: block; font-weight: 400; font-size: .78rem; color: var(--text-soft); margin-top: .1rem; }
.field-hint { font-size: .78rem; color: var(--text-soft); margin: 0; line-height: 1.45; }
.field-error { display: flex; gap: .4rem; align-items: flex-start; margin: .1rem 0 0; font-size: .8rem; font-weight: 600; color: #9a2b1c; line-height: 1.4; }
.field-error::before { content: "!"; flex: none; display: inline-grid; place-items: center; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: #9a2b1c; color: #fff; font-size: .7rem; margin-top: .1rem; }
.field-error[hidden] { display: none; }
.consult-form [aria-invalid="true"] { border-color: #9a2b1c; box-shadow: inset 0 0 0 1px #9a2b1c; }
.consult-form input, .consult-form select, .consult-form textarea { min-height: 46px; }
.form-summary { background: #fbeeeb; border: 1px solid #e3b4ab; border-left: 4px solid #9a2b1c; padding: .9rem 1.1rem; font-size: .88rem; }
.form-summary p { margin: 0 0 .35rem; }
.form-summary ul { margin: 0; padding-left: 1.1rem; }
.form-summary a { color: #7c2216; }
.form-status:empty { display: none; }
.form-status { font-size: .9rem; }
.form-status.is-error { background: #fbeeeb; border: 1px solid #e3b4ab; border-left: 4px solid #9a2b1c; padding: .9rem 1.1rem; }
.form-status p { margin: 0 0 .4rem; }
.form-status p:last-child { margin: 0; }
.form-status a, .form-success a { color: var(--text); font-weight: 600; }
.form-success { background: var(--white); border: 1px solid var(--line); border-left: 4px solid #3f7a4a; padding: 1.4rem 1.5rem; }
.form-success h3 { font-size: 1.5rem; margin: 0 0 .5rem; }
.form-success p { font-size: .92rem; color: var(--text-soft); }
.form-success .eyebrow { color: #3f7a4a; }
.btn.is-busy { opacity: .75; cursor: progress; }
.hp-field { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.consult-form { position: relative; }
@media (max-width: 640px) { .field-pair { grid-template-columns: 1fr; } }

/* ---------- Office map (OpenStreetMap) ---------- */
.office-map { margin: 0; background: var(--white); border: 1px solid var(--line); }
.office-map iframe { display: block; width: 100%; aspect-ratio: 4 / 3; border: 0; background: #e8e4dc; }
.office-map figcaption { padding: 1rem 1.15rem 1.1rem; font-size: .88rem; color: var(--text-soft); }
.office-map .om-title { font-family: var(--serif); font-size: 1.15rem; color: var(--text); margin: 0 0 .35rem; }
.office-map address { font-style: normal; color: var(--text); margin-bottom: .5rem; }
.office-map p { margin: 0 0 .5rem; }
.office-map .om-links { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; align-items: baseline; }
.office-map .om-links a:not(.link-arrow) { color: var(--text-soft); font-size: .82rem; }
.office-map .om-credit { font-size: .72rem; margin: 0; }
.office-map .om-credit a { color: inherit; }
.info-card .office-map { margin-top: 1rem; }
.office-row .office-map { align-self: stretch; }
.info-card address { font-style: normal; margin-bottom: .8rem; }
.site-sister { font-size: .84rem; color: var(--text-soft); }

/* ---------- Attorney directory ---------- */
.person .photo img { object-position: 50% 16%; }
.monogram { background: linear-gradient(145deg, #23292c, #161a1c); color: var(--gold-light); font-size: 3rem; }
.monogram span { display: grid; place-items: center; width: min(5.2em, 72%); height: auto; aspect-ratio: 1 / 1; border: 1px solid rgba(201, 161, 79, .55); border-radius: 50%; font-size: .5em; letter-spacing: .08em; }
.counsel-sec .sec-head { margin-bottom: 1.25rem; }
.counsel-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.person-oc { flex-direction: row; align-items: stretch; background: var(--white); }
.counsel-grid .person-oc { flex-direction: column; }
.person-oc .photo { aspect-ratio: 1 / 1; }
.person-oc .meta { padding: .9rem 1rem 1rem; }
.person-oc h3 { font-size: 1.08rem; }
.person-oc p { font-size: .8rem; margin: .5rem 0 .7rem; }
.person-oc .photo img { filter: saturate(.9); }
.person .role { font-size: .64rem; }
@media (max-width: 980px) { .counsel-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) {
  .counsel-grid { grid-template-columns: 1fr; }
  .counsel-grid .person-oc { flex-direction: row; }
  .counsel-grid .person-oc .photo { flex: 0 0 110px; aspect-ratio: auto; min-height: 130px; }
}

/* ---------- Footer: companion-site boxes (restored 2026-09-17 at Mikhail's request) ---------- */
.site-footer .fs-title-unused { font-family: var(--sans); font-size: .7rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-light); margin: 0 0 .7rem; }
.fs-inline { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem 1.3rem; font-size: .86rem; }
.site-footer .fs-inline li { margin: 0; }
.fs-inline a { color: var(--on-dark); text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .18); padding-bottom: 1px; }
.fs-inline a:hover, .fs-inline a:focus-visible { color: var(--gold-light); border-bottom-color: var(--gold); }
.fs-inline .fs-more { color: var(--gold-light); }
.fs-sister-line { margin: .9rem 0 0; font-size: .84rem; color: var(--muted-dark); }
.fs-sister-line a { color: var(--on-dark); }
.fl-badge { display: inline-flex; flex-direction: column; align-items: center; gap: .2rem; flex: none; color: var(--gold); }
.fl-badge svg { width: 46px; height: 46px; }
.fl-badge > span { font-size: max(.72rem, 12px); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.sister-box { position: relative; }
.sister-box .fl-badge { position: absolute; top: 1.3rem; right: 1.5rem; color: var(--gold-text); }
.sister-box .fl-badge svg { width: 64px; height: 64px; }
@media (max-width: 640px) { .sister-box { padding-right: 1.5rem !important; } .sister-box .fl-badge { position: static; flex-direction: row; margin-bottom: .6rem; } .sister-box .fl-badge svg { width: 40px; height: 40px; } }
.site-footer .fl-office > span span { display: inline; font: inherit; letter-spacing: inherit; margin: 0; color: inherit; }

/* ---------- Practice-page sidebar: companion sites ---------- */
.site-list strong span { display: inline; }
.site-card .site-sister { margin: .8rem 0 0; font-size: .8rem; }
.site-card .site-sister a { color: var(--text); }
.site-card .site-all { margin: .8rem 0 0; font-size: .8rem; }
.site-card .site-all a { color: var(--gold-text); }

/* ---------- Our Websites page ---------- */
.site-directory { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: .9rem; }
.site-directory a { display: flex; flex-direction: column; gap: .3rem; height: 100%; padding: 1.1rem 1.25rem; background: var(--white); border: 1px solid var(--line); text-decoration: none; color: inherit; }
.site-directory a:hover { border-color: var(--gold); }
.sd-name { font-family: var(--serif); font-size: 1.2rem; font-weight: 600; color: var(--text); }
.sd-desc { font-size: .88rem; color: var(--text-soft); }
.sister-box { margin-top: 2rem; padding: 1.4rem 8rem 1.4rem 1.5rem; border: 1px dashed var(--line-2); background: var(--sand); }
.sister-box h2 { font-size: 1.6rem; margin-bottom: .5rem; }
@media (max-width: 640px) { .site-directory { grid-template-columns: 1fr; } }


/* ---------- Minimum readable text size: 12px for labels and small print (2026-09-16) ---------- */
.eyebrow, .side-card .eyebrow, .practice-card .eyebrow, .prose .practice-card .eyebrow, .case-card .eyebrow, .info-card .eyebrow, .consult-card .eyebrow, .office-row .eyebrow, .form-card .eyebrow, .mega .mega-cta .eyebrow { font-size: max(.75rem, 12px); }
.person .role, .site-footer .fl-office > span, .site-footer .fs-title, .trust-more, .tb-hours, .office-facts dt, .prose .facts dt, .bio-body .facts dt, .ip-facts dt, .facts dt, dt { font-size: max(.75rem, 12px); }
.site-footer .legal p, .site-footer .legal .row, .site-footer .legal a, .post-card time, .pc-body time, .hp-names, .hp-quote figcaption, .rating-score small, .office-map .om-credit { font-size: max(.75rem, 12px); }
.site-footer .top a, .site-footer .top p, .site-footer .top li { font-size: max(.8rem, 12.8px); }
.page-hero .crumbs, .page-hero .crumbs a, .page-hero .crumbs span, .bio-hero .crumbs, .bio-hero .crumbs a, .bio-hero .crumbs span, .hero-panel .hp-team .hp-names, .hero-panel .hp-team .hp-names span { font-size: max(.75rem, 12px); }

/* ---------- Sticky header / bottom call bar must never cover focused fields or messages ---------- */
@media (max-width: 640px) {
  html { scroll-padding-bottom: 76px; }
  .consult-form :is(input, select, textarea, button), .form-summary, .form-status, .form-success { scroll-margin-bottom: 84px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
@media print {
  .topbar, .site-header, .callbar, .aside, .site-footer .top { display: none; }
  body { background: #fff; }
}

/* Footer affiliated-firm card with Florida badge (2026-09-17) */
.site-footer .fs-sister { grid-template-columns: auto 1fr auto; align-items: center; gap: .4rem 1.25rem; }
.fs-sister .fs-sister-label { grid-row: auto; }
.fs-sister-main { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.fs-head p:last-child a { color: var(--gold-light); }
@media (max-width: 640px) { .site-footer .fs-sister { grid-template-columns: 1fr auto; } .fs-sister .fs-sister-label { grid-column: 1 / -1; justify-self: start; } }
/* Affiliated-firm card: larger (2026-09-17, Mikhail's request) */
.site-footer .fs-sister { margin-top: 1.1rem; padding: 1.6rem 2rem; gap: .5rem 1.75rem; }
.site-footer .fs-sister .fs-name { font-size: 1.45rem; }
.site-footer .fs-sister .fs-desc { font-size: .95rem; }
.site-footer .fs-sister .fs-sister-label { font-size: max(.72rem, 12px); padding: .55rem .85rem; }
.site-footer .fs-sister .fl-badge svg { width: 62px; height: 62px; }
.site-footer .fs-sister .fl-badge > span { font-size: .82rem; }
@media (max-width: 640px) { .site-footer .fs-sister { padding: 1.3rem 1.2rem; } .site-footer .fs-sister .fs-name { font-size: 1.25rem; } .site-footer .fs-sister .fl-badge svg { width: 50px; height: 50px; } }

/* ---------- Search page (2026-09-17): one search box, clearer results ---------- */
body.is-search-page .topbar .site-search { display: none; }
.search-page-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .6rem; max-width: 640px; }
.search-page-form label { flex: 1 1 100%; font-size: .86rem; font-weight: 600; }
.search-page-form input { flex: 1 1 260px; min-height: 48px; padding: .7rem .9rem; border: 1px solid var(--line-2); background: var(--white); font: inherit; border-radius: var(--radius); }
.search-page-results { list-style: none; margin: 1.5rem 0 0; padding: 0; max-width: 820px; }
.all-pages { max-width: 820px; margin-top: 2.5rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.all-pages summary { cursor: pointer; font-weight: 600; font-size: .95rem; color: var(--gold-text); }
.all-pages[open] summary { margin-bottom: 1rem; }

/* ---------- Practice pages: visible structure instead of a wall of text (2026-09-17) ---------- */
.on-page { background: var(--white); border-bottom: 1px solid var(--line); }
.on-page .wrap { display: flex; flex-wrap: wrap; align-items: baseline; gap: .5rem 1rem; padding: .85rem 0; }
.op-label { margin: 0; font-size: max(.68rem, 12px); font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.on-page ul { list-style: none; display: flex; flex-wrap: wrap; gap: .45rem; margin: 0; padding: 0; }
.on-page a { display: inline-block; padding: .3rem .7rem; border: 1px solid var(--line-2); border-radius: 999px; font-size: .84rem; text-decoration: none; color: var(--text-soft); background: var(--cream); }
.on-page a:hover, .on-page a:focus-visible { border-color: var(--gold); color: var(--gold-text); }

/* Section headings get a gold marker so sections are easy to scan */
.practice-prose h2 { display: flex; align-items: baseline; gap: .6rem; }
.practice-prose h2::before { content: ""; flex: none; width: 10px; height: 10px; margin-top: .45em; background: var(--gold-grad); transform: rotate(45deg); }
.practice-prose h3 { color: var(--text); }

/* Numbered lists become steps */
.practice-prose ol.steps { list-style: none; counter-reset: step; padding: 0; margin: 1.25rem 0 1.75rem; display: grid; gap: .75rem; }
.practice-prose ol.steps > li { counter-increment: step; position: relative; margin: 0; padding: 1rem 1.15rem 1rem 3.4rem; background: var(--white); border: 1px solid var(--line); }
.practice-prose ol.steps > li::before { content: counter(step); position: absolute; left: 1rem; top: .95rem; display: grid; place-items: center; width: 1.85rem; height: 1.85rem; border-radius: 50%; background: var(--gold-grad); color: #1a1508; font-family: var(--sans); font-weight: 700; font-size: .95rem; }

/* "What to bring" style lists get check marks */
.practice-prose ul.checklist { list-style: none; padding: 0; display: grid; gap: .45rem; }
.practice-prose ul.checklist > li { position: relative; padding-left: 1.9rem; }
.practice-prose ul.checklist > li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--gold-text); font-weight: 700; }

/* One photo inside the article */
.prose-photo { margin: 2rem 0; }
.prose-photo img { width: 100%; height: auto; aspect-ratio: 16 / 7; object-fit: cover; border: 1px solid var(--line); }

/* Cards for the practice's own pages */
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.service-card { display: flex; flex-direction: column; gap: .5rem; padding: 1.35rem 1.4rem; background: var(--white); border: 1px solid var(--line); text-decoration: none; color: inherit; transition: border-color .2s, box-shadow .2s, transform .2s; }
.service-card:hover { border-color: var(--gold); box-shadow: var(--shadow); transform: translateY(-2px); }
.service-card .icon { width: 1.9rem; height: 1.9rem; color: var(--gold-text); }
.sc-title { font-family: var(--serif); font-size: 1.15rem; font-weight: 600; }
.sc-desc { font-size: .88rem; color: var(--text-soft); line-height: 1.55; flex: 1; }
.service-card .link-arrow { font-size: .82rem; }
@media (max-width: 980px) { .service-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .service-grid { grid-template-columns: 1fr; } .prose-photo img { aspect-ratio: 4 / 3; } .on-page .wrap { padding: .7rem 0; } }

/* ---------- Case spotlight: rotates through practice areas (2026-09-17) ---------- */
.spotlight { padding-bottom: 3.25rem; }
.spot-slide { position: relative; }
.spot-slide .spot-photo { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; }
.spot-slide .wrap { min-height: clamp(400px, 40vw, 500px); }
@media (max-width: 980px) { .spot-slide .spot-photo { position: relative; width: 100%; } .spot-slide .wrap { min-height: 0; } }
.spot-slide[hidden] { display: none; }
.spot-title { font-family: "Playfair Display", var(--serif); color: var(--white); font-size: clamp(2.2rem, 4.2vw, 3.4rem); line-height: 1.08; margin: 0 0 1.1rem; }
.spot-title em { font-style: italic; color: var(--gold-light); }
.spot-quote { margin: 0 0 .8rem; padding: 0; border: 0; font-family: var(--serif); font-size: clamp(1.15rem, 1.7vw, 1.45rem); line-height: 1.55; color: var(--white); }
.spot-cite { margin: 0 0 1.5rem; font-size: .88rem; color: var(--muted-dark); }
.spotlight .spot-nav.wrap { min-height: 0; padding: 0; }
.spot-nav { position: absolute; left: 0; right: 0; bottom: 1.1rem; display: flex; align-items: center; gap: .75rem; z-index: 2; }
.spot-btn { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line-dark); background: rgba(22, 26, 28, .6); color: var(--on-dark); cursor: pointer; }
.spot-btn:hover { border-color: var(--gold); color: var(--gold-light); }
.spot-dots { list-style: none; display: flex; gap: .5rem; margin: 0; padding: 0; }
.spot-dots button { width: 10px; height: 10px; padding: 0; border-radius: 50%; border: 1px solid var(--muted-dark); background: transparent; cursor: pointer; }
.spot-dots button[aria-current="true"] { background: var(--gold-grad); border-color: var(--gold); }
@media (max-width: 980px) { .spotlight { padding-bottom: 3.5rem; } .spot-nav { bottom: 1rem; justify-content: center; } }

/* ---------- Translated pages: the firm name is translated too, so the lockup must adapt (2026-09-17) ---------- */
html[class*="translated-"] .site-header .wrap { gap: .9rem; }
html[class*="translated-"] .brand { gap: .7rem; }
html[class*="translated-"] .brand-text { max-width: 17ch; min-width: 0; }
html[class*="translated-"] .brand-name { font-size: clamp(.95rem, 1.25vw, 1.2rem); line-height: 1.16; letter-spacing: .02em; white-space: normal; }
html[class*="translated-"] .brand-sub { font-size: max(.56rem, 10px); letter-spacing: .1em; margin-right: 0; white-space: normal; }
html[class*="translated-"] .brand img { width: 62px; height: 62px; }
html[class*="translated-"] .site-footer .brand-text { max-width: 22ch; }
@media (max-width: 1180px) { html[class*="translated-"] .brand-text { max-width: 14ch; } }
@media (max-width: 980px) { html[class*="translated-"] .brand-text { max-width: 20ch; } html[class*="translated-"] .brand-name { font-size: 1.05rem; } }
@media (max-width: 640px) {
  html[class*="translated-"] .brand-text { max-width: 15ch; }
  html[class*="translated-"] .brand-name { font-size: .92rem; }
  html[class*="translated-"] .brand img { width: 44px; height: 44px; }
  html[class*="translated-"] .tb-addr { display: none; }
}

/* Second heading at the top of each practice page's content (2026-09-17) */
.prose .page-subtitle, .practice-prose .page-subtitle { font-family: "Playfair Display", var(--serif); font-size: clamp(1.5rem, 2.3vw, 2.05rem); font-weight: 600; line-height: 1.25; color: var(--text); max-width: 34ch; margin: 0 0 1.6rem; padding-bottom: 1.15rem; border-bottom: 1px solid var(--line); }
@media (max-width: 640px) { .prose .page-subtitle, .practice-prose .page-subtitle { font-size: 1.32rem; margin-bottom: 1.25rem; } }

/* ---------- Homepage "Our practice areas" intro: styled practice ribbon, no dead space (2026-09-17) ---------- */
.sec-practices { padding-top: clamp(44px, 5vw, 64px); }
.practice-intro { margin-bottom: clamp(1.6rem, 3vw, 2.2rem); }
.pi-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem 1.25rem; }
.pi-head .eyebrow { margin: 0; }
.pi-head h2 { margin: 0; }
.pi-ribbon { list-style: none; margin: 1.1rem 0 1.2rem; padding: 1rem 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.pi-ribbon li { display: inline-flex; align-items: baseline; margin: 0; font-family: "Playfair Display", var(--serif); font-size: clamp(1.3rem, 2.3vw, 2rem); font-weight: 600; line-height: 1.25; }
.pi-ribbon li:not(:last-child)::after { content: "◆"; font-size: .45em; color: var(--gold); margin: 0 .75em; transform: translateY(-.35em); display: inline-block; }
.pi-ribbon a { color: var(--text); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; text-decoration-color: transparent; transition: text-decoration-color .25s, color .2s; }
.pi-ribbon li.alt a { color: var(--gold-text); font-style: italic; font-weight: 500; }
.pi-ribbon a:hover, .pi-ribbon a:focus-visible { text-decoration-color: var(--gold); color: var(--ink); }
.pi-text { margin: 0; max-width: 70ch; font-family: var(--serif); font-size: 1.08rem; line-height: 1.65; color: var(--text-soft); }
@media (max-width: 640px) { .pi-ribbon li { font-size: 1.2rem; } .pi-ribbon li:not(:last-child)::after { margin: 0 .5em; } }

/* ---------- Plaque logo (trial, 2026-09-17) ---------- */
.brand-plaque { display: block; line-height: 0; flex: none; }
.brand-plaque img { height: 86px; width: auto; max-width: none; }
.site-footer .brand-plaque img { height: 72px; }
@media (max-width: 1360px) { .site-header .brand-plaque img { height: 74px; } }
@media (max-width: 1180px) { .site-header .brand-plaque img { height: 64px; } }
@media (max-width: 640px) { .site-header .brand-plaque img { height: 56px; } .site-footer .brand-plaque img { height: 60px; } }
@media (max-width: 380px) { .site-header .brand-plaque img { height: 48px; } }
/* Logo sizing (2026-09-18): larger in the header, and the footer copy is not squeezed by the old crest rules */
.site-header .brand.brand-plaque img { height: 94px; width: auto; }
.site-footer .brand.brand-plaque img { height: 88px; width: auto; max-width: 100%; }
@media (max-width: 1360px) { .site-header .brand.brand-plaque img { height: 78px; } }
@media (max-width: 1180px) { .site-header .brand.brand-plaque img { height: 66px; } }
@media (max-width: 640px) { .site-header .brand.brand-plaque img { height: 58px; } .site-footer .brand.brand-plaque img { height: 76px; } }
@media (max-width: 380px) { .site-header .brand.brand-plaque img { height: 50px; } }

/* ---------- Case spotlight: one fixed height, photo to the bottom edge, cross-fade (2026-09-18) ---------- */
.spotlight { padding-bottom: 0; }
.spot-stage { display: grid; }
.spot-stage > .spot-slide { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity 1.1s ease, visibility 0s linear 1.1s; }
.spot-stage > .spot-slide.is-current { opacity: 1; visibility: visible; transition: opacity 1.1s ease, visibility 0s; z-index: 1; }
.spot-slide .wrap { height: 100%; }
.spot-slide .spot-copy { padding-bottom: calc(clamp(56px, 7vw, 88px) + 2.5rem); }
.spot-slide .spot-photo img { transform: scale(1.06); transition: transform 9.5s ease-out; }
.spot-slide.is-current .spot-photo img { transform: scale(1); }
.spot-slide .spot-copy > * { transition: transform 1.1s ease; transform: translateY(10px); }
.spot-slide.is-current .spot-copy > * { transform: none; }
.spotlight .spot-nav.wrap { position: absolute; bottom: 1.6rem; }
@media (max-width: 980px) {
  .spot-slide { display: flex; flex-direction: column; }
  .spot-slide .wrap { height: auto; flex: 1; align-items: flex-start; }
  .spot-slide .spot-copy { padding-bottom: 4.5rem; }
  .spotlight .spot-nav.wrap { bottom: 1.25rem; }
}
@media (prefers-reduced-motion: reduce) {
  .spot-stage > .spot-slide, .spot-stage > .spot-slide.is-current, .spot-slide .spot-photo img, .spot-slide .spot-copy > * { transition: none; transform: none; }
}

/* Phone header logo: crest + two-line name, no motto (2026-09-23). The image is shorter and wider
   than the desktop lockup, so it needs its own height to keep the name the same size on screen. */
/* The phone mark is one line (crest + name, no motto), so it is sized by WIDTH: that keeps the
   letters as large as the header allows instead of shrinking them to fit a fixed height. */
@media (max-width: 640px) {
  .site-header .brand.brand-plaque img { height: auto; width: min(268px, 66vw); max-width: none; }
  .site-footer .brand.brand-plaque img { height: auto; width: min(320px, 82vw); }
}
@media (max-width: 380px) {
  .site-header .brand.brand-plaque img { width: min(232px, 66vw); }
}

/* ============================================================================
   Phone polish (2026-09-25, Mikhail: "improve what the mobile site looks like",
   "the logo especially — bigger and bolder but still aesthetically pleasing").
   Everything here is phone-only; tablets and desktops are untouched.
   ============================================================================ */
@media (max-width: 640px) {
  /* --- Logo: the phone mark is crest + name, sized by width so the letters stay large --- */
  .site-header .brand.brand-plaque img { height: auto; width: min(292px, 74vw); max-width: none; }
  .site-header .wrap { padding-block: .55rem; }
  .site-footer .brand.brand-plaque img { height: auto; width: min(320px, 82vw); }

  /* --- Trust strip: even two-up cells instead of a ragged grid --- */
  .trust-strip li { min-height: 92px; padding: .95rem .6rem; font-size: .76rem; line-height: 1.35; text-wrap: balance; }
  .trust-strip svg { width: 19px; height: 19px; }

  /* --- Practice-page trust line: one item per row, nothing squeezed into columns --- */
  .trust-line ul { display: grid; grid-template-columns: 1fr; gap: 0; padding: .35rem 0; font-size: .82rem; }
  .trust-line li { padding: .6rem 0; border-top: 1px solid var(--line); }
  .trust-line li:first-child { border-top: 0; }
  .trust-line li:nth-child(3) { display: flex; }

  /* --- Section rhythm: less air between blocks so pages are shorter to thumb through --- */
  .sec { padding: 52px 0; }
  .sec-head { margin-bottom: 1.4rem; }
  .spotlight .spot-copy { padding-bottom: 4rem; }

  /* --- Attorney cards: photo beside the text, so three attorneys fit in a glance --- */
  .team-grid .person { flex-direction: row; align-items: stretch; }
  .team-grid .person .photo { flex: none; width: 38%; aspect-ratio: auto; }
  .team-grid .person .meta { padding: .9rem 1rem 1rem; }
  .team-grid .person h3 { font-size: 1.12rem; }
  .team-grid .person p { font-size: .82rem; margin: .45rem 0 .7rem; }

  /* --- Practice cards: punchier. The whole card is a link, so the repeated
         "Practice area" label and "Explore this practice" line are noise on a phone.
         A gold arrow in the corner carries the same meaning in a fraction of the space. --- */
  .practice-card { padding: 1.15rem 1.2rem 1.2rem; position: relative; }
  .practice-card .eyebrow, .practice-card .link-arrow { display: none; }
  .practice-card h3 { font-size: 1.16rem; margin-bottom: .45rem; padding-right: 1.6rem; }
  .practice-card p { font-size: .87rem; margin-bottom: 0; }
  .practice-card::after { content: "92"; position: absolute; top: 1.1rem; right: 1.1rem; color: var(--gold-text); font-size: 1.05rem; line-height: 1; }

  /* --- Never let the last line of a page hide under the fixed call bar --- */
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
  .callbar { padding-bottom: env(safe-area-inset-bottom); }
}
@media (max-width: 380px) {
  .site-header .brand.brand-plaque img { width: min(250px, 74vw); }
  .team-grid .person .photo { width: 42%; }
}

/* ---------- One logo mark everywhere (2026-09-28) ----------
   The header and footer now carry the crest + firm name. The motto is no longer baked into the header
   image, where it rendered at about 4px; it is set as text under the footer logo so it can be read. */
.site-header .brand.brand-plaque img { height: auto; width: 360px; }
.site-footer .brand.brand-plaque img { height: auto; width: 320px; max-width: 100%; }
@media (max-width: 1360px) { .site-header .brand.brand-plaque img { width: 330px; } }
@media (max-width: 1180px) { .site-header .brand.brand-plaque img { width: 296px; } }
@media (max-width: 640px) {
  .site-header .brand.brand-plaque img { width: min(292px, 74vw); }
  .site-footer .brand.brand-plaque img { width: min(300px, 80vw); }
}
@media (max-width: 380px) { .site-header .brand.brand-plaque img { width: min(236px, 68vw); } }
.brand-motto { margin: .85rem 0 0; font-family: var(--serif); font-size: .82rem; letter-spacing: .22em; text-transform: uppercase; color: var(--gold-light); }
.site-footer .about { margin-top: .7rem; }
@media (max-width: 640px) { .brand-motto { font-size: .74rem; letter-spacing: .18em; } }

/* ---------- Full lockup, assembled in the page (2026-09-28) ----------
   Mikhail asked for the whole logo — crest, rule, name and motto. Inside the artwork the motto renders
   at 2-4px, so the crest and name are used as artwork and the motto is set as live text below the name,
   matched to the engraved look with hairline rules. Everything scales and stays crisp. */
.brand-lockup { display: inline-flex; align-items: center; gap: .85rem; text-decoration: none; flex: none; line-height: 0; }
.brand-lockup .bl-crest { height: 72px; width: auto; flex: none; }
.brand-lockup .bl-stack { display: inline-grid; gap: .38rem; padding-left: .85rem; border-left: 1px solid rgba(201, 161, 79, .55); }
.brand-lockup .bl-name { height: auto; width: 300px; max-width: 100%; display: block; }
.brand-lockup .bl-motto { display: flex; align-items: center; gap: .5rem; font-family: var(--serif); font-size: 12px; line-height: 1; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-light); white-space: nowrap; }
.brand-lockup .bl-motto::before, .brand-lockup .bl-motto::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, rgba(201, 161, 79, .6), transparent); }
.site-footer .brand-lockup .bl-crest { height: 76px; }
.site-footer .brand-lockup .bl-name { width: 300px; }
@media (max-width: 1300px) {
  .brand-lockup .bl-crest { height: 64px; }
  .brand-lockup .bl-name { width: 250px; }
  .brand-lockup .bl-motto { letter-spacing: .06em; }
}
@media (max-width: 1180px) {
  /* the nav and the consultation button need the room back at this width */
  .brand-lockup .bl-crest { height: 56px; }
  .brand-lockup .bl-name { width: 212px; }
  .brand-lockup .bl-motto { font-size: 12px; letter-spacing: .01em; }
}
@media (max-width: 860px) {
  .brand-lockup .bl-motto::before, .brand-lockup .bl-motto::after { display: none; }
}
@media (max-width: 640px) {
  .brand-lockup { gap: .6rem; }
  .brand-lockup .bl-crest { height: 50px; }
  .brand-lockup .bl-stack { padding-left: .6rem; gap: .3rem; }
  .brand-lockup .bl-name { width: min(200px, 52vw); }
  /* the motto keeps its 12px floor, so it drops to its own line under the lockup on phones */
  .brand-lockup .bl-motto { font-size: 12px; letter-spacing: .06em; }
  .site-header .brand-lockup .bl-motto { display: none; }
  .site-footer .brand-lockup .bl-crest { height: 58px; }
  .site-footer .brand-lockup .bl-name { width: min(220px, 60vw); }
}

/* ---------- Mikhail's 2026-09-30 logo set (full lockup + compact phone mark) ----------
   The artwork is used as supplied, so these rules only set its size. The full lockup is 4.4:1 and the
   phone mark 4.7:1, so sizing by width keeps both crest and letters as large as the header allows. */
.site-header .brand.brand-plaque img { height: auto; width: 390px; max-width: none; }
.site-footer .brand.brand-plaque img { height: auto; width: 340px; max-width: 100%; }
@media (max-width: 1300px) { .site-header .brand.brand-plaque img { width: 340px; } }
@media (max-width: 1180px) { .site-header .brand.brand-plaque img { width: 290px; } }
@media (max-width: 640px) {
  .site-header .brand.brand-plaque img { width: min(292px, 74vw); }
  .site-footer .brand.brand-plaque img { width: min(300px, 80vw); }
}
@media (max-width: 380px) { .site-header .brand.brand-plaque img { width: min(236px, 68vw); } }

/* ---------- Phone tagline (2026-10-01) ----------
   The compact phone artwork carries no motto, and the full lockup's motto would render near 5px at
   phone width. So on phones the tagline is set as text under the mark, matched to the engraved look. */
.brand-tag { display: none; }
@media (max-width: 640px) {
  .brand.brand-plaque { display: inline-grid; justify-items: start; gap: .3rem; line-height: 0; }
  .brand-tag { display: block; font-family: var(--serif); font-size: 12px; line-height: 1; letter-spacing: .09em;
    text-transform: uppercase; color: var(--gold-light); white-space: nowrap; }
  .site-footer .brand-tag { letter-spacing: .12em; }
}
@media (max-width: 380px) { .brand-tag { font-size: 12px; letter-spacing: 0; } }

/* ---------- Navigation set in the serif (2026-10-02) ----------
   Mikhail: "make fonts nice, closer to the ones used in the drop-down menu titles". Those titles are
   Source Serif 4, so the nav links, the menu links and the buttons now use it too and the header reads
   as one family. Small uppercase labels stay in the sans, where they are crisper at that size. */
.main-nav a, .main-nav button.nav-top { font-family: var(--serif); font-size: .96rem; font-weight: 500; letter-spacing: .005em; }
.mega li a { font-family: var(--serif); font-size: .92rem; letter-spacing: .005em; }
.mega h3 { letter-spacing: -.005em; }
.btn { font-family: var(--serif); font-weight: 600; font-size: .95rem; letter-spacing: .005em; }
.link-arrow { font-family: var(--serif); font-weight: 600; letter-spacing: .005em; }
.site-footer h3 { letter-spacing: -.005em; }
.site-footer .top ul a { font-family: var(--serif); font-size: .94rem; }
/* the serif runs a little wider than the sans, so the nav gives room back before the button is pushed off */
@media (max-width: 1240px) { .main-nav a, .main-nav button.nav-top { font-size: .9rem; padding-inline: .5rem; } }
@media (max-width: 1080px) { .main-nav a, .main-nav button.nav-top { font-size: .86rem; padding-inline: .42rem; } .btn { font-size: .9rem; } }