/* The homepage. Three layout modes, read off the ruler: desktop (1200 and up), tablet (810 to 1199) and
   phone (809 and down), plus the override breakpoints the injected sections carry. Class names are ours. */

body.page--home { background: #f7f3ea; }
.page--home main { overflow-x: clip; }
.page--home main > section { width: 100%; box-sizing: border-box; }

/* ---------------------------------------------------------------- buttons (the template's three) */
.btn { display: flex; position: relative; justify-content: center; align-items: center; border-radius: 2px; overflow: hidden; color: #0d1626; cursor: pointer; flex: 0 0 auto; width: fit-content; }
.btn--gold { background: #b8963e; }
.btn--white { background: #fff; }
.btn__in { display: flex; position: relative; justify-content: center; align-items: center; gap: 10px; padding: 16px 32px; }
.btn__t { display: flex; justify-content: center; align-items: center; height: 20px; }
.btn__tt { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 19.2px; letter-spacing: 0.64px; text-transform: uppercase; white-space: pre; color: #0d1626; }
.btn__arrow { display: none; width: 16px; height: 16px; flex: 0 0 auto; background: #0d1626; -webkit-mask: var(--arrow) 50% 50% / auto no-repeat; mask: var(--arrow) 50% 50% / auto no-repeat; }
.btn-secondary { display: inline-flex; box-sizing: border-box; align-items: center; justify-content: center; margin: 14px 0 0; padding: 16px 32px; font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; letter-spacing: 0.64px; text-transform: uppercase; white-space: nowrap; color: #fff; background: #152c58; border: 1px solid #152c58; border-radius: 2px; cursor: pointer; transition: filter 0.15s; }
.btn-secondary:hover { filter: brightness(1.35); }
:root {
  --arrow: url("data:image/svg+xml,<svg display='block' role='presentation' viewBox='0 0 19 19' xmlns='http://www.w3.org/2000/svg'><path d='M 0 0 L 16 0' fill='transparent' stroke-linecap='round' stroke-linejoin='miter' stroke-miterlimit='10' stroke-width='1' stroke='white' transform='translate(2 9.63)'/><path d='M 0 6 C 0.167 4 1.6 0 6 0' fill='transparent' stroke-linecap='round' stroke-linejoin='miter' stroke-miterlimit='10' stroke-width='1' stroke='white' transform='translate(12 9.63)'/><path d='M 6 6 C 4 5.833 0 4.4 0 0' fill='transparent' stroke-linecap='round' stroke-linejoin='miter' stroke-miterlimit='10' stroke-width='1' stroke='white' transform='translate(12 3.63)'/></svg>");
}

/* ---------------------------------------------------------------- section heading row */
.sechead { display: flex; gap: 128px; justify-content: flex-start; align-items: flex-start; width: 100%; }
.sechead__eyebrow { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; flex: 1 0 0; min-width: 0; padding: 4px 0 0; }
.sechead__eyebrow > div { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 14px; line-height: 16.8px; letter-spacing: 0.42px; text-transform: uppercase; color: #0d1626; }
.sechead__h { display: flex; flex-direction: column; flex: 4 0 0; min-width: 0; word-break: break-word; }
.sechead__h h2 { font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-weight: 400; font-size: 48px; line-height: 52.8px; letter-spacing: -1.92px; text-align: start; color: #0d1626; }

/* ---------------------------------------------------------------- hero */
/* The ruler's "Background" is ONE layer holding the photograph, the text block, the blur and the shade, so the
   entrance (fade and 1.05 zoom) and the half-speed scroll drift move them together. .hero__bg is that layer. */
.hero { position: relative; height: 100vh; overflow: clip; }
.hero__bg { position: absolute; inset: 0; padding: 160px 48px 64px; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; box-sizing: border-box; }
.hero__photo { position: absolute; inset: 0; }
.hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hero__blur, .hero__shade { position: absolute; inset: 0; z-index: 1; overflow: clip; }
.hero__blur { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 70%, rgb(0, 0, 0) 90%); mask-image: linear-gradient(rgba(0, 0, 0, 0) 70%, rgb(0, 0, 0) 90%); }
.hero__shade { background-image: linear-gradient(rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0.15) 55%, rgba(0, 0, 0, 0.6) 75%, rgba(0, 0, 0, 0.8) 100%); }
.hero__inner { position: relative; z-index: 2; display: flex; align-items: flex-end; justify-content: center; gap: 64px; width: 100%; max-width: 1000px; }
.hero__text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 12px; flex: 2 0 0; min-width: 0; }
.hero__h1 { font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-weight: 400; font-size: 64px; line-height: 64px; letter-spacing: -2.56px; text-align: start; color: #fff; text-wrap: balance; }
.hero__side { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; flex: 1 0 0; min-width: 0; }
.hero__h1 .w { display: inline-block; }
.hero__sub { max-width: 500px; font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 22.4px; text-align: start; color: #fff; text-wrap: balance; }
.hero__ctas { display: flex; flex-direction: column; align-items: flex-start; }

/* ---------------------------------------------------------------- about (the 2026-09 redesign) */
.about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(96px, 1fr) auto auto auto minmax(96px, 1fr); align-items: start; place-content: stretch; gap: 0; padding: 0; min-height: min(62.5vw, 1000px); background: #152c58; position: relative; overflow: clip; }
.about__img { position: relative; grid-column: 1; grid-row: 1 / -1; align-self: stretch; overflow: clip; width: 100%; margin: 0; }
.about__img > img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 12%; }
.about__badge { position: absolute; inset-inline-end: 16px; bottom: 16px; z-index: 2; box-sizing: border-box; width: 234px; max-width: calc(100% - 32px); padding: 16px; display: flex; flex-direction: column; gap: 10px; background: rgba(252, 250, 245, 0.9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-radius: 4px; pointer-events: none; }
.about__cred { display: flex; align-items: center; gap: 10px; padding-inline-start: 2px; }
.about__mark { flex: none; width: 10px; height: 1px; background: #0d1626; }
.about__cred-t { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 12px; line-height: 14.4px; letter-spacing: 0.03em; text-transform: uppercase; color: #0d1626; }
.about__title, .about__body, .about__more { margin-inline: 96px 48px; max-width: 420px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 0; position: relative; }
.about__title { grid-column: 2; grid-row: 2; padding: 4px 0 0; }
.about__body { grid-column: 2; grid-row: 3; margin-top: 24px; }
.about__more { grid-column: 2; grid-row: 4; }
.about__title h2 { font-family: "Gilda Display", "Gilda Display Placeholder", Georgia, serif; font-weight: 400; font-size: 64px; line-height: 1; letter-spacing: -0.04em; color: #fff; text-wrap: balance; width: 100%; }
.about__body, .about__lead { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 1.4; color: rgba(255, 255, 255, 0.86); }
.about__body p, .about__lead p { width: 100%; }
.about__lead { margin-top: 20px; width: 100%; }
.about__lead p { text-wrap: balance; }
.about__stats { margin-top: 40px; display: flex; flex-wrap: wrap; gap: 24px 48px; justify-content: center; width: auto; }
.stat { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.stat__num { display: flex; gap: 4px; align-items: flex-start; color: #fff; }
.stat__n { font-size: 48px; line-height: 48px; height: 49px; }
.stat__n span { display: inline-block; font-family: "Gilda Display", "Gilda Display Placeholder", serif; }
.stat__plus { display: flex; flex-direction: column; font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-size: 48px; line-height: 48px; letter-spacing: -0.04em; text-align: right; color: #fff; }
.stat__l { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 1.35; letter-spacing: -0.01em; color: rgba(255, 255, 255, 0.82); text-wrap: balance; }
.about__cta { margin-top: 40px; display: flex; justify-content: flex-start; align-items: flex-end; }

/* ---------------------------------------------------------------- practice areas and blog cards */
.pa { position: relative; z-index: 1; padding: 180px 48px 0; background: #f7f3ea; display: flex; flex-direction: column; align-items: center; }
.pa__in { width: 100%; max-width: 1400px; display: flex; flex-direction: column; gap: 64px; }
.pa__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, 320px); gap: 24px; }
.pa__cell { display: flex; align-self: start; min-width: 0; }
.pa__cell:first-child { grid-column: 1 / -1; }
.card { position: relative; display: flex; flex: 1 0 0; min-width: 0; min-height: 320px; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 24px; box-sizing: border-box; padding: 48px 32px; background: #0d16261a; border-radius: 4px; overflow: clip; cursor: pointer; }
.card--blog { min-height: 480px; }
.card__bg { position: absolute; inset: 0; z-index: 0; }
.card__bg > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.card__blur, .card__shade { position: absolute; inset: 0; }
.card__blur { -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.card__shade { background: rgba(0, 0, 0, 0.5); }
.card__shade--tr { background: rgba(0, 0, 0, 0.3); }
/* The ruler's Blur and Darken Bottom layers fade in from the bottom of each photograph; the blog cards use a
   shorter ramp, and their Darken Top Right layer is a corner wedge at 233deg. */
.card__blur, .card__shade { -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 50%, rgb(0, 0, 0) 90%); mask-image: linear-gradient(rgba(0, 0, 0, 0) 50%, rgb(0, 0, 0) 90%); }
.card--blog .card__blur { -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 50%, rgb(0, 0, 0) 75%); mask-image: linear-gradient(rgba(0, 0, 0, 0) 50%, rgb(0, 0, 0) 75%); }
.card--blog .card__shade { -webkit-mask-image: linear-gradient(rgba(0, 0, 0, 0) 20%, rgb(0, 0, 0) 70%); mask-image: linear-gradient(rgba(0, 0, 0, 0) 20%, rgb(0, 0, 0) 70%); }
.card--blog .card__shade--tr { -webkit-mask-image: linear-gradient(233deg, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 30%); mask-image: linear-gradient(233deg, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 30%); }
.card__badge { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 1; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 4px; padding: 16px 56px 16px 16px; }
.card__title { font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-weight: 400; font-size: 36px; line-height: 41.4px; letter-spacing: -1.44px; color: #fff; overflow: clip; white-space: pre-wrap; word-break: break-word; }
.card--blog .card__title { font-size: 27.2px; line-height: 32.64px; letter-spacing: -1.088px; }
.card__go { position: absolute; z-index: 1; right: 8px; bottom: 14px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 100px; }
.card__go i { display: block; width: 22px; height: 18.1px; background: #fff; -webkit-mask: var(--arrow) 50% 50% / auto no-repeat; mask: var(--arrow) 50% 50% / auto no-repeat; }
.card__tag { position: absolute; z-index: 1; top: 16px; right: 16px; }
.card__tag > div { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 14px; line-height: 16.8px; letter-spacing: 0.42px; text-transform: uppercase; color: #fff; white-space: pre; }

/* ---------------------------------------------------------------- attorneys */
.att { padding: 180px 48px; background: #152c58; overflow: clip; display: flex; flex-direction: column; align-items: center; }
.att__in { width: 100%; max-width: 1400px; display: flex; flex-direction: column; gap: 64px; align-items: center; }
.sechead--light .sechead__eyebrow > div, .sechead--light .sechead__h h2 { color: #fff; }
.att__list { display: flex; flex-direction: column; gap: 64px; align-items: stretch; width: 100%; }
.pwrap { display: flex; flex-direction: column; gap: 64px; align-items: stretch; }
.person__rule { height: 1px; background: rgba(255, 255, 255, 0.1); }
.person { display: flex; justify-content: center; align-items: center; gap: 48px; overflow: clip; }
.person__photo { position: relative; flex: 1 0 0; min-width: 0; aspect-ratio: 1 / 1; border-radius: 4px; }
.person__photo > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 4px; }
.person__main { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; align-self: stretch; flex: 1 0 0; min-width: 0; overflow: clip; }
.person__who { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; overflow: clip; width: 100%; }
.person__name { font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-weight: 400; font-size: 27.2px; line-height: 32.64px; letter-spacing: -1.088px; color: #fff; white-space: pre; }
.person__bio { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 22.4px; color: #fff; }
.person__creds { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; overflow: clip; width: 100%; }
.cred { display: flex; justify-content: center; align-items: center; gap: 10px; padding: 0 0 0 2px; width: 100%; box-sizing: border-box; }
.cred > div { display: flex; flex-direction: column; flex: 1 0 0; min-width: 0; overflow: clip; font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 20px; line-height: 24px; letter-spacing: -0.2px; color: rgba(255, 255, 255, 0.62); white-space: pre-wrap; word-break: break-word; }
.cred:has(> div:empty) { display: none; }
.person__side { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; align-self: stretch; flex: 1 0 0; min-width: 0; overflow: clip; }
.person__tags { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; gap: 8px; width: 100%; }
.person__tags--ghost { visibility: hidden; }
.tag { display: flex; max-width: 100%; align-items: center; justify-content: flex-start; padding: 4px 8px; gap: 10px; background: rgba(13, 22, 38, 0.1); border-radius: 100px; }
.tag__t { max-width: 100%; font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 14px; line-height: 16.8px; letter-spacing: 0.42px; text-transform: uppercase; color: #fff; }

/* ---------------------------------------------------------------- blog */
.blog { padding: 180px 48px; background: #f7f3ea; display: flex; flex-direction: column; align-items: center; }
.blog__in { width: 100%; max-width: 1400px; display: flex; flex-direction: column; gap: 64px; align-items: center; }
.blog__upper { display: flex; gap: 128px; align-items: flex-start; width: 100%; }
.blog__text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; flex: 4 0 0; min-width: 0; overflow: clip; }
.blog__row { display: flex; justify-content: space-between; align-items: flex-end; width: 100%; }
.blog__sub { max-width: 500px; flex: 1 0 0; font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 22.4px; color: #0d1626; word-break: break-word; }
.blog__all { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; padding: 0 0 0 48px; overflow: clip; gap: 10px; }
.blog__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; width: 100%; }
.blog__cell { display: flex; align-self: start; min-width: 0; }

/* ---------------------------------------------------------------- the four steps */
.steps { padding: 0 0 180px; background: #f7f3ea; }
.steps__in { display: flex; gap: 96px; justify-content: center; align-items: flex-start; counter-reset: nlfstep; }
.steps__img { position: sticky; top: 0; z-index: 1; flex: 2 0 0; min-width: 0; height: 900px; }
.steps__img > img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; }
.steps__col { display: flex; justify-content: flex-start; align-items: center; flex: 1 0 0; min-width: 0; max-width: 100%; box-sizing: border-box; padding: 140px 48px 92px 0; }
.steps__box { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 24px; max-width: 500px; flex: 1 0 0; min-width: 0; }
.steps__h h2 { font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-weight: 400; font-size: 48px; line-height: 52.8px; letter-spacing: -1.92px; text-align: start; color: #0d1626; white-space: pre-wrap; word-break: break-word; }
.steps__list { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 10px; }
.step { counter-increment: nlfstep; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; box-sizing: border-box; max-width: 420px; padding: 36px 0 48px; }
.step__n { position: relative; height: 64px; width: 100%; font-family: "Gilda Display", "Gilda Display Placeholder", serif; font-size: 64px; line-height: 64px; letter-spacing: -2.56px; color: rgba(13, 22, 38, 0.1); }
.step__n::after { content: counter(nlfstep, decimal-leading-zero); position: absolute; inset: 0; white-space: nowrap; }
.step__txt { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.step__t { font-family: Switzer, "Switzer Placeholder", sans-serif; font-weight: 400; font-size: 20px; line-height: 24px; letter-spacing: -0.2px; text-align: start; color: #0d1626; text-wrap: balance; }
.step__b { font-family: Switzer, "Switzer Placeholder", sans-serif; font-size: 16px; line-height: 22.4px; text-align: start; color: #0d1626; text-wrap: balance; }
.step__b a { text-decoration: underline; cursor: pointer; }

#nlf-zh-place, #nlf-zh-fed { font-family: Switzer, "Switzer Placeholder", sans-serif; }
/* ---------------------------------------------------------------- per script (the ruler's own rules) */
:root[dir="rtl"] :is(.hero__h1, .hero__sub, .sechead__h h2, .person__name, .person__bio p, .blog__sub p, .blog .card__title, .steps__h h2, .step__t, .step__b, .step__n) { text-align: right; }
:root:not([lang="en"]):not([lang="es"]) .about__title h2 { letter-spacing: 0.03em; }
:root:is([lang="hi"], [lang="pa"]) .about__title h2 { line-height: 1.42; }
:root[lang="zh-Hans"] .about__title h2 { line-height: 1.3; }
:root[dir="rtl"] .about__title h2 { font-family: "Noto Naskh Arabic", "Gilda Display", Georgia, serif; line-height: 1.55; }
:root:is([lang="hi"], [lang="pa"]) .about__body, :root:is([lang="hi"], [lang="pa"]) .about__lead { line-height: 1.75; }
:root[lang="zh-Hans"] .about__body, :root[lang="zh-Hans"] .about__lead { line-height: 1.8; }
:root[dir="rtl"] .about__body, :root[dir="rtl"] .about__lead { line-height: 1.9; }
:root[dir="rtl"] .about__body, :root[dir="rtl"] .about__lead, :root[dir="rtl"] .about__body *, :root[dir="rtl"] .about__lead * { font-family: "Vazirmatn", "Switzer", ui-sans-serif, system-ui, sans-serif; }
:root:is([lang="hi"], [lang="pa"]) .stat__l { line-height: 1.6; }
:root:is([lang="hi"], [lang="pa"]) #nlf-expect .nlf-ex-t { line-height: 1.42; }
:root[dir="rtl"] .person__bio { line-height: 1.9; }
:root:is([lang="hi"], [lang="pa"]) .person__bio { line-height: 1.75; }
:root[lang="zh-Hans"] .person__bio { line-height: 1.8; }

/* ================================================================ TABLET: 810 to 1199 */
@media (max-width: 1199.98px) {
  .hero__bg { padding: 160px 48px 48px; }
  .hero__inner { gap: 48px; }
  .hero__h1 { font-size: 52px; line-height: 52px; letter-spacing: -2.08px; }
  .about__title, .about__body, .about__more { margin-inline: 56px 40px; max-width: 416px; }
  .about__title h2 { font-size: 52px; }
  .pa { padding-top: 120px; }
  .sechead__h h2 { font-size: 40px; line-height: 44px; letter-spacing: -1.6px; }
  .pa__in, .blog__in { gap: 64px; }
  .card__title { font-size: 32px; line-height: 36.8px; letter-spacing: -1.28px; }
  .card--blog .card__title { font-size: 24.8px; line-height: 29.76px; letter-spacing: -0.992px; }
  .att { padding: 120px 48px; }
  .att__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 128px 64px; }
  .pwrap { gap: 0; align-self: start; align-items: center; }
  .person__rule { display: none; }
  .person { flex-direction: column; gap: 0; align-items: center; overflow: visible; width: 100%; }
  .person__photo { flex: 0 0 auto; width: 100%; }
  .person__main { flex: 0 0 auto; align-self: auto; width: 100%; padding-top: 24px; gap: 24px; justify-content: flex-start; overflow: visible; }
  .person__who { gap: 4px; }
  .person__bio { display: flow-root; max-height: 3lh; overflow: clip; }
  .person__name { font-size: 24.8px; line-height: 29.76px; letter-spacing: -0.992px; }
  .person__creds { gap: 4px; }
  .cred > div { font-size: 16px; line-height: 22.4px; letter-spacing: 0; }
  .cred:has(> div:empty) { display: flex; }
  .person__side { flex: 0 0 auto; align-self: auto; width: 100%; padding-top: 24px; gap: 24px; align-items: flex-start; justify-content: flex-start; overflow: visible; }
  .person__tags { min-height: 85px; }
  .blog { padding: 120px 48px; }
  .blog__upper { gap: 64px; }
  .blog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .steps { padding-bottom: 120px; }
  .steps__in { gap: 48px; }
  .steps__img { height: 1000px; }
  .steps__col { padding: 120px 48px 72px 0; }
  .steps__box { gap: 16px; }
  .steps__h h2 { font-size: 40px; line-height: 44px; letter-spacing: -1.6px; }
  .step__n { height: 52px; font-size: 52px; line-height: 52px; letter-spacing: -2.08px; }
}

/* ================================================================ PHONE: 809 and down */
@media (max-width: 809.98px) {
  .btn__in { padding: 12px 16px; }
  .btn__arrow { display: block; }
  .btn-secondary { padding: 12px 16px; }
  .hero { height: 650px; }
  .hero__bg { padding: 160px 24px 32px; }
  .hero__shade { background-image: linear-gradient(rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.15) 45%, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0.7) 100%); }
  .hero__inner { flex-direction: column; align-items: flex-start; justify-content: center; gap: 16px; }
  .hero__text, .hero__side { flex: 0 0 auto; width: 100%; }
  .hero__text { gap: 16px; }
  .hero__h1 .w { display: inline; }
  .hero__h1 { font-size: 40px; line-height: 40px; letter-spacing: -1.6px; }
  .hero__sub { font-size: 14.4px; line-height: 20.16px; }
  .about { display: flex; flex-direction: column; align-items: stretch; padding: 0 0 72px; min-height: 0; }
  .about__img { order: 1; grid-column: auto; grid-row: auto; align-self: auto; aspect-ratio: 4 / 5; height: auto; flex: none; }
  .about__img > img { transform: scale(1.25); transform-origin: 50% 8%; }
  .about__title { order: 2; margin: 48px 24px 0; max-width: none; }
  .about__body { order: 3; margin-inline: 24px; max-width: none; }
  .about__more { order: 4; margin-inline: 24px; max-width: none; }
  .about__title h2 { font-size: 40px; }
  .about__body, .about__lead { font-size: 14.4px; }
  .stat__n, .stat__plus { font-size: 40px; line-height: 40px; }
  .stat__n { height: 40px; }
  .stat__l { font-size: 14.4px; }
  .pa { padding: 80px 24px; }
  .pa__in { gap: 24px; }
  .sechead { flex-direction: column; gap: 12px; }
  .sechead__eyebrow { flex: 0 0 auto; }
  .sechead__h { flex: 0 0 auto; }
  .sechead__h h2 { font-size: 32px; line-height: 35.2px; letter-spacing: -1.28px; }
  .pa__grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-auto-rows: 320px; }
  .card__title, .card--blog .card__title { font-size: 27.2px; line-height: 31.28px; letter-spacing: -1.088px; }
  .card--blog .card__title { max-height: 4lh; }
  .att { padding: 80px 24px; }
  .att__in { gap: 24px; }
  .att__list { display: flex; flex-direction: column; gap: 48px; }
  .pwrap { gap: 48px; align-self: stretch; }
  .person__rule { display: block; }
  .person__name { font-size: 22.4px; line-height: 26.88px; letter-spacing: -0.896px; }
  .person__bio { font-size: 14.4px; line-height: 20.16px; max-height: none; overflow: visible; display: block; }
  .cred > div { font-size: 14.4px; line-height: 20.16px; }
  .person__tags { min-height: 0; }
  .tag__t { font-size: 12px; line-height: 14.4px; letter-spacing: 0.36px; }
  .blog { padding: 80px 24px; }
  .blog__in { gap: 48px; }
  .blog__upper { flex-direction: column; gap: 12px; }
  .blog__text { flex: 0 0 auto; width: 100%; gap: 12px; }
  .blog__row { flex-direction: column; align-items: flex-start; gap: 24px; }
  .blog__sub { flex: 0 0 auto; width: 100%; font-size: 14.4px; line-height: 20.16px; }
  .blog__all { padding: 0; }
  .blog__grid { grid-template-columns: minmax(0, 1fr); }
  .steps { padding: 0 24px 32px; }
  .steps__in { flex-direction: column; gap: 48px; justify-content: center; }
  .steps__img { position: relative; flex: 0 0 auto; width: 100%; height: auto; aspect-ratio: 0.777625 / 1; }
  .steps__col { padding: 0; flex: 0 0 auto; width: 100%; }
  .steps__box { gap: 8px; flex: 0 0 auto; width: 100%; }
  .steps__h h2 { font-size: 32px; line-height: 35.2px; letter-spacing: -1.28px; }
  .step__n { height: 40px; font-size: 40px; line-height: 40px; letter-spacing: -1.6px; }
  .step__t { font-size: 17.6px; line-height: 21.12px; letter-spacing: -0.176px; }
  .step__b { font-size: 14.4px; line-height: 20.16px; }
}
@media (min-width: 1200px) { .cred:has(> div:empty) { display: none; } }

/* ---------------------------------------------------------------- injected: the shared bits */
.nlf-eyebrow { font-family: Switzer, ui-sans-serif, system-ui, sans-serif; font-size: 12px; font-weight: 500; letter-spacing: 1.2px; text-transform: uppercase; color: #7d6320; margin: 0 0 20px; }
.nlf-h2 { font-family: "Gilda Display", Georgia, serif; font-weight: 400; font-size: 48px; line-height: 52.8px; letter-spacing: -1.92px; color: #0d1626; margin: 0 0 28px; }
@media (max-width: 1024px) { .nlf-h2 { font-size: 40px; line-height: 44px; letter-spacing: -1.6px; } }
@media (max-width: 700px) { .nlf-h2 { font-size: 32px; line-height: 36px; letter-spacing: -1.28px; } }
#nlf-reviews { background: #f7f3ea; padding: 180px 48px; width: 100%; box-sizing: border-box; }
@media (max-width: 1024px) { #nlf-reviews { padding: 120px 32px; } }
@media (max-width: 700px) { #nlf-reviews { padding: 80px 20px; } }


/* ---------------------------------------------------------------- what to expect (the ruler's own rules, verbatim) */
#nlf-expect{background:#fcfaf5;padding:180px 48px;width:100%;box-sizing:border-box;
 border-top:1px solid #0d16261a}
#nlf-expect .nlf-ex{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);
 gap:64px;max-width:1344px;margin:0 auto;align-items:stretch}
#nlf-expect .nlf-h2{margin-bottom:0}
#nlf-expect .nlf-ex-rail{display:flex;flex-direction:column;align-items:flex-start}
@media(min-width:1025px){#nlf-expect .nlf-ex-cta{margin-top:auto!important}
}
#nlf-expect .nlf-ex-cta{display:inline-flex;align-items:center;gap:9px;margin-top:36px;
 font-family:Switzer,ui-sans-serif,system-ui,sans-serif;font-size:13px;font-weight:600;
 letter-spacing:.6px;text-transform:uppercase;color:#152c58!important;text-decoration:none;
 border-bottom:1px solid #152c5833;padding-bottom:7px;transition:border-color .15s ease}
#nlf-expect .nlf-ex-cta:hover{border-bottom-color:#152c58}
#nlf-expect .nlf-ex-cta svg{width:15px;height:9px;fill:none;stroke:currentColor;
 stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
:root[dir="rtl"] #nlf-expect .nlf-ex-cta svg{transform:scaleX(-1)}
#nlf-expect .nlf-ex-stage{position:relative;isolation:isolate;overflow:hidden;margin-top:36px;
 width:100%;max-width:520px;box-sizing:border-box;padding:48px 40px;border-radius:4px;
 background:#0d1626}
#nlf-expect .nlf-ex-ph{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;
 max-width:none;object-fit:cover;object-position:50% 42%}
#nlf-expect .nlf-ex-stage::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
 background:linear-gradient(180deg,rgba(13,22,38,.25),rgba(13,22,38,.55))}
@media(min-width:1025px){
 #nlf-expect .nlf-ex-stage{margin-top:auto}
 #nlf-expect .nlf-ex-rail .nlf-h2{margin-bottom:36px}
}
#nlf-expect .nlf-ex-card{position:relative;z-index:2;width:100%;box-sizing:border-box;padding:28px;
 border-radius:4px;background:rgba(13,22,38,.52);
 -webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),inset 0 1px 0 rgba(255,255,255,.22),0 30px 60px -30px rgba(0,0,0,.7)}
@supports not ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
 #nlf-expect .nlf-ex-card{background:rgba(13,22,38,.88)}
}
#nlf-expect .nlf-ex-card-h{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit}
#nlf-expect .nlf-ex-wa{flex:none;width:34px;height:34px;fill:#25D366}
#nlf-expect .nlf-ex-card-t{display:block;font-family:"Gilda Display",Georgia,serif;font-weight:400;
 font-size:22px;line-height:1.2;letter-spacing:-.02em;color:#fcfaf5}
:root[dir="rtl"] #nlf-expect .nlf-ex-card-t{font-family:"Noto Naskh Arabic","Gilda Display",Georgia,serif!important;line-height:1.6}
#nlf-expect .nlf-ex-card-n{display:block;margin-top:4px;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;
 font-size:15px;font-weight:600;line-height:1.3;color:#d9bd72;unicode-bidi:isolate}
:root[dir="rtl"] #nlf-expect .nlf-ex-card-n{text-align:right}
#nlf-expect .nlf-ex-card-b{margin:16px 0 22px;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;
 font-size:15px;line-height:1.5;color:rgba(252,250,245,.8)}
#nlf-expect .nlf-ex-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
 height:52px;padding:0 20px;box-sizing:border-box;border-radius:2px;text-decoration:none;
 font-family:Switzer,ui-sans-serif,system-ui,sans-serif;font-size:15px;font-weight:600;line-height:1;
 letter-spacing:.05em;text-transform:uppercase;transition:background-color .15s ease}
:root:not([lang="en"]):not([lang="es"]) #nlf-expect .nlf-ex-btn{text-transform:none;letter-spacing:0}
#nlf-expect .nlf-ex-btn-wa{background:#fcfaf5;color:#0d1626!important}
#nlf-expect .nlf-ex-btn-wa:hover{background:#fff}
#nlf-expect .nlf-ex-btn-wa .nlf-ex-wa{width:20px;height:20px}
#nlf-expect .nlf-ex-card .nlf-ex-cta{margin-top:10px!important;border:0;padding:0 20px;
 background:rgba(255,255,255,.04);color:#fcfaf5!important;box-shadow:inset 0 0 0 1px rgba(252,250,245,.42)}
#nlf-expect .nlf-ex-card .nlf-ex-cta:hover{background:rgba(255,255,255,.1)}
#nlf-expect .nlf-ex-btn:focus-visible,#nlf-expect .nlf-ex-card-h:focus-visible{outline:2px solid #d9bd72;outline-offset:3px}
@media(max-width:1024px){#nlf-expect .nlf-ex-stage{max-width:560px}
}
@media(max-width:600px){
 #nlf-expect .nlf-ex-stage{max-width:none;padding:32px 16px}
#nlf-expect .nlf-ex-card{padding:22px}
#nlf-expect .nlf-ex-btn{height:48px}
}
#nlf-expect .nlf-ex-list{display:flex;flex-direction:column}
#nlf-expect .nlf-ex-i{padding:30px 0;border-top:1px solid #0d16261a}
#nlf-expect .nlf-ex-i:last-child{border-bottom:1px solid #0d16261a}
#nlf-expect .nlf-ex-t{font-family:"Gilda Display",Georgia,serif;font-weight:400;font-size:26px;
 line-height:33px;letter-spacing:-.5px;color:#0d1626;margin:0 0 12px;display:block}
:root[dir="rtl"] #nlf-expect .nlf-ex-t{font-family:"Noto Naskh Arabic","Gilda Display",Georgia,serif!important;
 line-height:44px}
#nlf-expect .nlf-ex-b{font-family:Switzer,ui-sans-serif,system-ui,sans-serif;font-size:16px;
 line-height:26px;color:#0d1626c4;margin:0;max-width:58ch}
#nlf-expect .nlf-ex-b a{color:#152c58;text-decoration:underline;text-underline-offset:3px;
 text-decoration-thickness:1px;text-decoration-color:#152c5866}
#nlf-expect .nlf-ex-b a:hover{text-decoration-color:#152c58}
@media(max-width:1024px){
 #nlf-expect{padding:120px 32px}
#nlf-expect .nlf-ex{grid-template-columns:1fr;gap:44px}
#nlf-expect .nlf-h2{font-size:38px;line-height:43px;letter-spacing:-1.3px}
}
@media(max-width:600px){
 #nlf-expect{padding:88px 16px}
#nlf-expect .nlf-h2{font-size:31px;line-height:36px;letter-spacing:-1px}
#nlf-expect .nlf-ex-t{font-size:22px;line-height:29px}
#nlf-expect .nlf-ex-i{padding:24px 0}
}
/* ---------------------------------------------------------------- Chinese only: hero lines and the WeChat card */
#nlf-zh-place{margin:0 0 14px;font-size:16px;font-weight:600;line-height:1.4;letter-spacing:.08em;color:#d9bd72}
#nlf-zh-fed{margin:0;max-width:26em;font-size:14px;line-height:1.7;color:rgba(252,250,245,.84)}
@media(max-width:809px){#nlf-zh-place{font-size:15px;margin-bottom:10px}
#nlf-zh-fed{font-size:13.5px}
}
#nlf-expect .nlf-zwx{margin-top:14px}
#nlf-expect .nlf-ex-wx{flex:none;width:34px;height:34px;fill:#07C160}
#nlf-expect .zwx-open .nlf-ex-wx{width:20px;height:20px}
#nlf-expect .zwx-row{display:flex;align-items:center;gap:20px;margin:20px 0 0}
#nlf-expect .zwx-qr{flex:none;display:block;width:132px;height:132px;max-width:none;border-radius:4px;background:#fff}
#nlf-expect .zwx-side{min-width:0;display:flex;flex-direction:column;gap:12px}
#nlf-expect .zwx-who,#nlf-cc .cc-wx-who{display:flex;align-items:center;gap:12px}
#nlf-expect .zwx-who img{flex:none;display:block;width:52px;height:52px;max-width:none;border-radius:4px;object-fit:cover}
#nlf-expect .zwx-who b,#nlf-cc .cc-wx-who b{display:block;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;font-size:15px;
 font-weight:600;line-height:1.3;color:#fcfaf5;direction:ltr;unicode-bidi:isolate}
#nlf-expect .zwx-who i,#nlf-cc .cc-wx-who i{display:block;margin-top:2px;font-style:normal;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;
 font-size:13px;line-height:1.4;color:#d9bd72}
#nlf-expect .zwx-scan{margin:0;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;font-size:14px;line-height:1.55;color:rgba(252,250,245,.8)}
#nlf-expect .zwx-open{margin-top:22px}
@media (hover:hover) and (min-width:1025px){#nlf-expect .zwx-open{display:none}
}
@media(max-width:600px){
 #nlf-expect .zwx-row{flex-wrap:wrap;gap:16px}
#nlf-expect .zwx-qr{width:116px;height:116px}
 #nlf-expect .zwx-side{display:contents}
#nlf-expect .zwx-who{order:-1;flex:1 0 100%}
#nlf-expect .zwx-scan{flex:1 1 0;min-width:0;align-self:center}
}
/* ---------------------------------------------------------------- client reviews, English only (verbatim) */
.v3-reviews {
  --v3-ink: var(--ink, #0d1626);
  --v3-muted: var(--muted, #0d16269e);
  --v3-hairline: var(--hairline, #0d16261a);
  --v3-page: var(--page, #f7f3ea);
  --v3-raised: var(--raised, #fcfaf5);
  --v3-gold: var(--gold, #b8963e);
  --v3-gold-dk: var(--gold-dk, #a3822f);
  --v3-navy: var(--navy, #152c58);
  background: var(--v3-page);
  color: var(--v3-ink);
  padding: 180px 48px;
}
.v3-reviews__inner {
  max-width: 1344px;
  margin: 0 auto;
}
/* ---------- head ---------- */
.v3-eyebrow {
  margin: 0 0 28px;
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--v3-gold-text, #7d6320);
}
.v3-rating {
  display: flex;
  align-items: flex-end;
  gap: 32px;
  border-top: 1px solid var(--v3-hairline);
  padding-top: 24px;
}
.v3-rating__num {
  font-family: "Gilda Display", Georgia, serif;
  font-weight: 400;
  font-size: clamp(96px, 14vw, 200px);
  line-height: 0.85;
  letter-spacing: -4px;
  color: var(--v3-ink);
}
.v3-rating__meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 12px;
  max-width: 260px;
}
.v3-rating__of {
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: var(--v3-ink);
}
.v3-rating__count {
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 14px;
  line-height: 20px;
  color: var(--v3-muted);
}
.v3-reviews__title {
  margin: 56px 0 0;
  max-width: 780px;
  font-family: "Gilda Display", Georgia, serif;
  font-weight: 400;
  font-size: 48px;
  line-height: 52.8px;
  letter-spacing: -1.92px;
  color: var(--v3-ink);
}
/* ---------- staggered grid ---------- */
.v3-grid {
  margin-top: 140px;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 40px;
}
.v3-quote {
  margin: 0;
  padding-top: 32px;
  border-top: 1px solid var(--v3-hairline);
}
.v3-quote__text {
  margin: 0;
  font-family: "Gilda Display", Georgia, serif;
  font-weight: 400;
  font-style: italic;
  font-size: 26px;
  line-height: 1.35;
  letter-spacing: -0.3px;
  color: var(--v3-ink);
}
.v3-quote__foot {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 28px;
}
/* ---------- avatar (square, hairline-bound, 0 radius: matches the site rule) ---------- */
.v3-avatar {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  border: 1px solid var(--v3-hairline);
  background: var(--v3-raised);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.v3-avatar--photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: grayscale(100%) contrast(1.05);
}
.v3-avatar--mono {
  font-family: "Gilda Display", Georgia, serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 1;
  color: var(--v3-navy);
  user-select: none;
}
.v3-quote__id {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.v3-quote__sig {
  font-family: "Gilda Display", Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 20px;
  color: var(--v3-navy);
}
.v3-quote__role {
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: var(--v3-muted);
}
.v3-quote--a {
  grid-column: 1 / span 7;
  grid-row: 1;
}
.v3-quote--b {
  grid-column: 8 / span 5;
  grid-row: 1;
  margin-top: 220px;
}
.v3-quote--c {
  grid-column: 1 / span 4;
  grid-row: 2;
  margin-top: 96px;
}
.v3-quote--d {
  grid-column: 6 / span 7;
  grid-row: 2;
  margin-top: 168px;
}
/* ---------- note + links ---------- */
.v3-note {
  margin: 96px 0 0;
  max-width: 560px;
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 14px;
  line-height: 22px;
  color: var(--v3-muted);
}
.v3-links {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  margin-top: 64px;
  padding-top: 24px;
  border-top: 1px solid var(--v3-hairline);
}
.v3-link {
  font-family: Switzer, ui-sans-serif, system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.2px;
  color: var(--v3-navy);
  text-decoration: none;
  border-bottom: 1px solid var(--v3-hairline);
  padding-bottom: 2px;
  transition: border-color 0.2s ease, color 0.2s ease;
}
.v3-link:hover {
  color: var(--v3-gold-dk);
  border-bottom-color: currentColor;
}
/* ---------- responsive ---------- */
@media (max-width: 900px) {
  .v3-reviews {
    padding: 120px 32px;
  }
.v3-rating__num {
    font-size: clamp(72px, 20vw, 120px);
    letter-spacing: -2px;
  }
.v3-reviews__title {
    font-size: 36px;
    line-height: 40px;
    letter-spacing: -1.1px;
  }
.v3-grid {
    margin-top: 88px;
    grid-template-columns: 1fr;
    row-gap: 0;
  }
.v3-quote--a,
  .v3-quote--b,
  .v3-quote--c,
  .v3-quote--d {
    grid-column: 1 / -1;
    margin-top: 56px;
    grid-row: auto;
  }
.v3-quote--a {
    margin-top: 0;
  }
.v3-quote__text {
    font-size: 22px;
  }
}
@media (max-width: 480px) {
  .v3-reviews {
    padding: 96px 20px;
  }
.v3-rating {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
.v3-rating__meta {
    padding-bottom: 0;
    max-width: none;
  }
.v3-reviews__title {
    margin-top: 40px;
    font-size: 30px;
    line-height: 34px;
    letter-spacing: -0.8px;
  }
.v3-quote__text {
    font-size: 20px;
  }
.v3-avatar {
    width: 34px;
    height: 34px;
  }
.v3-avatar--mono {
    font-size: 15px;
  }
.v3-links {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
}

/* ---------------------------------------------------------------- scroll reveals (measured on the ruler)
   Text blocks fade in over .5 s; photographs, cards and the two attorney rows over .8 s (--reveal-dur on the element).
   The chrome's "fade" preset gives the opacity, the trigger and the per-element delay; these rules set the length and take
   35 ms off every delay (the observer callback and the style recalculation that follow a scroll cost about two frames).
   The four steps do not start hidden: they start at .7 and settle to 1 over 1 s when they scroll in. */
html.js .page--home [data-reveal="fade"].is-in { transition-duration: var(--reveal-dur, .5s); transition-delay: calc(var(--reveal-delay, 0s) - 35ms); }
html.js .page--home .step [data-reveal="fade"] { opacity: .7; }
html.js .page--home .step [data-reveal="fade"].is-in { opacity: 1; transition-duration: 1s; }
/* The about photograph is held until half of it is on screen (script.js), then fades over .8 s. */
html.js .page--home .about__img[data-home-reveal] { opacity: .001; }
html.js .page--home .about__img[data-home-reveal].is-in { opacity: 1; transition: opacity .8s var(--reveal-ease) -35ms; }