/* fm-cavell - warm paper editorial law theme. Generated sources live in build/assets-src. */
@font-face{font-family:"Fraunces";src:url("../fonts/fraunces-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url("../fonts/public-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Public Sans";src:url("../fonts/public-sans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Inter";src:url("../fonts/inter-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}

:root{
  --paper:#F2F0ED;
  --paper-2:#FCFBFA;
  --light:#F5F5F5;
  --ink:#262626;
  --ink-2:#2E2B28;
  --muted:#6B6B6B;
  --muted-2:#5E5B58;
  --dark:#283937;
  --mint:#CCD9D7;
  --line:#DBD5CD;
  --line-soft:rgba(38,38,38,.10);
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Public Sans",system-ui,-apple-system,Segoe UI,sans-serif;
  --label:"Inter",system-ui,-apple-system,Segoe UI,sans-serif;
  --gut:40px;
  --pad:40px;
  --hdr:68px;
  --ease:cubic-bezier(.22,1,.36,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.5;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,h4,h5,p,figure,ul,ol{margin:0}
ul{padding:0;list-style:none}

/* ---------- shell ---------- */
.wrap{width:100%;max-width:1600px;margin:0 auto;padding:0 var(--pad);position:relative}
.inner{padding:0 var(--pad)}
.rules{position:absolute;inset:0;pointer-events:none;z-index:0}
.rules span{position:absolute;top:0;bottom:0;width:1px;background:var(--line)}
.rules span:first-child{left:var(--pad)}
.rules span:last-child{right:var(--pad)}
main,footer{position:relative;z-index:1}

/* ---------- header ---------- */
.hdr{position:fixed;top:0;left:0;right:0;height:var(--hdr);background:var(--paper);z-index:60}
.hdr-in{height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{font-family:var(--display);font-size:26px;line-height:1;letter-spacing:-.6px;color:var(--ink);white-space:nowrap}
.nav{display:flex;gap:40px;position:absolute;left:50%;transform:translateX(-50%)}
.nav a{font-size:14px;line-height:21px;color:var(--ink);padding:4px 0;position:relative}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--ink);transition:right .4s var(--ease)}
.nav a:hover::after,.nav a:focus-visible::after{right:0}
.nav a[aria-current="page"]::after{right:0}
.burger{display:none;width:40px;height:40px;align-items:center;justify-content:center;background:none;border:0;padding:0;cursor:pointer}
.burger span{display:block;width:18px;height:1px;background:var(--ink);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:1px;background:var(--ink)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.menu{visibility:hidden;position:fixed;top:var(--hdr);right:0;width:100%;height:599px;max-height:calc(100vh - var(--hdr));background:var(--paper);border-top:1px solid var(--line);transform:translateX(100%);transition:transform .45s var(--ease);z-index:55;padding:48px 32px;display:none}
.menu a{display:block;font-size:20px;line-height:30px;padding:28px 0;border-bottom:1px solid var(--line-soft)}
.menu.open{visibility:visible;transform:translateX(0)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:6px;padding:8px 12px;font-size:14px;line-height:21px;font-family:var(--sans);border:0;cursor:pointer;transition:background-color .35s var(--ease),color .35s var(--ease),opacity .35s var(--ease)}
.btn svg{width:14px;height:14px;flex:none}
.btn-dark{background:var(--dark);color:var(--light)}
.btn-dark:hover{background:#1E2C2A}
.btn-paper{background:var(--paper);color:var(--ink)}
.btn-paper:hover{background:#fff}
.btn-lg{padding:10px 16px}
.link-u{position:relative;display:inline-block;font-size:14px;line-height:21px;color:var(--muted)}
.link-u::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;background:currentColor;transform-origin:right;transition:transform .4s var(--ease)}
.link-u:hover::after{transform:scaleX(0)}

/* ---------- type ---------- */
.eyebrow{display:flex;align-items:center;gap:8px;font-size:14px;line-height:21px;color:var(--muted)}
.eyebrow svg{width:16px;height:16px;flex:none;stroke:currentColor;fill:none;stroke-width:1.4}
.eyebrow.center{justify-content:center}
.d1,.d2,.d3,.d4{font-family:var(--display);font-weight:400;color:var(--ink);text-wrap:balance}
.d1{font-size:72px;line-height:72px;letter-spacing:-2px}
.d2{font-size:52px;line-height:57.2px;letter-spacing:-2px}
.d3{font-size:40px;line-height:48px;letter-spacing:-2px}
.d4{font-size:24px;line-height:32.4px;letter-spacing:-.8px}
.d5{font-family:var(--display);font-weight:400;font-size:48px;line-height:52.8px;letter-spacing:-2px;color:var(--ink)}
.d1 em,.d2 em,.d3 em,.d4 em,.d5 em{font-style:italic}
.lead{font-size:16px;line-height:24px;color:var(--muted)}
.lead-18{font-size:18px;line-height:27px;color:var(--muted)}
.small{font-size:14px;line-height:21px;color:var(--muted)}
.tiny{font-size:12px;line-height:18px;color:var(--muted)}
.on-dark{color:var(--light)}
.on-dark .lead,.on-dark .small{color:rgba(245,245,245,.82)}

/* ---------- word reveal ---------- */
.rev .w{display:inline-block}
.js .rev .w{opacity:.001;filter:blur(10px);transform:translateY(10px) scale(1.2);transition:opacity .7s var(--ease),filter .7s var(--ease),transform .7s var(--ease)}
.rev.in .w{opacity:1;filter:blur(0);transform:none;transition-delay:calc(var(--i,0)*40ms)}
.hero-rev .w{animation:wordIn .8s var(--ease) both;animation-delay:calc(var(--i,0)*40ms);opacity:1;filter:none;transform:none}
@keyframes wordIn{from{opacity:.001;filter:blur(10px);transform:translateY(10px) scale(1.2)}to{opacity:1;filter:blur(0);transform:none}}
.js .fade{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.fade.in{opacity:1;transform:none}

/* ---------- bands ---------- */
.band{position:relative}
.band-pad{padding:120px 0}
.media{position:relative;overflow:hidden;background:var(--dark)}
.media img{width:100%;height:100%;object-fit:cover}
.noise{position:absolute;inset:0;pointer-events:none;opacity:.20;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iLjg1IiBudW1PY3RhdmVzPSIzIi8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbHRlcj0idXJsKCNuKSIgb3BhY2l0eT0iLjUiLz48L3N2Zz4=")}
.scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(16,20,19,.74) 0%,rgba(16,20,19,.56) 38%,rgba(16,20,19,.72) 100%)}

/* hero (home) */
.hero{padding-top:var(--hdr)}
.hero-box{position:relative;height:780px;overflow:hidden}
.hero-box .noise{opacity:.16}
.hero-copy{position:absolute;inset:0;padding:40px}
.hero-h1{position:absolute;left:40px;top:40px;width:544px;color:var(--light)}
.hero-side{position:absolute;right:40px;top:51px;width:368px}
.hero-side p{font-size:16px;line-height:24px;color:var(--light)}
.hero-side .btn{margin-top:24px;min-width:176px;justify-content:center}
.logostrip{position:absolute;left:40px;right:40px;bottom:36px;overflow:hidden}
.logostrip .track,.logos-row .track{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}
.logostrip .track b,.logos-row .track b{display:none}
.logostrip .lg{display:inline-flex;align-items:center;gap:10px;font-size:18px;line-height:24px;font-weight:500;color:var(--light);letter-spacing:-.2px;white-space:nowrap}
.logostrip .lg svg{width:20px;height:20px;flex:none;fill:currentColor}
.logostrip.on-paper .lg{color:var(--ink)}

/* page hero (inner) */
.phero{padding-top:calc(var(--hdr) + 64px)}
.phero .eyebrow{margin-bottom:16px}
.phero-visual{margin-top:104px;height:360px}
.logos-row{overflow:hidden;height:24px}

/* results / stats */
.stats{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.stats li{padding:24px 24px 28px;border-left:1px solid var(--line)}
.stats li:first-child{padding-left:0;border-left:0}
.stats .k{font-size:12px;line-height:18px;color:var(--muted)}
.stats .v{display:block;margin-top:3px;font-family:var(--display);font-size:72px;line-height:79.2px;letter-spacing:-2.8px;color:var(--ink)}

/* service cards */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.card{position:relative;display:block;background:var(--paper-2);border:1px solid var(--line);border-radius:2px;padding:24px;height:373px;overflow:clip}
.card-head{display:flex;width:100%;align-items:flex-start;justify-content:space-between;gap:16px;min-height:32px}
.card-head .d4{max-width:267px}
.card-head .n{font-size:12px;line-height:18px;color:var(--muted)}
.card-ico{width:20px;height:20px;stroke:var(--muted);fill:none;stroke-width:1.3;flex:none;margin-right:12px;margin-top:6px}
.card-visual{display:block;position:relative;margin:19px 0 0 -4px;width:359px;max-width:calc(100% + 8px);height:232px;z-index:0}
.card-visual img{border-radius:4px;transform:rotate(-2deg) translate(8px,219px);transition:transform .9s var(--ease)}
.card-visual img{width:100%;height:100%;object-fit:cover;border-radius:4px}
.card-desc{display:block;position:absolute;left:20px;right:20px;bottom:8px;z-index:2;background:var(--paper-2);border-radius:8px;padding:24px 0 0;min-height:96px}
.card-desc::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(38,38,38,0),var(--line) 12%,var(--line) 88%,rgba(38,38,38,0))}
.card-desc p{font-size:16px;line-height:24px;color:var(--muted);max-width:328px}
.card:hover .card-visual img,.card:focus-visible .card-visual img{transform:rotate(-2deg) translate(0,0)}

/* how we work */
.work{position:relative}
.work-media{position:absolute;left:var(--pad);right:var(--pad);top:160px;height:780px;overflow:hidden}
.work-media img{width:100%;height:120%;object-fit:cover;transform:translateY(var(--par,0px))}
.work-title{position:relative;padding-top:200px;text-align:center}
.feat{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:357px}
.feat li{padding:0 0 0 32px;border-left:1px solid rgba(245,245,245,.45);min-height:228px}
.feat li:first-child{padding-left:32px;border-left:0}
.feat .ico{width:22px;height:22px;stroke:var(--light);fill:none;stroke-width:1.3;margin-bottom:50px}
.feat h3{margin-bottom:65px}
.feat p{font-size:16px;line-height:24px;font-weight:500;color:var(--light);max-width:389px}

/* testimonials */
.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.q{background:var(--paper-2);border:1px solid var(--line);border-radius:2px;padding:24px;min-height:348px}
.q-top{display:flex;align-items:center;gap:16px}
.avatar{display:block;position:relative;width:48px;height:48px;border-radius:4px;overflow:hidden;flex:none;background:var(--line)}
.avatar img{position:absolute;width:506px;max-width:none;height:auto}
.q .nm{font-size:16px;line-height:24px;font-weight:500;color:var(--ink)}
.q .role{font-size:14px;line-height:21px;color:var(--muted)}
.q hr{border:0;height:1px;background:linear-gradient(90deg,rgba(38,38,38,0),var(--line) 12%,var(--line) 88%,rgba(38,38,38,0));margin:26px 0 30px}
.q .mark{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:500;color:var(--ink);margin-bottom:16px}
.q .mark svg{width:18px;height:18px;fill:currentColor}
.q p{font-size:16px;line-height:24px;color:var(--muted)}

/* split band (how we started) */
.split{display:grid;grid-template-columns:minmax(0,634px) minmax(0,1fr);gap:66px;align-items:start}
.panelshot{position:relative;width:100%;max-width:634px;height:640px}
.panelshot .plate{display:block;position:absolute;left:0;top:0;width:100%;height:640px;overflow:hidden}
.panelshot .plate img{width:100%;height:100%;object-fit:cover}
.panelshot .shot{display:block;position:absolute;left:68px;top:12px;right:0;height:550px;overflow:hidden}
.panelshot .shot img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.avrow{display:flex;align-items:center;gap:16px;border:1px solid var(--line);border-radius:2px;background:var(--paper-2);padding:16px;width:fit-content}
.avstack{display:flex}
.avstack .avatar{display:block;width:48px;height:48px;border-radius:2px;margin-left:-4px;border:2px solid var(--paper-2)}
.avstack .avatar:first-child{margin-left:0}
.avrow .sep{width:1px;height:32px;background:var(--line)}
.avrow p{font-size:14px;line-height:21px;color:var(--muted)}
.avrow strong{font-weight:400;color:var(--ink)}

/* attorneys */
.people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.person .shot{display:block;width:100%;aspect-ratio:1/1;overflow:hidden;background:var(--line)}
.person .shot img{width:100%;height:100%;object-fit:cover;object-position:50% 16%;transition:transform .8s var(--ease)}
.person:hover .shot img{transform:scale(1.03)}
.person h3{margin-top:24px}
.person .role{margin-top:8px;min-height:0;font-size:14px;line-height:21px;color:var(--muted)}
.person p{margin-top:16px;min-height:72px;font-size:16px;line-height:24px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.tags span{border:1px solid var(--line);border-radius:2px;padding:5px 12px;font-size:14px;line-height:21px;color:var(--muted)}

/* track record */
.tr-media{height:640px;border-radius:2px;overflow:hidden;position:relative}
.tr-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s var(--ease)}
.tr-media img.on{opacity:1}
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:40px;min-height:254px}
.case{padding-top:24px;position:relative;text-align:left;background:none;border:0;cursor:pointer}
.case .bar{position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.case .bar i{display:block;height:1px;width:0;background:var(--ink)}
.case.on .bar i{width:100%;transition:width 7s linear}
.case h3{color:var(--ink);opacity:.45;transition:opacity .5s var(--ease)}
.case p{margin-top:16px;font-size:16px;line-height:24px;color:var(--muted);opacity:.45;transition:opacity .5s var(--ease)}
.case .link-u{margin-top:24px}
.case.on h3,.case.on p{opacity:1}

/* journal */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.post h3{min-height:65px}
.post .meta{margin-top:17px;font-size:14px;line-height:21px;color:var(--muted)}
.post .shot{display:block;margin-top:45px;height:260px;overflow:hidden;background:var(--line)}
.post .shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.post:hover .shot img{transform:scale(1.04)}

/* cta closer */
.cta{position:relative;padding:470px 0 64px}
.cta .inner{position:relative}
.cta-fan{position:absolute;left:var(--pad);right:var(--pad);top:-470px;height:470px;z-index:0}
.cta-fan figure{position:absolute;margin:0;overflow:hidden;border-radius:1px;box-shadow:0 18px 40px rgba(38,38,38,.10);border:6px solid var(--paper-2)}
.cta-fan .f1{left:12.1875%;top:324px;width:33.125%;aspect-ratio:424/322;transform:rotate(-7deg)}
.cta-fan .f2{left:31.09375%;top:246px;width:33.515625%;aspect-ratio:429/329;transform:rotate(3deg)}
.cta-fan .f3{left:54.921875%;top:255px;width:32.578125%;aspect-ratio:417/310;transform:rotate(9deg)}
.cta-fan img{width:100%;height:100%;object-fit:cover}
.cta-panel{position:relative;z-index:1;background:var(--paper);border:1px solid var(--line);border-bottom:0;border-radius:16px 16px 0 0;padding:80px 40px 0;text-align:center;min-height:274px}
.cta-panel .btn{margin-top:40px;min-width:170px;height:40px;justify-content:center;padding:0 16px}

/* footer */
.foot{position:relative;padding-top:54px}
.foot-shape{position:absolute;right:var(--pad);top:-54px;width:530px;height:55px;background:var(--dark);clip-path:polygon(100px 0,100% 0,100% 100%,0 100%)}
.foot-in{position:relative;background:var(--dark);border-radius:0;padding:104px 40px 0;min-height:488px;overflow:hidden}
.foot-grid{position:relative;display:grid;grid-template-columns:minmax(0,564px) minmax(0,1fr);gap:0}
.foot-mark{font-family:var(--display);font-size:96px;line-height:.84;letter-spacing:-3px;color:var(--light)}
.foot-tag{margin-top:24px;font-size:16px;line-height:24px;color:var(--mint);max-width:240px}
.socials{display:flex;gap:12px;margin-top:48px}
.socials a{width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:var(--mint);transition:color .35s var(--ease)}
.socials a:hover{color:var(--light)}
.socials svg{width:18px;height:18px;fill:currentColor}
.foot-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.foot-cols div{padding-left:36px;border-left:1px solid rgba(204,217,215,.22)}
.foot-cols h2{font-family:var(--display);font-size:24px;line-height:32.4px;letter-spacing:-.8px;color:var(--light);font-weight:400}
.foot-cols ul{margin-top:24px;display:grid;gap:8px}
.foot-cols a,.foot-cols p{font-family:var(--label);font-size:14px;line-height:21px;color:var(--mint)}
.foot-cols a{transition:color .35s var(--ease)}
.foot-cols a:hover{color:var(--light)}
.foot-bot{position:relative;margin-top:33px;padding:24px 0 30px;border-top:1px solid rgba(204,217,215,.22);display:flex;align-items:center;justify-content:space-between;gap:24px}
.foot-bot p,.foot-bot a{font-size:12px;line-height:18px;color:var(--mint)}
.foot-bot a{text-decoration:underline;text-underline-offset:3px}
.disclaimer{margin-top:12px;max-width:820px;font-size:12px;line-height:18px;color:rgba(204,217,215,.75)}

/* contact */
.contact-grid{display:grid;grid-template-columns:616fr 632fr;gap:32px;align-items:start}
.cinfo li{display:grid;grid-template-columns:24px 1fr;gap:8px;margin-top:40px}
.cinfo svg{width:16px;height:16px;stroke:var(--muted);fill:none;stroke-width:1.4;margin-top:3px}
.cinfo .k{font-size:14px;line-height:21px;color:var(--muted)}
.cinfo .v{margin-top:6px;font-size:20px;line-height:30px;color:var(--dark)}
.form{background:var(--paper-2);border:1px solid var(--line);border-radius:2px;padding:32px}
.form .row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-size:14px;line-height:21px;color:var(--ink);margin-bottom:6px}
.field input,.field select{width:100%;height:37px;background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:0 16px;font-family:var(--sans);font-size:14px;line-height:21px;color:var(--ink)}
.field textarea{width:100%;background:var(--paper-2);border:1px solid var(--line);border-radius:4px;padding:8px 16px;font-family:var(--sans);font-size:14px;line-height:21px;color:var(--ink)}
.field textarea{height:100px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#8C8781}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--dark);outline-offset:1px}
.form button{width:100%;height:37px;justify-content:center;padding:0;margin-top:12px}
.form .note{margin-top:14px;font-size:12px;line-height:18px;color:var(--muted)}
.form .ok{display:none;margin-top:16px;padding:12px;border:1px solid var(--line);border-radius:4px;font-size:14px;color:var(--dark);background:var(--paper)}
.form.sent .ok{display:block}

/* process / steps */
.steps{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:start}
.steps-stick{position:sticky;top:148px}
.step{padding:48px 0;border-bottom:1px solid var(--line)}
.step:first-child{padding-top:0}
.step:last-child{border-bottom:0}
.step .ico{width:36px;height:36px;stroke:var(--ink);fill:none;stroke-width:1.2;margin-bottom:28px}
.step p{margin-top:28px;font-size:16px;line-height:24px;color:var(--muted)}
.numlist li{display:grid;grid-template-columns:40px 1fr;padding:21px 0;border-bottom:1px solid var(--line)}
.numlist li:last-child{border-bottom:0}
.numlist .n{font-size:16px;line-height:24px;color:var(--ink)}
.numlist h3{font-size:16px;line-height:24px;font-weight:400;color:var(--ink);font-family:var(--sans)}
.numlist p{margin-top:6px;font-size:14px;line-height:21px;color:var(--muted)}

/* value cards (team) */
.vals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.val{background:var(--paper-2);border:1px solid var(--line);border-radius:2px;padding:24px;min-height:196px}
.val .ico{width:22px;height:22px;stroke:var(--ink);fill:none;stroke-width:1.3;margin-bottom:22px}
.val p{margin-top:40px;font-size:16px;line-height:24px;color:var(--muted)}

/* spec strip (detail) */
.spec{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:var(--paper-2);border:1px solid var(--line);border-radius:2px}
.spec li{padding:32px;border-left:1px solid var(--line)}
.spec li:first-child{border-left:0}
.spec .k{font-size:12px;line-height:18px;color:var(--muted)}
.spec .v{margin-top:10px;font-family:var(--display);font-size:24px;line-height:32.4px;letter-spacing:-.8px;color:var(--ink)}

/* faq */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:124px;align-items:start}
.faq-list li{padding:12px 0;border-bottom:1px solid var(--line)}
.faq-list li:first-child{padding-top:0}
.faq-list h3{font-family:var(--sans);font-weight:400;font-size:16px;line-height:24px;color:var(--ink)}
.faq-list p{margin-top:10px;font-size:16px;line-height:24px;color:var(--muted)}

/* attorney rows (detail) */
.arow{display:grid;grid-template-columns:minmax(0,614px) minmax(0,1fr);gap:119px;align-items:center;margin-top:80px}
.arow .frame{position:relative;width:100%;max-width:614px;height:606px}
.arow .plate{display:block;position:absolute;left:0;top:0;width:100%;height:606px;overflow:hidden}
.arow .plate img{width:100%;height:100%;object-fit:cover}
.arow .shot{display:block;position:absolute;left:78px;top:48px;right:0;height:558px;overflow:hidden}
.arow .shot img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.arow .role{margin-top:8px;font-size:14px;line-height:21px;color:var(--muted)}
.arow .bio{margin-top:132px;font-size:16px;line-height:24px;color:var(--muted)}
.arow .acts{display:flex;gap:44px;margin-top:40px}
.arow .acts a{display:flex;align-items:center;gap:12px}
.arow .acts svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:1.3}

/* two-col text (detail) */
.twocol{display:grid;grid-template-columns:minmax(0,540px) minmax(0,1fr);gap:100px;align-items:start}
.twocol .shot{display:block;height:480px;overflow:hidden}
.twocol .shot img{width:100%;height:100%;object-fit:cover;object-position:50% 26%}


/* ---------- responsive ---------- */
@media (max-width:1100px){
  .split{grid-template-columns:1fr;gap:40px}
  .panelshot,.panelshot .plate{width:100%}
  .panelshot .shot{left:44px;width:calc(100% - 44px)}
  .contact-grid,.faq,.twocol,.steps,.arow{grid-template-columns:1fr;gap:56px}
  .arow .frame,.arow .plate{width:100%}
  .arow .shot{left:48px;width:calc(100% - 48px)}
  .cards,.quotes,.people,.posts,.cases{grid-template-columns:repeat(2,minmax(0,1fr))}
  .vals{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero-h1{position:static;width:auto;margin-bottom:24px}
  .hero-side{position:static;width:auto;max-width:520px}
  .hero-copy{display:flex;flex-direction:column;justify-content:flex-start}
}
@media (max-width:760px){
  :root{--pad:16px;--hdr:64px}
  .inner{padding:0 16px}
  .nav{display:none}
  .burger{display:flex}
  .menu{display:block}
  .hdr-in .btn{display:none}
  .band-pad{padding:80px 0}
  .socials{margin-top:24px}
  .foot-bot{margin-top:24px}
  .q{min-height:0}
  .stats li{padding:16px 16px 20px 0}
  .card{padding-bottom:0;min-height:0}
  .d1{font-size:48px;line-height:48px;letter-spacing:-1.4px}
  .d2{font-size:40px;line-height:44px;letter-spacing:-1px}
  .d3{font-size:32px;line-height:38.4px;letter-spacing:-1px}
  .d5{font-size:32px;line-height:38.4px;letter-spacing:-1px}
  .hero{padding-top:68px}
  .hero-box{height:520px}
  .hero-copy{padding:40px 16px 0}
  .hero-h1{margin-bottom:0}
  .hero-side{margin-top:24px}
  .hero-side .btn{margin-top:24px;min-width:176px}
  .logostrip{left:16px;right:16px;bottom:40px;height:24px}
  .logostrip .track,.logos-row .track{width:max-content;justify-content:flex-start;gap:40px;animation:marquee var(--mq,24s) linear infinite}
  .logostrip .track b,.logos-row .track b{display:inline}
  .logos-row .track{gap:40px}
  .logos-row{overflow:hidden}
  .logos-row::-webkit-scrollbar{display:none}
  .phero{padding-top:calc(var(--hdr) + 56px)}
  .phero-visual{margin-top:56px;height:180px;margin-inline:-16px}
  .visual-400{height:180px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 0}
  .stats li{border-left:0;padding:0 16px 0 0}
  .stats li:first-child{padding-left:0}
  .stats .v{font-size:48px;line-height:52.8px;letter-spacing:-1.8px}
  .cards,.people,.vals{grid-template-columns:1fr;gap:24px}
  .posts,.cases{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;min-height:0;scrollbar-width:none}
  .posts::-webkit-scrollbar,.cases::-webkit-scrollbar{display:none}
  .post,.case{scroll-snap-align:start}
  .post .shot{margin-top:24px;height:200px}
  .post h3{min-height:0}
  .card{height:auto;padding-bottom:0}
  /* donor defect fix: the fixed 359px visual set a min-content floor that pushed the
     1fr card column to 407px inside a 358px viewport, clipping the card's right edge. */
  .card-visual{margin:19px 0 0 -17px;width:calc(100% + 34px);max-width:none;height:232px}
  .card-visual img{transform:rotate(-2deg)}
  .card{overflow:visible;height:auto}
  .card-desc{position:static;padding:18px 0 20px;min-height:0}
  .quotes{grid-auto-flow:column;grid-auto-columns:82%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;gap:16px;padding-bottom:8px;scrollbar-width:none}
  .quotes::-webkit-scrollbar{display:none}
  .q{scroll-snap-align:start}
  .work-media{top:80px;height:520px}
  .work-title{padding-top:120px}
  .feat{grid-template-columns:1fr;margin-top:96px;gap:0}
  .feat li{border-left:0;padding:28px 0;min-height:0;border-top:1px solid rgba(245,245,245,.45)}
  .feat li:first-child{border-top:0}
  .feat .ico{margin-bottom:20px}
  .feat h3{margin-bottom:20px}
  .work-media{left:0;right:0;top:60px;height:1038px}
  .panelshot{height:360px}
  .panelshot .plate{height:360px}
  .panelshot .shot{top:10px;height:320px;left:36px;width:calc(100% - 36px)}
  .tr-media{height:280px}
  .cta{padding:84px 0 20px}
  .cta-fan{height:190px;max-width:330px}
  .cta-fan .f1{left:0;top:48px;width:150px;height:128px}
  .cta-fan .f2{left:76px;top:20px;width:148px;height:124px}
  .cta-fan .f3{left:178px;top:21px;width:130px;height:98px}
  .cta-panel{padding:40px 20px 0;min-height:200px}
  .foot-grid{grid-template-columns:1fr;gap:40px}
  .foot-in{padding:48px 20px 0}
  .foot-mark{font-size:64px}
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
  .foot-cols div{padding-left:0;border-left:0}
  .foot-bot{flex-direction:column;align-items:flex-start;gap:12px}
  .foot-shape{width:220px;height:42px;clip-path:polygon(60px 0,100% 0,100% 100%,0 100%)}
  .spec{grid-template-columns:1fr}
  .spec li{border-left:0;border-top:1px solid var(--line)}
  .spec li:first-child{border-top:0}
  .arow{gap:32px;margin-top:48px}
  .arow .bio{margin-top:32px}
  .arow .acts{flex-direction:column;gap:16px}
  .steps-stick{position:static}
  .step{padding:40px 0}
  .step .ico,.step p,.faq-list p,.feat h3{margin-bottom:24px}
  .faq{gap:24px}
  .faq-q{padding:30px 0}
  .arow{gap:24px;margin-top:32px}
  .arow .frame{height:auto;aspect-ratio:1/1}
  .arow .plate{height:100%}
  .arow .shot{top:32px;height:calc(100% - 32px)}
  .arow .bio{margin-top:24px}
  .twocol .shot{height:260px}
  .faq-list p{margin-top:16px}
  .twocol .shot{height:300px}
  .form{padding:16px}
  .field{margin-bottom:10px}
  .field textarea{height:84px}
  .spec li{padding:20px}
  .numlist li{padding:16px 0}
  .g-3{gap:32px}
  .form .row{grid-template-columns:1fr;gap:0}
  .cinfo li{margin-top:32px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rev .w,.hero-rev .w{opacity:1!important;filter:none!important;transform:none!important}
  .fade{opacity:1!important;transform:none!important}
  .card-visual{opacity:1!important}
  .case h3,.case p{opacity:1}
  .work-media img{transform:none!important}
}
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{position:fixed;top:8px;left:8px;width:auto;height:auto;clip:auto;background:var(--dark);color:var(--light);padding:10px 14px;border-radius:6px;z-index:99}

/* layout utilities (responsive replacements for inline grids) */
.g-results{display:grid;grid-template-columns:700fr 580fr;gap:0}
.g-cards4{grid-template-columns:repeat(3,minmax(0,1fr));gap:41px 40px}
.g-span2{grid-column:1/3}
.g-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end}
.g-journal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,408px);gap:40px;align-items:start}
.g-hero2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,280px);gap:80px;align-items:end}
.g-hero3{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:80px;align-items:start}
.g-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:88px}
@media (max-width:1100px){
  .g-results,.g-journal,.g-hero2,.g-hero3,.g-3{grid-template-columns:1fr;gap:40px}
  .g-cards4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g-span2{grid-column:1/-1}
}
@media (max-width:760px){
  html{overflow-x:hidden}
  .g-head{grid-template-columns:1fr;gap:24px;align-items:start}
  .g-cards4{grid-template-columns:1fr;gap:24px}
  .g-3{gap:40px}
  .foot-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
  .menu{width:100%}
}

/* generated spacing scale (desktop + mobile) */
.mt-100{margin-top:100px}
.mt-110{margin-top:110px}
.mt-118{margin-top:118px}
.mt-12{margin-top:12px}
.mt-120{margin-top:120px}
.mt-149{margin-top:149px}
.mt-16{margin-top:16px}
.mt-160{margin-top:160px}
.mt-18{margin-top:18px}
.mt-189{margin-top:189px}
.mt-190{margin-top:190px}
.mt-20{margin-top:20px}
.mt-200{margin-top:200px}
.mt-24{margin-top:24px}
.mt-37{margin-top:37px}
.mt-39{margin-top:39px}
.mt-40{margin-top:40px}
.mt-41{margin-top:41px}
.mt-44{margin-top:44px}
.mt-64{margin-top:64px}
.mt-78{margin-top:78px}
.mt-80{margin-top:80px}
.mt-88{margin-top:88px}
.mt-96{margin-top:96px}
.mt-97{margin-top:97px}
.pad-0{padding:0}
.pad-0-0-120{padding:0 0 120px}
.pad-0-0-121{padding:0 0 121px}
.pad-0-0-130{padding:0 0 130px}
.pad-0-0-226{padding:0 0 226px}
.pad-0-0-80{padding:0 0 80px}
.pad-104-0-0{padding:104px 0 0}
.pad-116-0-71{padding:116px 0 71px}
.pad-117-0-107{padding:117px 0 107px}
.pad-120-0{padding:120px 0}
.pad-160-0{padding:160px 0}
.pad-60-0-0{padding:60px 0 0}
.pad-60-0-106{padding:60px 0 106px}
.pad-80-0{padding:80px 0}
.pad-started{padding:280px 0 120px}
.pad-started-c{padding:80px 0}
.pb-104{padding-bottom:104px}
.pb-112{padding-bottom:112px}
.pb-116{padding-bottom:116px}
.pb-96{padding-bottom:96px}
@media (max-width:760px){.mt-100{margin-top:50px}.mt-110{margin-top:55px}.mt-118{margin-top:59px}.mt-12{margin-top:16px}.mt-120{margin-top:60px}.mt-149{margin-top:74px}.mt-16{margin-top:16px}.mt-160{margin-top:80px}.mt-18{margin-top:16px}.mt-189{margin-top:94px}.mt-190{margin-top:95px}.mt-20{margin-top:16px}.mt-200{margin-top:100px}.mt-24{margin-top:16px}.mt-37{margin-top:18px}.mt-39{margin-top:20px}.mt-40{margin-top:20px}.mt-41{margin-top:20px}.mt-44{margin-top:22px}.mt-64{margin-top:32px}.mt-78{margin-top:39px}.mt-80{margin-top:40px}.mt-88{margin-top:44px}.mt-96{margin-top:48px}.mt-97{margin-top:48px}.pad-0{padding:0}.pad-0-0-120{padding:0 0 66px}.pad-0-0-121{padding:0 0 67px}.pad-0-0-130{padding:0 0 72px}.pad-0-0-226{padding:0 0 124px}.pad-0-0-80{padding:0 0 44px}.pad-104-0-0{padding:57px 0 0}.pad-116-0-71{padding:64px 0 39px}.pad-117-0-107{padding:64px 0 59px}.pad-120-0{padding:66px 0}.pad-160-0{padding:88px 0}.pad-60-0-0{padding:33px 0 0}.pad-60-0-106{padding:33px 0 58px}.pad-80-0{padding:44px 0}.pad-started{padding:80px 0 60px}.pad-started-c{padding:56px 0}.pb-104{padding-bottom:57px}.pb-112{padding-bottom:62px}.pb-116{padding-bottom:64px}.pb-96{padding-bottom:53px}}

.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.logostrip .track,.logos-row .track{animation:none!important}}
/* FAQ accordion */
.faq-list li{padding:0;border-bottom:1px solid var(--line)}
.faq-q{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:36px 0;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--sans);font-size:16px;line-height:24px;color:var(--ink)}
.faq-q .pm{position:relative;width:16px;height:16px;flex:none}
.faq-q .pm::before,.faq-q .pm::after{content:"";position:absolute;left:0;top:7.5px;width:16px;height:1px;background:var(--ink);transition:transform .35s var(--ease)}
.faq-q .pm::after{transform:rotate(90deg)}
.faq-q[aria-expanded="true"] .pm::after{transform:rotate(0)}
.faq-a{overflow:hidden;transition:height .4s var(--ease)}
.js .faq-a{height:0}
.faq-a p{padding:0 0 20px;font-size:16px;line-height:24px;color:var(--muted);max-width:572px}

@media (max-width:760px){
  .contact-grid{grid-template-columns:1fr;gap:32px}
  .form{padding:20px}
  .field{margin-bottom:12px}
  /* band-height corrections against the reference 390 table */
  .pad-120-0{padding:98px 0}
  .pad-120-0-200{padding:20px 0 40px}
  .pad-started{padding:24px 0 24px}
  .panelshot,.panelshot .plate{height:300px}
  .panelshot .shot{height:264px}
  .work-title{padding-top:100px}
  .feat{margin-top:40px}
  .feat li{padding:24px 0}
  .people{gap:48px}
  .cta{padding:260px 0 40px}
  .cta-fan{left:16px;right:16px;top:-260px;height:260px}
  .cta-fan .f1{left:6px;top:110px;width:150px;height:114px}
  .cta-fan .f2{left:68px;top:80px;width:152px;height:117px}
  .cta-fan .f3{left:146px;top:83px;width:148px;height:110px}
  .cta-panel{min-height:256px;padding:40px 16px 0}
  .cta-panel .btn{margin-top:32px}
  .foot-in{padding:40px 20px 0}
  .foot-grid{gap:32px}
  .foot-cols{gap:24px}
  .d1{letter-spacing:-1px}
}
.pad-68-0-68{padding:68px 0}
@media (max-width:760px){.pad-68-0-68{padding:36px 0 40px}}
.visual-400{height:400px}
@media (max-width:760px){.visual-400{height:180px}}
@media (max-width:760px){
  .pad-80-0{padding:120px 0}
  .pad-117-0-107{padding:150px 0 140px}
  .g-3{gap:88px}
  .numlist li{padding:24px 0}
}
.mt-240{margin-top:240px}
@media (max-width:760px){.mt-240{margin-top:48px}}
.pad-journal{padding:0}
@media (max-width:760px){
  .pad-journal{padding:0 0 68px}
  .pad-120-0-200{padding:0 0 10px}
  .tr-media{height:230px}
  .pb-96{padding-bottom:150px}
  .cards{gap:16px}
  .card-visual{margin-top:14px}
  .card-desc{padding:14px 0 16px}
}

/* per-band spacing (round 3, measured against the reference band table) */
.pad-stories{padding:0}
.pad-attorneys{padding:0}
.pad-numbers{padding:80px 0}
.pad-recognition{padding:0 0 120px}
.pad-community{padding:0 0 120px}
.pad-teamwork{padding:0 0 120px}
@media (max-width:760px){
  .pad-stories{padding:0 0 0}
  .pad-attorneys{padding:0 0 104px}
  .pad-numbers{padding:44px 0}
  .pad-recognition{padding:0 0 196px}
  .pad-community{padding:0 0 40px}
  .pad-teamwork{padding:0 0 0}
  .pad-started-c{padding:20px 0}
  .pad-80-0{padding:180px 0}
  .pad-117-0-107{padding:228px 0 218px}
  .pad-160-0{padding:120px 0}
  .pad-60-0-0{padding:33px 0 0}
  .step{padding:32px 0}
  .faq-q{padding:39px 0}
  .tr-media{height:160px}
  .cta{padding:260px 0 7px}
  .foot-in{padding:32px 20px 0}
  .foot-bot{margin-top:16px}
  .pb-112{padding-bottom:150px}
  .twocol{gap:32px}
  .twocol .shot{height:200px}
  .twocol h3{margin-top:20px}
}
/* round 3 band corrections */
.pad-recognition{padding:0 0 167px}
@media (max-width:760px){
  .pad-numbers{padding:128px 0}
  .pad-started-c{padding:0}
  .pad-started{padding:12px 0 12px}
  .panelshot,.panelshot .plate{height:290px}
  .panelshot .shot{height:254px}
  .pad-0-0-80{padding:0 0 167px}
  .pad-60-0-0{padding:0}
  .step{padding:24px 0}
  .pb-116{padding-bottom:86px}
  .pb-104{padding-bottom:92px}
  .faq-q{padding:45px 0}
  .pad-116-0-71{padding:24px 0 20px}
  .mt-189{margin-top:40px}
  .twocol .shot{height:160px}
  .twocol h3{margin-top:16px}
  .q{padding:20px}
  .q hr{margin:18px 0 20px}
  .foot-in{padding:20px 20px 0}
  .foot-cols{gap:16px}
  .socials{margin-top:16px}
  .pad-recognition{padding:0 0 196px}
}
.sub32{font-size:32px;line-height:40px}
.mt-88{margin-top:88px}
.mt-61{margin-top:61px}
@media (max-width:760px){
  .sub32{font-size:26px;line-height:32px}
  .mt-88{margin-top:28px}
  .mt-61{margin-top:24px}
  .lead-18{font-size:16px;line-height:24px}
}
@media (max-width:760px){
  .pad-60-0-0 .step{padding:14px 0}
  .pad-120-0-66{padding:96px 0 65px}
}
.pad-cases-c{padding:120px 0 200px}
.pad-cases-l{padding:120px 0 66px}
@media (max-width:760px){
  .pad-cases-c{padding:120px 0 200px}
  .pad-cases-l{padding:120px 0 125px}
}

/* tablet: stop the fixed desktop columns from flooring the layout */
@media (max-width:1279px){
  .foot-grid{grid-template-columns:minmax(0,1fr);gap:48px}
  .foot-cols{gap:24px}
  .cta-fan .f1,.cta-fan .f2,.cta-fan .f3{height:auto}
}

/* Client-name deviation (mobile only): the donor's 48px hero headline was sized for short
   words. A long single word (about 330px at 48px) was clipped by the hero frame on 360-375px
   phones. Scoped down to 42px under 400px; 401px and up keep the donor's type exactly. */
@media (max-width:400px){.hero-h1{font-size:42px;line-height:44px}}

/* ==========================================================================
   Revision round (approved deviations from the donor band, 2026-09-18)
   1 hero stack, 2 hero location bar rule, 3 practice tile photos visible at rest,
   4 feature cells tightened into one unit.
   ========================================================================== */

/* 1. Hero: headline, lead and CTA in one left-aligned stack, vertically centred.
      Donor type sizes and scrim unchanged; mobile keeps the donor's own stack. */
@media (min-width:761px){
  .hero-copy{display:flex;flex-direction:column;justify-content:center;padding:40px 40px 108px}
  .hero-h1{position:static;width:auto;max-width:544px;margin:0}
  .hero-side{position:static;width:auto;max-width:496px;margin-top:28px;text-align:left}
  .hero-side p{max-width:496px}
}

/* 2. Location bar: full-width hairline above it, paper at low alpha. */
.logostrip{left:0;right:0;bottom:0;padding:18px 40px;border-top:1px solid rgba(242,240,237,.28)}
@media (max-width:760px){
  .logostrip{left:0;right:0;bottom:0;height:auto;padding:14px 16px}
}

/* 3. Practice tiles: the donor parks the photo 219px below its window and only slides it
      in on hover, so every tile read as an empty white box on desktop. The photo now sits
      in its window at rest and the hover straightens and lifts it instead. */
.card-visual{overflow:hidden;border-radius:4px}
.card-visual img{transform:none}
.card:hover .card-visual img,.card:focus-visible .card-visual img{transform:scale(1.04)}

/* 4. Feature cells: icon, headline and copy as one unit per cell. */
.feat .ico{margin-bottom:16px}
.feat h3{margin-bottom:10px}

/* 5. Attorney portrait: real headshot, sized to the source rather than stretched. */
.arow{grid-template-columns:minmax(0,472px) minmax(0,1fr);gap:88px}
.arow .frame{max-width:472px;height:520px}
.arow .bio{max-width:620px;margin-top:72px}
.arow .plate{height:520px}
.arow .shot{left:60px;top:40px;height:472px}
.arow .shot img{object-position:50% 30%}
@media (max-width:1100px){
  .arow{grid-template-columns:1fr;gap:56px}
}
@media (max-width:760px){
  .arow .frame{height:auto;aspect-ratio:1/1;max-width:100%}
  .arow .plate{height:100%}
  .arow .shot{left:48px;top:32px;height:calc(100% - 32px)}
}

/* 2b. Location bar: the last two facts are dropped where the six no longer fit on one line. */
@media (min-width:761px) and (max-width:1179px){
  .logostrip .lg:nth-child(n+5){display:none}
}

/* 5b. Portrait plate: the donor's abstract texture reads as noise at this smaller frame,
   so the plate is a flat panel in the sample's dark green token instead. */
.arow .plate{background:var(--dark)}

/* ==========================================================================
   Header variants (preview pages nav-a/b/c). Sample tokens only:
   Fraunces + Public Sans, --paper / --paper-2 / --ink / --dark / --mint / --line,
   6px button radius. Mobile collapses to the sample's existing menu.
   ========================================================================== */
.hdr .strip{background:#1E2C2A;color:var(--mint)}
.strip-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:100%}
.strip-in p{display:flex;align-items:center;gap:8px;font-size:12px;line-height:18px;letter-spacing:.2px;color:rgba(204,217,215,.92);white-space:nowrap}
.strip-in svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.4}
.strip-in a{color:#fff}
.strip-in a:hover{text-decoration:underline}
.brand-stack{display:flex;flex-direction:column;gap:3px}
.brand-stack .tag{font-family:var(--sans);font-size:10px;line-height:14px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted)}
.mono{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin-right:12px;border:1px solid rgba(245,245,245,.5);border-radius:2px;font-family:var(--display);font-size:14px;letter-spacing:.6px}
.mono-box{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;margin-right:14px;background:var(--dark);color:var(--light);border-radius:4px;font-family:var(--display);font-size:15px;letter-spacing:.6px}
.brand .mk{width:30px;height:30px;margin-right:12px;fill:none;stroke:var(--mint);stroke-width:1.2;flex:none}
.hdr-phone{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.hdr-cta{font-size:14px;line-height:21px;letter-spacing:.2px;white-space:nowrap;position:relative}
.hdr-cta::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:1px;background:currentColor;transition:right .4s var(--ease)}
.hdr-cta:hover::after{right:0}

/* A: single dark bar */
.nav-a .hdr{background:var(--dark)}
.nav-a .brand{display:inline-flex;align-items:center;color:var(--light)}
.nav-a .nav a{color:var(--light)}
.nav-a .nav a::after{background:var(--light)}
.nav-a .burger span,.nav-a .burger span::before,.nav-a .burger span::after{background:var(--light)}

/* B: utility strip + tagline bar, labelled phone, text CTA */
.nav-b{--hdr:112px}
.nav-b .hdr{background:var(--dark)}
.nav-b .hdr .strip{height:36px}
.nav-b .hdr-in{height:76px;gap:32px;justify-content:flex-start}
.nav-b .brand{display:inline-flex;align-items:center;color:var(--light);font-size:23px}
.nav-b .brand-stack .tag{color:var(--mint)}
.nav-b .nav{position:static;transform:none;margin-left:auto;gap:28px}
.nav-b .nav a{color:var(--light)}
.nav-b .nav a::after{background:var(--light)}
.nav-b .hdr-phone{flex-direction:column;align-items:flex-start;gap:1px}
.nav-b .hdr-phone .lbl{font-size:10px;line-height:14px;letter-spacing:1.4px;text-transform:uppercase;color:var(--mint)}
.nav-b .hdr-phone .num{font-family:var(--display);font-size:19px;line-height:24px;letter-spacing:-.4px;color:var(--light)}
.nav-b .hdr-cta{color:var(--light)}
.nav-b .burger span,.nav-b .burger span::before,.nav-b .burger span::after{background:var(--light)}

/* C: dark utility strip + light bar with a boxed monogram */
.nav-c{--hdr:118px}
.nav-c .hdr{background:var(--paper);border-bottom:1px solid var(--line)}
.nav-c .hdr .strip{height:40px}
.nav-c .hdr-in{height:78px;gap:32px;justify-content:flex-start}
.nav-c .brand{display:inline-flex;align-items:center;font-size:23px}
.nav-c .nav{position:static;transform:none;margin-left:auto;gap:28px}
.nav-c .hdr-phone{font-size:15px;color:var(--ink);font-weight:500}
.nav-c .hdr-phone svg{width:16px;height:16px;fill:none;stroke:var(--dark);stroke-width:1.4}
.nav-c .hdr-phone:hover{color:var(--dark);text-decoration:underline}

@media (max-width:1279px){
  .nav-b .nav,.nav-c .nav{gap:20px}
  .nav-b .hdr-in,.nav-c .hdr-in{gap:20px}
}
@media (max-width:1100px){
  .nav-b .brand-stack .tag,.nav-c .brand-stack .tag{display:none}
  .nav-b .hdr-cta{display:none}
}
@media (max-width:760px){
  .nav-a,.nav-b,.nav-c{--hdr:64px}
  .nav-b .hdr .strip,.nav-c .hdr .strip{display:none}
  .nav-b .hdr-in,.nav-c .hdr-in{height:64px;justify-content:space-between}
  .nav-b .hdr-phone,.nav-c .hdr-phone{display:none}
  .nav-b .brand-stack .tag,.nav-c .brand-stack .tag{display:none}
}

/* ==========================================================================
   Revision round 2 (2026-09-18): tile and portrait fill, guide stack,
   header ladder, and a full responsive pass 1512 -> 390.
   ========================================================================== */

/* R2.1 practice tile photo fills the card edge to edge */
.card-visual{margin:19px -24px 0;width:auto;max-width:none}
.card-desc{left:0;right:0;bottom:0;padding:24px 24px 26px}
.card-desc p{max-width:none}

/* R2.2 portrait fills its frame, no plate margin */
.arow .shot{left:0;top:0;right:0;height:100%}

/* R2.4 guides: image, then title, then meta, tight */
.post .shot{margin-top:0}
.post h3{min-height:0;margin-top:20px}
.post .meta{margin-top:8px}

/* R2.5 header ladder: full nav, compact nav, then the mobile menu */
@media (min-width:761px) and (max-width:1179px){
  .nav{position:static;transform:none;margin-left:auto;gap:24px}
  .hdr-in{gap:20px}
}
@media (min-width:761px) and (max-width:899px){
  .hdr-in .btn{display:none}
}
@media (max-width:1099px){
  .nav-b .nav,.nav-c .nav,.nav-b .hdr-phone,.nav-c .hdr-phone,
  .nav-b .hdr-cta,.nav-c .hdr-in .btn{display:none}
  .nav-b .burger,.nav-c .burger{display:flex}
  .nav-b .menu,.nav-c .menu{display:block}
  .nav-b .hdr-in,.nav-c .hdr-in{justify-content:space-between}
}
@media (max-width:899px){
  .nav-b .hdr .strip p:first-child,.nav-c .hdr .strip p:first-child{overflow:hidden;text-overflow:ellipsis}
}

/* R2.6 responsive pass */
/* fact strip: five 72px words never fit five columns under 1180 */
@media (min-width:1280px) and (max-width:1399px){
  .stats .v{font-size:64px;line-height:70px;letter-spacing:-2.4px}
}
@media (min-width:761px) and (max-width:1279px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 0}
  .stats li{border-left:0;padding:0 20px 0 0}
  .stats li:first-child{padding-left:0}
  .stats .v{font-size:56px;line-height:62px;letter-spacing:-2px}
}
/* practice tiles: 3 up, then 1. A 2-up grid always orphans the 7th tile. */
@media (min-width:900px) and (max-width:1100px){
  .g-cards4{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
  .g-span2{grid-column:1/3}
  .cards{gap:24px}
}
@media (max-width:899px){
  .g-cards4{grid-template-columns:1fr;gap:24px}
  .g-span2{grid-column:1/-1}
}
/* three questions and three guides stay three up until the mobile carousel */
@media (min-width:761px){
  .cases{grid-template-columns:repeat(3,minmax(0,1fr))}
  .posts{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1100px){
  .post .shot{height:200px}
  .cases{gap:24px}
}
/* portrait frame keeps filling at every width */
@media (max-width:1100px){
  .arow{grid-template-columns:1fr;gap:48px}
  .arow .frame{max-width:472px;height:500px}
  .arow .shot{left:0;top:0;width:100%;height:100%}
}
@media (max-width:760px){
  .arow .frame{height:auto;aspect-ratio:4/5;max-width:100%}
  .arow .plate{height:100%}
  .arow .shot{left:0;top:0;width:100%;height:100%}
  .card-visual{margin:19px -24px 0;width:auto}
  .card-desc{padding:18px 0 20px}
  .post .shot{height:200px}
}

/* R2.7 mobile alignment nits found in the 390 read */
@media (max-width:760px){
  .feat li:first-child{padding-left:0}
  .stats .k{min-height:36px}
  .foot-cols h2{min-height:65px}
}


/* ==========================================================================
   Revision round 3 (2026-09-18): pre-footer photo fan centring and the footer notch.
   ========================================================================== */

/* R3.1 The photo fan is centred on the CTA panel at every width. The donor's three
   percentage positions left a 12.1875%/12.5% asymmetry, and the mobile rule anchored a
   330px box to the left gutter. */
.cta-fan{margin-inline:auto}
@media (max-width:760px){
  /* the rotated bounding boxes hang 25px further right than the layout boxes, so the
     trio is nudged back by 25px to put the visual union on the panel's centre line */
  .cta-fan{max-width:308px}
  .cta-fan .f1{left:-10px}
  .cta-fan .f2{left:66px}
  .cta-fan .f3{left:168px}
}

/* R3.2 Footer notch: same ground as the footer panel (the panel carries a 20% noise
   overlay, so flat --dark read a shade darker), and the shape height matches the
   footer's padding band at every width so the angle meets the panel with no gap. */
.foot-shape{background-color:var(--dark)}
.foot-shape::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.20;background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIj48ZmlsdGVyIGlkPSJuIj48ZmVUdXJidWxlbmNlIHR5cGU9ImZyYWN0YWxOb2lzZSIgYmFzZUZyZXF1ZW5jeT0iLjg1IiBudW1PY3RhdmVzPSIzIi8+PC9maWx0ZXI+PHJlY3Qgd2lkdGg9IjEyMCIgaGVpZ2h0PSIxMjAiIGZpbHRlcj0idXJsKCNuKSIgb3BhY2l0eT0iLjUiLz48L3N2Zz4=")}
@media (max-width:760px){
  .foot{padding-top:42px}
  .foot-shape{top:-42px}
}
/* eight practice tiles. The intro block takes one cell (was two) so intro + 8 tiles fill the 3 x 3 grid exactly. */
@media (min-width:900px){.g-cards4 .g-span2{grid-column:auto}}

/* ==========================================================================
   Phase 2b (2026-09-26): inner pages restored to the LIVE original's geometry
   (the reference template, measured at 1440 / 930 / 390). Scoped to inner pages;
   the owner-approved homepage is untouched.
   ========================================================================== */
/* hero: the original's H1-to-lead gap at 390 is 48px (clone had 74, pass 1 had 0) */
@media (max-width:760px){.g-hero3 .mt-149{margin-top:48px}}

/* page-hero photo bleeds to the frame rules like the original (1360 wide at 1440; the clone inset it to 1280) */
@media (min-width:761px){body:not(.page-home) .phero-visual{margin-inline:-40px}}

/* service-detail description: photo 640 x 584 (original), sticky beside the longer column */
body:not(.page-home) .twocol .shot{height:584px}
body:not(.page-home) .twocol .steps-stick{top:108px}

/* attorney row: original frame 614 x 640, textured plate, photo inset 535 x 563 at +80 / +77 */
body:not(.page-home) .arow .plate{background:none}
@media (min-width:1101px){
  body:not(.page-home) .arow{grid-template-columns:minmax(0,614px) minmax(0,1fr);gap:96px;margin-top:80px}
  body:not(.page-home) .arow .frame{max-width:614px;height:640px}
  body:not(.page-home) .arow .plate{height:640px}
  body:not(.page-home) .arow .shot{left:80px;top:77px;right:auto;width:calc(100% - 79px);max-width:535px;height:563px}
  body:not(.page-home) .arow .bio{margin-top:132px}
  .twocol.tc-ledger{grid-template-columns:minmax(0,640px) minmax(0,525px);justify-content:space-between;align-items:center}
  .twocol.tc-ledger .shot{height:640px}
}

/* about: habit cards (original: three boxed cards) and the ledger band (list left, 525 x 640 photo right) */
.vals.vals-3{grid-template-columns:repeat(3,minmax(0,1fr))}

/* contact: her real email is longer than the original's placeholder and set a min-content floor at 390 */
.cinfo .v a{overflow-wrap:anywhere}

/* tab set: our tab copy fills the original's .cases min-height slack, so the band keeps the original's
   visible gap (about 244px from the last tab link to the next eyebrow) with explicit bottom padding */
@media (min-width:761px){body:not(.page-home) .pad-cases-l{padding-bottom:222px}}

/* logo row on paper (hub + about heroes): pass 1 left its items unstyled, so each SVG grew to 91px and pushed the
   label out of the 24px row. Same recipe as the clone's .logostrip.on-paper items. */
.logos-row .lg{display:inline-flex;align-items:center;gap:10px;font-size:18px;line-height:24px;font-weight:500;color:var(--ink);letter-spacing:-.2px;white-space:nowrap}
.logos-row .lg svg{width:20px;height:20px;flex:none}
@media (min-width:761px) and (max-width:1179px){.logos-row .lg:nth-child(n+5){display:none}}

/* tab-set button: right on desktop and tablet, left on phones (original) */
.ta-r{text-align:right}

/* tablet 761 to 1100: the original keeps description, attorney row, FAQ and tabs in columns */
@media (min-width:761px) and (max-width:1100px){
  body:not(.page-home) .g-hero3{grid-template-columns:minmax(0,460px) minmax(0,270px);justify-content:space-between;gap:40px}
  body:not(.page-home) .g-hero3 .mt-149{margin-top:56px}
  body:not(.page-home) .g-hero2{grid-template-columns:minmax(0,458px) minmax(0,280px);justify-content:space-between;gap:40px}
  body:not(.page-home) .phero .d1{font-size:60px;line-height:64px}
  body:not(.page-home) .phero-visual{height:250px}
  body:not(.page-home) .spec li{padding:24px 20px}
  body:not(.page-home) .spec .v{font-size:20px;line-height:26px;letter-spacing:-.5px}
  body:not(.page-home) .arow .acts{flex-direction:column;gap:16px}
  body:not(.page-home) .twocol{grid-template-columns:minmax(0,1fr) minmax(0,385px);gap:35px}
  body:not(.page-home) .twocol .shot{height:380px}
  .twocol.tc-ledger{grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:40px}
  .twocol.tc-ledger .shot{height:420px}
  body:not(.page-home) .faq{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  body:not(.page-home) .arow{grid-template-columns:minmax(0,370px) minmax(0,1fr);gap:40px;align-items:start}
  body:not(.page-home) .arow .frame{height:360px}
  body:not(.page-home) .arow .plate{height:360px}
  body:not(.page-home) .arow .shot{left:48px;top:43px;width:calc(100% - 48px);height:317px}
  body:not(.page-home) .arow .bio{margin-top:40px}
  body:not(.page-home) .cases{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
  .vals.vals-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
}
@media (max-width:760px){
  .ta-r{text-align:left}
  body:not(.page-home) .twocol.tc-detail > :last-child{order:-1}
  body:not(.page-home) .twocol .shot{height:300px}
  .twocol.tc-ledger .shot{height:420px}
  body:not(.page-home) .arow .frame{height:auto;aspect-ratio:1/1;max-width:100%}
  body:not(.page-home) .arow .plate{height:100%}
  body:not(.page-home) .arow .shot{left:48px;top:32px;width:calc(100% - 48px);height:calc(100% - 32px)}
  body:not(.page-home) .arow .bio{margin-top:24px}
  .vals.vals-3{grid-template-columns:1fr}
}

/* counters on inner pages: the non-numeric words (Private, Local) outgrow a fifth of the frame below 1440 */
@media (min-width:761px){.stats .v{font-size:min(72px,3.8vw);line-height:1.1}}
@media (max-width:760px){.stats .v{font-size:40px;line-height:44px}}
@media (max-width:420px){.cinfo .v{font-size:16px;line-height:24px}}

/* tablet 761 to 1100: the original also keeps how-we-started, the sticky-heading step lists and the habit cards in columns */
@media (min-width:761px) and (max-width:1100px){
  body:not(.page-home) .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  body:not(.page-home) .panelshot,body:not(.page-home) .panelshot .plate{height:440px}
  body:not(.page-home) .panelshot .shot{left:40px;top:40px;width:calc(100% - 40px);height:400px}
  body:not(.page-home) .split > div[style*="padding-top"]{padding-top:0!important}
  body:not(.page-home) .split .lead{margin-top:32px!important}
  body:not(.page-home) .steps{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  .vals.vals-3{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
}
