/* ================================================================
   NLC Law Asia LLC · "The Monolith" design system · iteration 3
   One deep ink field, graded like a room at dusk with a single warm
   lamp in it: warm token ramp, per-section temperature, additive
   haze, brass as material, one lacquer-seal accent.
   ================================================================ */

/* ---- TO CONFIRM markers (removed at launch) ---- */
.tc{background:rgba(201,164,105,.10);border:1px solid rgba(201,164,105,.38);border-radius:999px;padding:1px 9px;font-size:.6em;font-style:normal;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#DBC08D;white-space:nowrap;vertical-align:middle;position:relative;top:-.12em}
.tc::before{content:"confirm \00B7 ";opacity:.75}
.tc.bare::before{content:"confirm";opacity:.9}

/* ---- Tokens ---- */
:root{
  --ink:#0B1118;
  --ink-well:#070C12;
  --ink-2:#101A23;
  --panel:#18242F;
  --ink-warm:#141A1C;

  --text:#F1ECE3;
  --text-2:#D8D1C5;
  --muted:#A89D90;
  --muted-cool:#7C8B96;
  --faint:#6E665E;

  --hair:#22303C;
  --hair-lit:rgba(242,221,176,.055);

  --brass:#C9A469;
  --brass-hi:#F2DDB0;
  --brass-lo:#8A6C3C;
  --brass-mat:linear-gradient(103deg,#8A6C3C 0%,#C9A469 20%,#F2DDB0 40%,#C9A469 57%,#9A7844 76%,#E3C78F 100%);

  --glow-lamp:rgba(214,168,96,.16);
  --glow-brass:rgba(201,164,105,.13);
  --glow-cool:rgba(96,140,180,.10);
  --haze:rgba(233,214,180,.055);

  --seal:#7E2B24;

  --rail:62px;
  --mast:88px;
  --pad:clamp(22px,5.2vw,96px);
  --ease:cubic-bezier(.2,.7,.3,1);
  color-scheme:dark;
  scrollbar-color:#22303C #0B1118;
}
::selection{background:var(--brass);color:#08111A}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--ink);color:var(--text);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:300;font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;font-optical-sizing:auto;
}
p{text-wrap:pretty}
h1,h2,h3{text-wrap:balance;margin:0;font-weight:400}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.meta{color:var(--muted);font-size:13px;line-height:1.7}

/* ---- Film grain: kills banding in the dark field, adds tooth ---- */
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:101;
  opacity:.035;mix-blend-mode:overlay;
  background-repeat:repeat;background-size:160px 160px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
}

/* ---- Fraunces optical sizing, pinned per role ---- */
.hero h1,.page-head h1{font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0}
.h-display,.pd h2,.prose h2,.person .pname,.pa h3,.pa .ghost,.pd .ghost{
  font-variation-settings:"opsz" 96,"SOFT" 0,"WONK" 0;
}
.brand .brand-word{font-variation-settings:"opsz" 24,"SOFT" 0,"WONK" 0}
/* italics get the wonky cut: the one place the serif is allowed a voice */
.page-head h1 em{font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1}
.h-display em,.prose h2 em{font-variation-settings:"opsz" 96,"SOFT" 0,"WONK" 1}

/* ---- Brass as material ---- */
.brass-mat{
  background-image:var(--brass-mat);background-size:240% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  transition:background-position .8s var(--ease);
}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .slabel,.fgrid h4,.cdetail dt,.bio-aside dt,form label,.hero-cta b,.cta b{
    background-image:var(--brass-mat);background-size:240% 100%;
    -webkit-background-clip:text;background-clip:text;color:transparent;
    transition:background-position .8s var(--ease);
    /* text-shadow paints over clipped-text backgrounds, so engrave with a filter */
    text-shadow:none;filter:drop-shadow(0 1px 0 rgba(0,0,0,.55));
  }
  .hero-cta:hover b,.hero-cta:focus-visible b,.cta:hover b,.cta:focus-visible b{background-position:100% 0}
}

/* ---- Engraved small caps ---- */
.slabel,.crumb,.fgrid h4,.bio-aside dt,.cdetail dt,form label{
  text-shadow:0 1px 0 rgba(0,0,0,.55),0 -1px 0 rgba(255,247,230,.045);
}

/* ---- Accessibility ---- */
:focus-visible{outline:2px solid var(--brass);outline-offset:3px}
/* the shell target takes focus programmatically after a skip link; no ring on it */
main[tabindex]:focus{outline:none}
/* visually hidden, still read: used for the enquiry fieldset legend */
.vh{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}
.skip{position:absolute;left:-9999px}
.skip:focus{
  left:var(--rail);top:0;z-index:200;padding:14px 20px;
  background:var(--brass);color:#0B1118;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
}

/* ---- Fixed left rail ---- */
.rail{
  position:fixed;left:0;top:0;bottom:0;width:var(--rail);z-index:120;
  border-right:1px solid var(--hair);background:var(--ink);
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  padding:20px 0 22px;
}
/* scroll thread: a brass filament that fills as the page is read */
.rail::after{content:"";position:absolute;right:0;top:130px;width:1px;height:calc(100% - 150px);transform-origin:top;transform:scaleY(0);background:linear-gradient(180deg,rgba(242,221,176,.7),rgba(201,164,105,.35) 55%,rgba(201,164,105,0));z-index:0}
.rail-word,.rail-index{position:relative;z-index:1}
.rail-mark{
  width:10px;height:10px;
  background-image:var(--brass-mat);background-size:220% 100%;
  box-shadow:
    inset 0 1px 0 rgba(255,247,230,.42),
    inset 0 -1px 0 rgba(0,0,0,.45),
    0 0 20px 2px rgba(201,164,105,.20);
}
@keyframes mark-sheen{from{background-position:0% 0}to{background-position:100% 0}}
@media (prefers-reduced-motion:no-preference){
  .rail-mark{animation:mark-sheen 11s var(--ease) infinite alternate}
}
.rail-word{
  writing-mode:vertical-rl;transform:rotate(180deg);
  font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;gap:14px;
}
.rail-word i{font-style:normal;color:var(--muted-cool);letter-spacing:.32em}
.rail-index{display:flex;flex-direction:column;align-items:center;gap:14px}
.rail-index a{
  display:flex;align-items:center;justify-content:center;width:26px;height:26px;
  font-size:9px;letter-spacing:.08em;color:var(--muted-cool);position:relative;
  transition:color .22s var(--ease);
}
.rail-index a::after{
  content:"";position:absolute;left:50%;bottom:-1px;width:10px;height:1px;margin-left:-5px;
  background:var(--brass);transform:scaleX(0);transform-origin:left;
  transition:transform .26s var(--ease);
}
.rail-index a:hover,.rail-index a:focus-visible{color:var(--brass)}
.rail-index a:hover::after,.rail-index a:focus-visible::after{transform:scaleX(1)}
.rail-index a[aria-current="page"]{color:var(--brass-hi)}
.rail-index a[aria-current="page"]::after{transform:scaleX(1)}
/* seal red, use 2 of 3: the reader's own position */
.rail-index a[aria-current="page"]::before{
  content:"";position:absolute;left:0;top:50%;margin-top:-1.5px;
  width:3px;height:3px;background:var(--seal);
}

/* ---- Shell / sections ---- */
/* the shell is a column so the footer is pushed to the floor on short pages */
.shell{margin-left:var(--rail);display:flex;flex-direction:column;min-height:100svh}
.shell > main{flex:1 0 auto}
section{padding-inline:var(--pad);position:relative}
/* graded rule: brass at the spine, hairline across, dissolving at the right */
section::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;z-index:2;
  background:linear-gradient(90deg,
    rgba(201,164,105,.46) 0%,
    rgba(201,164,105,.10) 6%,
    var(--hair) 16%,
    var(--hair) 70%,
    rgba(34,48,60,0) 100%);
}
.panel{
  background:
    radial-gradient(140% 96% at 50% -6%,rgba(201,164,105,.075),rgba(201,164,105,0) 54%),
    linear-gradient(180deg,#18242F,#121B24);
}
.tone{background:linear-gradient(180deg,#101A23,#0C131A)}
.wrap{max-width:1240px;margin:0 auto;width:100%}
.slabel{
  display:flex;align-items:baseline;gap:14px;
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);
  margin-bottom:clamp(28px,4vw,52px);
}
.slabel .sn{color:var(--muted-cool)}
.slabel em{font-style:normal;color:var(--muted);letter-spacing:.2em}

/* ---- Masthead + wordmark ---- */
.mast{
  padding:26px var(--pad);border-bottom:1px solid var(--hair);
  position:sticky;top:0;z-index:110;
}
@keyframes mast-glass{
  from{background:rgba(11,17,24,0);-webkit-backdrop-filter:blur(0px) saturate(1);backdrop-filter:blur(0px) saturate(1)}
  to{background:rgba(11,17,24,.85);-webkit-backdrop-filter:blur(16px) saturate(1.05);backdrop-filter:blur(14px) saturate(1.05)}
}
@supports (animation-timeline:scroll()){
  .mast{
    animation:mast-glass linear both;
    animation-timeline:scroll(root block);
    animation-range:0 120px;
  }
}
.mast-inner{display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:14px}
.brand .brand-word{font-family:Fraunces,Georgia,serif;font-size:19px;font-weight:400;letter-spacing:.01em}
.brand u{text-decoration:none;color:var(--muted);font-size:.62em;letter-spacing:.22em;
  text-transform:uppercase;margin-left:8px;vertical-align:middle}
nav.primary{display:flex;gap:clamp(18px,2.6vw,40px);flex-wrap:wrap}
nav.primary a{
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#B3A99B;
  padding:6px 0 8px;position:relative;transition:color .2s var(--ease);
}
/* two-phase underline: enters from the left, leaves to the right */
nav.primary a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--brass);
  transform:scaleX(0);transform-origin:right;transition:transform .26s var(--ease);
}
nav.primary a:hover,nav.primary a:focus-visible{color:var(--text)}
nav.primary a:hover::after,nav.primary a:focus-visible::after{transform:scaleX(1);transform-origin:left}
nav.primary a[aria-current="page"]{color:var(--text)}
nav.primary a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}

/* ---- Home hero ---- */
.hero{
  padding-block:clamp(76px,13vw,168px) clamp(56px,8vw,112px);
  position:relative;overflow:hidden;
  background:
    radial-gradient(120% 78% at 10% -14%,var(--glow-brass),rgba(201,164,105,0) 56%),
    radial-gradient(86% 58% at 90% 4%,var(--glow-cool),rgba(96,140,180,0) 60%),
    linear-gradient(178deg,#0D141C,#0B1118 64%);
}
.hero-media{position:absolute;inset:0;z-index:0}
.hero-media video,.hero-media img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(1.06) contrast(1.05) brightness(.6);
}
.hero-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,17,24,.55),rgba(11,17,24,.72) 60%,rgba(11,17,24,.92));
}
.hero .wrap{position:relative;z-index:1}
.hero h1{
  font-family:Fraunces,Georgia,serif;
  font-weight:230;font-size:clamp(40px,7.6vw,104px);
  line-height:.98;letter-spacing:-.03em;max-width:16ch;
}
.hero h1 span{display:block}
.hero h1 span > i{display:block;font-style:normal}
.hero h1 b{font-weight:520;color:#FFFCF5}
.hero h1 em{
  font-style:italic;font-weight:250;color:#E4D9C4;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;
}
@media (min-width:900px){
  .hero h1{max-width:none}
  .hero h1 span > i{white-space:nowrap}
}
.lede{
  margin:clamp(30px,4vw,50px) 0 0;max-width:62ch;color:#B7AC9E;
  font-size:clamp(15px,1.35vw,18px);line-height:1.75;
}
.hero-cta{
  display:inline-flex;align-items:center;gap:14px;margin-top:clamp(30px,4vw,48px);
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--text);
  border-bottom:1px solid var(--hair);padding-bottom:10px;
  transition:border-color .24s var(--ease),color .24s var(--ease),gap .24s var(--ease);
}
.hero-cta b{color:var(--brass);font-weight:400;transition:transform .24s var(--ease)}
.hero-cta:hover,.hero-cta:focus-visible{border-color:var(--brass);gap:20px}
.hero-cta:hover b,.hero-cta:focus-visible b{transform:translateX(3px)}
.evidence{
  margin-top:clamp(52px,8vw,104px);padding-top:26px;border-top:1px solid var(--hair);
  display:flex;flex-wrap:wrap;align-items:baseline;gap:10px 26px;
  position:relative;padding-left:18px;
  box-shadow:0 -1px 0 var(--hair-lit);
}
/* seal red, use 1 of 3: the record itself */
.evidence::before{content:"";position:absolute;left:0;top:0;width:2px;height:100%;background:var(--seal)}
.evidence h2{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--brass);margin-right:6px}
.ev-label{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--brass);margin:0 6px 0 0}
.evidence ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 22px;margin:0;padding:0}
.evidence li{
  font-variant-numeric:tabular-nums;font-size:15px;color:var(--text-2);letter-spacing:.03em;
  transition:color .22s var(--ease),transform .22s var(--ease);
}
.evidence li:hover{color:var(--brass-hi);transform:translateY(-1px)}
.h-display + .evidence{margin-top:clamp(26px,3vw,40px)}
.evidence + .meta{margin:14px 0 0;max-width:66ch}
/* additive haze at the top of the field, subtractive falloff at the edges */
.vignette{
  position:fixed;inset:0;pointer-events:none;z-index:100;
  background:
    radial-gradient(52% 34% at 50% -4%,var(--haze),rgba(233,214,180,0) 72%),
    radial-gradient(120% 90% at 50% 40%,rgba(0,0,0,0) 48%,rgba(0,0,0,.26) 100%);
}

/* ---- Interior page head ---- */
.page-head{padding-block:clamp(56px,9vw,120px) clamp(40px,6vw,72px)}
.page-head .crumb{
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass);
  margin:0 0 clamp(20px,3vw,34px);display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;
}
.page-head .crumb a{color:var(--muted);transition:color .2s var(--ease)}
.page-head .crumb a:hover,.page-head .crumb a:focus-visible{color:var(--brass)}
.page-head h1{
  font-family:Fraunces,Georgia,serif;font-weight:320;letter-spacing:-.028em;line-height:1.02;
  font-size:clamp(36px,6.4vw,84px);
}
.page-head h1 em{font-style:italic;font-weight:250;color:#E4D9C4}
.page-head .lede{margin-top:clamp(22px,3vw,36px)}

/* ---- Generic content sections / prose ---- */
.body-sec{padding-block:clamp(56px,8vw,112px)}
.prose{max-width:66ch}
.prose p{margin:0 0 22px;font-size:clamp(15px,1.3vw,17.5px);line-height:1.75;color:var(--text-2)}
.prose p:last-child{margin-bottom:0}
.prose h2{
  font-family:Fraunces,Georgia,serif;font-weight:360;letter-spacing:-.018em;
  font-size:clamp(23px,2.4vw,32px);margin:clamp(40px,5vw,60px) 0 18px;
  padding-top:clamp(28px,3.6vw,42px);border-top:1px solid var(--hair);
}
.prose h2:first-child{margin-top:0;padding-top:0;border-top:0}
.prose h3{
  font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--brass);
  font-weight:500;margin:34px 0 14px;
}
.prose ul{list-style:none;margin:0 0 22px;padding-left:0;color:var(--text-2)}
.prose li{position:relative;padding-left:26px;margin-bottom:14px;font-size:15px;line-height:1.75;max-width:66ch}
.prose li::before{
  content:"";position:absolute;left:0;top:.78em;width:12px;height:1px;
  background:var(--brass);opacity:.55;
}
.prose ul.cites li{
  font-variant-numeric:tabular-nums;padding-left:0;
  border-top:1px solid var(--hair);padding-top:12px;max-width:74ch;
}
.prose ul.cites li::before{display:none}
.prose ul.cites li:first-child{border-top:0;padding-top:0}
.prose .meta{color:var(--muted);font-size:13px;line-height:1.7}
.prose.standing{margin-top:26px}

/* ---- Section heading (Fraunces, used on home/about/practices/people) ---- */
.h-display{
  font-family:Fraunces,Georgia,serif;font-weight:330;letter-spacing:-.02em;
  font-size:clamp(32px,5.2vw,72px);line-height:1.02;
}

/* ---- About / services ---- */
.about{padding-block:clamp(64px,9vw,128px)}
.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(30px,6vw,90px)}
.about p{margin:0 0 26px;font-size:clamp(15px,1.3vw,18px);line-height:1.8;color:var(--text-2)}
.about p:last-child{margin-bottom:0}
.services{
  list-style:none;margin:34px 0 26px;padding:26px 0 0;border-top:1px solid var(--hair);
  box-shadow:0 -1px 0 var(--hair-lit);
  display:flex;flex-wrap:wrap;gap:8px 0;
}
.services li{
  position:relative;padding-left:0;margin-bottom:0;max-width:none;
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);line-height:1.6;
}
.services li::before{display:none}
.services li:not(:last-child)::after{content:"\00B7";margin:0 12px;color:var(--faint)}

/* ---- Practice roster (home) + practice detail (practices page) ---- */
.practices{
  padding-block:clamp(64px,9vw,128px);
  background:linear-gradient(180deg,#0B1118,#0D151E 46%,#0B1118);
}
.practices .h-display,.people .h-display{margin-bottom:clamp(34px,5vw,64px)}
.roster{
  display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(34px,5vw,86px);
  border-top:1px solid var(--hair);box-shadow:0 -1px 0 var(--hair-lit);
}
.pa{
  position:relative;padding:clamp(26px,3vw,40px) 0 clamp(24px,2.6vw,36px);
  border-bottom:1px solid var(--hair);isolation:isolate;display:block;
  --mx:50%;transition:background .35s var(--ease);
}
.pa:hover,.pa:focus-within{
  background:radial-gradient(320px 320px at var(--mx) 50%,rgba(201,164,105,.075),transparent 72%);
}
.pa .ghost{
  position:absolute;left:-.02em;top:50%;transform:translateY(-52%);
  font-family:Fraunces,Georgia,serif;font-weight:400;font-variant-numeric:tabular-nums;
  font-size:clamp(70px,9vw,120px);line-height:1;letter-spacing:-.04em;
  color:var(--brass);opacity:.07;z-index:-1;pointer-events:none;
  text-shadow:0 2px 0 rgba(0,0,0,.6);
  transition:opacity .28s var(--ease),transform .38s var(--ease);
}
.pa h3{
  font-family:Fraunces,Georgia,serif;font-weight:400;font-size:clamp(19px,1.75vw,25px);
  letter-spacing:-.012em;line-height:1.2;transition:color .22s var(--ease);
}
.pa p{margin:9px 0 0;color:var(--muted);font-size:14px;line-height:1.65;max-width:46ch}
.pa .ul{
  position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--brass);
  transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);
}
.pa:hover .ghost,.pa:focus-within .ghost{opacity:.22;transform:translateY(-54%)}
.pa:hover .ul,.pa:focus-within .ul{transform:scaleX(1)}
.pa:hover h3,.pa:focus-within h3{color:#FFFDF8}

/* Practice jump index (practices.html): a static contents leaf, not a sticky bar */
.pindex{
  list-style:none;margin:clamp(30px,4.2vw,52px) 0 0;padding:22px 0 0;
  border-top:1px solid var(--hair);box-shadow:0 -1px 0 var(--hair-lit);
  display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  gap:0 clamp(24px,4vw,60px);
}
.pindex a{
  display:flex;gap:14px;padding:10px 0;
  font-size:12.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);
  transition:color .2s var(--ease);
}
.pindex a:hover,.pindex a:focus-visible{color:var(--brass)}
.pindex .n{color:var(--muted-cool);font-variant-numeric:tabular-nums}

/* Practice detail blocks (practices.html) */
.pd{
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);
  gap:16px clamp(30px,5vw,80px);
  padding:clamp(34px,4.6vw,60px) 0;border-bottom:1px solid var(--hair);
  scroll-margin-top:calc(var(--mast) + clamp(16px,2vw,28px));
  position:relative;isolation:isolate;
  --mx:50%;transition:background .35s var(--ease);
}
.pd:hover{background:radial-gradient(320px 320px at var(--mx) 50%,rgba(201,164,105,.075),transparent 72%)}
.pd .ghost{
  position:absolute;right:0;top:18px;
  font-family:Fraunces,Georgia,serif;font-variant-numeric:tabular-nums;
  font-size:clamp(56px,7vw,96px);line-height:1;letter-spacing:-.04em;
  color:var(--brass);opacity:.07;z-index:-1;pointer-events:none;
  text-shadow:0 2px 0 rgba(0,0,0,.6);
  transition:opacity .28s var(--ease);
}
.pd h2{
  font-family:Fraunces,Georgia,serif;font-weight:380;letter-spacing:-.018em;
  font-size:clamp(22px,2.3vw,30px);line-height:1.15;
  transition:color .22s var(--ease);
}
.pd:hover .ghost{opacity:.14}
.pd:hover h2,.pd:target h2{color:#FFFDF8}
.pd:target .ghost{opacity:.18}
.pd .pd-body p{margin:0 0 16px;color:var(--text-2);font-size:15.5px;line-height:1.8}
.pd .pd-body p:last-child{margin-bottom:0}
.pd-body a{border-bottom:1px solid var(--hair);transition:color .2s var(--ease),border-color .2s var(--ease)}
.pd-body a:hover,.pd-body a:focus-visible{color:var(--brass);border-color:var(--brass)}
.pd-body .contact-line{font-size:13px;letter-spacing:.06em;color:var(--muted)}

/* ---- Image band: warm composite, top and bottom scrim only ---- */
.band{
  position:relative;padding:0;border-bottom:1px solid var(--hair);
  min-height:clamp(420px,64svh,780px);overflow:hidden;background:var(--ink-well);margin:0;
}
.band img,.band video{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;object-position:50% 58%;
  filter:saturate(1.06) contrast(1.05) brightness(.94);
}
/* .bandmedia: the moving variant of a band plate, same composite as .band img */
.band video.bandmedia{z-index:0}
.band::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,
    rgba(11,17,24,.85),
    rgba(11,17,24,.12) 38%,
    rgba(11,17,24,.14) 58%,
    rgba(11,17,24,.86));
}
.band::after{
  content:"";position:absolute;inset:0;z-index:1;mix-blend-mode:screen;
  background:radial-gradient(64% 88% at 20% 76%,rgba(201,164,105,.17),transparent 66%);
}
.band figcaption{
  position:absolute;left:0;right:0;bottom:clamp(22px,4vw,44px);z-index:2;
  padding-inline:var(--pad);
  font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:#B9AF9F;
}
.band figcaption .wrap{display:block}
.band figcaption b{display:block;color:var(--brass);font-weight:400;margin-bottom:8px}

/* ---- Motion-media fallbacks ----
   Every <video> ships with a still of the same frame. The still is dormant
   until the reader asks for less motion, at which point the video is removed
   from the box entirely and the still takes its place. ---- */
.media-fallback{display:none}

/* ---- Page-head media (practices only, via .has-media) ---- */
.page-head.has-media{position:relative;overflow:hidden}
.page-head.has-media .ph-media{position:absolute;inset:0;z-index:0}
.page-head.has-media .ph-media video,
.page-head.has-media .ph-media img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(1.05) contrast(1.04) brightness(.5);
}
.page-head.has-media .ph-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,17,24,.72),rgba(11,17,24,.6) 55%,rgba(11,17,24,.95));
}
.page-head.has-media .wrap{position:relative;z-index:1}

/* ---- Contact field media: a slow tide behind the lamp glow ---- */
.contact{position:relative;overflow:hidden}
/* the tide is dimmed on the plate itself, so the scrim below stays at full strength */
.contact-media{position:absolute;inset:0;z-index:0}
.contact-media video,.contact-media img{
  width:100%;height:100%;object-fit:cover;opacity:.24;
  filter:saturate(1.05) brightness(.7);
}
.contact-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,17,24,.55),rgba(11,17,24,.85));
}
.contact .wrap{position:relative;z-index:1}

/* ---- Engraved map plate (contact) ---- */
.map-plate{
  width:min(360px,100%);height:auto;border:1px solid var(--hair);
  box-shadow:0 0 0 1px rgba(201,164,105,.15),0 24px 60px -30px rgba(0,0,0,.8);
  margin:10px 0 8px;
}

/* ---- Inset media plate (join-us) ---- */
.inset-media{
  max-width:560px;margin:clamp(30px,4vw,44px) 0;border:1px solid var(--hair);
  box-shadow:0 24px 60px -30px rgba(0,0,0,.8);
}
/* the box is reserved before the video loads, so the column never jumps */
.inset-media video,.inset-media img{
  width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover;
}

/* ---- Bio closing plate ---- */
.bio-close{margin:clamp(40px,6vw,72px) 0 0;border:1px solid var(--hair)}
.bio-close img{
  width:100%;height:auto;display:block;
  aspect-ratio:2.6/1;object-fit:cover;object-position:50% 46%;
}
@media (max-width:700px){
  .bio-close img{aspect-ratio:4/3}
}

/* ---- People (roster rows, portraits large and lit) ---- */
.people{padding-block:clamp(64px,9vw,128px)}
.plist{border-top:1px solid var(--hair);box-shadow:0 -1px 0 var(--hair-lit)}
.person{
  display:grid;grid-template-columns:auto minmax(0,1.05fr) minmax(0,1fr);
  gap:8px clamp(20px,3.4vw,54px);align-items:center;
  padding:clamp(26px,3.4vw,46px) 0;border-bottom:1px solid var(--hair);
  position:relative;
  --mx:50%;transition:background .35s var(--ease);
}
.person:hover,.person:focus-within{
  background:radial-gradient(320px 320px at var(--mx) 50%,rgba(201,164,105,.075),transparent 72%);
}
.person .pthumb{
  width:clamp(88px,10vw,148px);aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;
  /* full colour, warm: never grayscale for people (funereal in Asian context) */
  filter:saturate(1.05) contrast(1.03);
  background:var(--panel);
  border:0;
  box-shadow:0 0 0 1px rgba(201,164,105,.20),0 24px 60px -28px rgba(0,0,0,.85);
  transition:filter .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);
}
.person:hover .pthumb,.person:focus-within .pthumb{
  filter:saturate(1.12) contrast(1.04) brightness(1.05);
  transform:translateY(-3px);
  box-shadow:0 0 0 1px rgba(201,164,105,.34),0 30px 66px -26px rgba(0,0,0,.9);
}
.person .pname{
  font-family:Fraunces,Georgia,serif;font-weight:340;letter-spacing:-.02em;
  font-size:clamp(23px,2.9vw,40px);line-height:1.06;
  transition:color .22s var(--ease);
}
.person .prole{color:var(--muted);font-size:12.5px;letter-spacing:.12em;text-transform:uppercase}
/* a span, not a link: it reads as an address, it does not offer to be clicked */
.person .pmail{
  display:inline-block;margin-top:8px;font-size:13.5px;letter-spacing:.02em;color:#B4AFA6;
}
.person .ul{
  position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:var(--brass);
  transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);
}
.person:hover .ul,.person:focus-within .ul{transform:scaleX(1)}
.person:hover .pname,.person:focus-within .pname{color:#FFFDF8}
.assoc-label{margin:clamp(44px,6vw,72px) 0 0;font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass)}
.plist-assoc{margin-top:14px}
.assoc{
  margin:clamp(34px,4.4vw,56px) 0 0;max-width:74ch;color:var(--muted);
  font-size:14.5px;line-height:1.8;
}
.assoc a{color:var(--text);border-bottom:1px solid var(--hair);transition:border-color .2s var(--ease),color .2s var(--ease)}
.assoc a:hover,.assoc a:focus-visible{color:var(--brass);border-color:var(--brass)}

/* ---- Bio page ---- */
.bio-grid{
  display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);
  gap:clamp(34px,6vw,96px);align-items:start;
}
/* the aside only pins where there is vertical room for it to be worth pinning */
@media (min-width:1081px) and (min-height:840px){
  .bio-aside{position:sticky;top:calc(var(--mast) + 16px)}
}
.bio-aside .port{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;
  /* full colour, warm: never grayscale for people (funereal in Asian context) */
  filter:saturate(1.05) contrast(1.03);
  background:var(--panel);
  border:0;
  box-shadow:0 0 0 1px rgba(201,164,105,.20),0 24px 60px -28px rgba(0,0,0,.85);
  margin-bottom:26px;
}
.bio-aside dl{margin:0;display:grid;gap:18px}
.bio-aside dt{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass)}
.bio-aside dd{margin:5px 0 0;font-size:14px;line-height:1.65;color:var(--text-2);font-variant-numeric:tabular-nums}
.bio-aside dd a{border-bottom:1px solid var(--hair);transition:color .2s var(--ease),border-color .2s var(--ease)}
.bio-aside dd a:hover,.bio-aside dd a:focus-visible{color:var(--brass);border-color:var(--brass)}
/* drop initial: the page opens like a printed chapter, but only where there is a chapter */
.bio-grid .prose.has-drop > p:first-of-type::first-letter{
  float:left;line-height:.82;margin:.06em .12em 0 0;
  font-family:Fraunces,Georgia,serif;font-size:3.4em;font-weight:200;
  font-variation-settings:"opsz" 144,"WONK" 0;
  color:var(--brass);
}
.tag-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}
.tag{
  font-size:11px;letter-spacing:.06em;padding:3px 10px;color:var(--text-2);
  border:1px solid rgba(201,164,105,.22);
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(0,0,0,.16));
  box-shadow:inset 0 1px 0 rgba(255,247,230,.05);
}
.bio-nav{
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;
  margin-top:clamp(48px,6vw,80px);padding-top:26px;border-top:1px solid var(--hair);
  box-shadow:0 -1px 0 var(--hair-lit);
}
.bio-nav a{
  font-family:Fraunces,Georgia,serif;
  font-size:clamp(19px,2vw,26px);font-weight:330;line-height:1.2;
  text-transform:none;letter-spacing:-.01em;color:var(--text-2);
  transition:color .2s var(--ease);
}
.bio-nav a:hover,.bio-nav a:focus-visible{color:var(--brass)}

/* ---- Contact ---- */
.contact{
  padding-block:clamp(64px,9vw,132px);
  background:
    radial-gradient(96% 122% at 80% 112%,var(--glow-lamp),rgba(214,168,96,0) 58%),
    linear-gradient(180deg,#0B1118,#131719);
}
.contact .h-display,.contact-enquiry .h-display{
  font-size:clamp(36px,6vw,84px);letter-spacing:-.028em;line-height:1;
}
.contact-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(34px,6vw,90px);align-items:start}
/* on wide screens the details column pairs up rather than running one long ladder */
@media (min-width:1081px){
  .contact-grid .cdetail{
    grid-template-columns:1fr 1fr;
    gap:clamp(24px,2.6vw,34px) clamp(24px,3vw,44px);
  }
  .contact-grid .cdetail > div:first-child,
  .contact-grid .cdetail > div:last-child{grid-column:1 / -1}
}
.cdetail{margin:0;display:grid;gap:20px}
.cdetail dt{font-size:10px;letter-spacing:.28em;text-transform:uppercase;color:var(--brass)}
.cdetail dd{margin:6px 0 0;font-size:15.5px;line-height:1.7;color:var(--text-2);font-variant-numeric:tabular-nums}
.cdetail dd.meta{font-size:13px;line-height:1.7;color:var(--muted)}
.cdetail dd a{border-bottom:1px solid var(--hair);transition:border-color .2s var(--ease),color .2s var(--ease)}
.cdetail dd a:hover,.cdetail dd a:focus-visible{color:var(--brass);border-color:var(--brass)}
.cta{
  display:inline-flex;align-items:center;gap:14px;margin-top:clamp(30px,4vw,44px);
  padding:16px 30px;border:1px solid var(--hair);
  font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  transition:border-color .24s var(--ease),background-color .24s var(--ease),
             box-shadow .24s var(--ease),gap .24s var(--ease);
}
.cta b{color:var(--brass);font-weight:400}
.cta:hover,.cta:focus-visible{
  border-color:var(--brass);background:rgba(201,164,105,.10);
  box-shadow:inset 0 1px 0 rgba(255,247,230,.06);gap:20px;
}

/* ---- Alternate routes (404): the other doors, offered plainly ---- */
.alt-routes{
  margin:clamp(30px,4vw,44px) 0 0;padding-top:24px;
  border-top:1px solid var(--hair);box-shadow:0 -1px 0 var(--hair-lit);
  color:var(--muted);font-size:13px;letter-spacing:.02em;line-height:2;max-width:66ch;
}
.alt-routes a{
  color:var(--text-2);border-bottom:1px solid var(--hair);
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.alt-routes a:hover,.alt-routes a:focus-visible{color:var(--brass);border-color:var(--brass)}

/* ---- Enquiry: the note stands beside the form, not under a dead button ---- */
.enquiry-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);
  gap:clamp(30px,6vw,80px);align-items:start;
  margin-top:clamp(26px,3vw,40px);
}
@media (max-width:1080px){
  .enquiry-grid{grid-template-columns:1fr}
}
/* seal red, use 3 of 3: the state of the channel itself */
.form-note{
  position:relative;padding-left:18px;
  font-size:14px;line-height:1.75;color:var(--text-2);max-width:44ch;margin:0;
}
.form-note::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:2px;background:var(--seal)}
.form-note b{color:var(--brass);font-weight:500}
.form-note a{color:var(--text);border-bottom:1px solid var(--hair);transition:color .2s var(--ease),border-color .2s var(--ease)}
.form-note a:hover,.form-note a:focus-visible{color:var(--brass);border-color:var(--brass)}

/* Form (dark): recessed wells with a brass focus halo */
form fieldset{border:0;margin:0;padding:0;min-width:0}
form fieldset[disabled]{opacity:.55}
form .field{margin-bottom:18px}
form label{
  display:block;font-size:10px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--brass);margin-bottom:8px;
}
form input,form textarea{
  width:100%;font:inherit;font-size:15px;color:var(--text);
  background:linear-gradient(180deg,rgba(0,0,0,.28),rgba(255,255,255,.02));
  border:1px solid var(--hair);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.5),0 1px 0 var(--hair-lit);
  padding:13px 14px;border-radius:0;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
form textarea{resize:vertical;min-height:150px}
form input:focus,form textarea:focus{
  outline:0;border-color:rgba(201,164,105,.5);
  box-shadow:inset 0 1px 3px rgba(0,0,0,.5),0 0 0 3px rgba(201,164,105,.10);
}
form button{
  font:inherit;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--text);background:transparent;border:1px solid var(--hair);
  padding:15px 32px;cursor:pointer;
  transition:border-color .24s var(--ease),background-color .24s var(--ease);
}
form button:hover,form button:focus-visible{border-color:var(--brass);background:rgba(201,164,105,.06)}
form button[disabled]{opacity:.45;cursor:not-allowed}
form button[disabled]:hover,form button[disabled]:focus-visible{border-color:var(--hair);background:transparent}
.consent{font-size:12.5px;color:var(--muted);max-width:56ch;line-height:1.7;margin:14px 0 18px}
.consent a{color:#B4AFA6;border-bottom:1px solid var(--hair)}
.consent a:hover,.consent a:focus-visible{color:var(--brass);border-color:var(--brass)}

/* ---- Footer ---- */
footer{padding:clamp(50px,7vw,88px) var(--pad) 44px;background:var(--ink-well)}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(30px,5vw,72px)}
.fgrid h4{
  margin:0 0 18px;font-size:10px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--brass);font-weight:500;
}
.fgrid ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.fgrid a,.fgrid p{color:var(--muted);font-size:14px;line-height:1.7;margin:0}
.fgrid p.fmail{margin-top:14px}
.fgrid a{transition:color .2s var(--ease)}
.fgrid a:hover,.fgrid a:focus-visible{color:var(--text)}
.legal{
  margin-top:clamp(40px,6vw,72px);padding-top:26px;border-top:1px solid var(--hair);
  box-shadow:0 -1px 0 var(--hair-lit);
  display:grid;gap:8px;color:var(--muted);font-size:12.5px;line-height:1.7;max-width:96ch;
}
.legal a{border-bottom:1px solid var(--hair)}
.legal a:hover,.legal a:focus-visible{color:var(--text)}

.shell img.media-fallback{display:none}

/* ---- Motion ---- */
@keyframes thread{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media (prefers-reduced-motion:no-preference){
  .hero h1 span > i,.hero .lede,.hero .hero-cta,.hero .evidence{
    animation:rise .95s var(--ease) both;
  }
  .hero h1 span:nth-child(1) > i{animation-delay:.05s}
  .hero h1 span:nth-child(2) > i{animation-delay:.15s}
  .hero h1 span:nth-child(3) > i{animation-delay:.25s}
  .hero h1 span:nth-child(4) > i{animation-delay:.35s}
  .hero .lede{animation-delay:.5s}
  .hero .hero-cta{animation-delay:.6s}
  .hero .evidence{animation-delay:.7s}
  .page-head .crumb,.page-head h1,.page-head .lede{animation:rise .8s var(--ease) both}
  .page-head .crumb{animation-delay:.02s}
  .page-head h1{animation-delay:.10s}
  .page-head .lede{animation-delay:.22s}
  @keyframes rise{from{opacity:0;transform:translateY(1.05em)}to{opacity:1;transform:translateY(0)}}

  @supports (animation-timeline:scroll()){
    .rail::after{
      animation:thread linear both;
      animation-timeline:scroll(root block);
      animation-range:0 100%;
    }
  }

  @supports (animation-timeline:view()){
    .pa,.person,.pd{
      animation:settle linear both;
      animation-timeline:view();
      animation-range:entry 0% entry 45%;
    }
    @keyframes settle{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}

    .slabel{
      animation:label linear both;
      animation-timeline:view();
      animation-range:entry 0% entry 60%;
    }
    @keyframes label{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}

    .h-display{
      animation:landing linear both;
      animation-timeline:view();
      animation-range:entry 0% entry 50%;
    }
    @keyframes landing{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

    .pd .ghost{
      animation:drift linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    @keyframes drift{from{transform:translateY(26px)}to{transform:translateY(-26px)}}

    .band img,.band video{
      animation:bandpan linear both;
      animation-timeline:view();
      animation-range:cover 0% cover 100%;
    }
    @keyframes bandpan{
      from{transform:scale(1.12) translateY(-2.2%)}
      to{transform:scale(1.12) translateY(2.2%)}
    }
  }
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-media video,
  .ph-media video,
  .contact-media video,
  .band video,
  .inset-media video{display:none}
  .shell img.media-fallback{display:block}
}

/* ---- Responsive ---- */
@media (max-width:1080px){
  .about-grid,.contact-grid{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
  .fgrid > div:first-child{grid-column:1 / -1}
  .bio-grid{grid-template-columns:1fr}
  .bio-aside{max-width:380px}
  .pd{grid-template-columns:1fr}
}
@media (max-width:900px){
  :root{--rail:0px}
  .rail{display:none}
  .shell{margin-left:0}
  .roster{grid-template-columns:1fr}
  .person{grid-template-columns:auto 1fr;grid-template-rows:auto auto}
  .person .pthumb{grid-row:1 / span 2}
  /* the masthead becomes two stacked rules: wordmark, then a full-width nav band */
  .mast{position:static;padding:20px var(--pad) 0}
  .mast-inner{flex-direction:column;align-items:stretch;gap:0}
  .brand{padding-bottom:16px}
  nav.primary{
    gap:0 clamp(20px,5.6vw,34px);
    border-top:1px solid var(--hair);box-shadow:0 -1px 0 var(--hair-lit);
  }
  nav.primary a{font-size:12px;letter-spacing:.16em;line-height:1;padding:16px 0 17px}
  nav.primary a::after{bottom:12px}
  .pindex a{padding:12px 0}
  .fgrid ul{gap:0}
  .fgrid li a{display:inline-block;padding:10px 0}
  /* 16px is the threshold below which iOS Safari zooms the field on focus */
  form input,form textarea{font-size:16px}
}
@media (max-width:700px){
  /* the hero plate is given its own height so the figure is not cropped to a strip */
  .hero-media{bottom:auto;height:66svh;min-height:340px}
  .hero-media video,.hero-media img{object-position:50% 38%}
  .hero-media::after{
    background:linear-gradient(180deg,rgba(11,17,24,.48),rgba(11,17,24,.74) 42%,var(--ink) 96%);
  }
}
@media (max-width:560px){
  .fgrid{grid-template-columns:1fr}
  .hero h1{font-size:clamp(29px,8.4vw,42px);letter-spacing:-.022em}
  .pa .ghost{opacity:.10}
}

/* ---- Print ---- */
@page{margin:16mm 14mm}
@media print{
  :root{--rail:0px;--pad:0px;--hair:#CCCCCC}
  html,body{background:#FFFFFF;color:#111111}
  .rail,.vignette,nav.primary,.skip,.band,form,.cta,.hero-cta,.bio-nav{display:none}
  body::after,section::after,.hero-media{display:none}
  .ph-media,.contact-media,.inset-media,.bio-close,.map-plate{display:none}
  /* the enquiry is a web-only channel: note and grid both come off the sheet */
  .form-note,.enquiry-grid{display:none}
  .page-head.has-media{overflow:visible}
  .shell{margin-left:0}
  section,.panel,.tone,footer,.mast{background:#FFFFFF;border-color:#CCCCCC}
  .mast{position:static}
  section{padding-block:18pt;break-inside:auto}
  a{color:#111111;text-decoration:underline}
  /* structural links are not prose links: no rule under a whole roster row */
  .pa,.person,.pindex a,.brand,.bio-nav a,.hero-cta,.alt-routes a{text-decoration:none}
  h1,h2,h3,h4{color:#111111}
  .hero h1{font-size:26pt;line-height:1.1}
  .page-head h1{font-size:22pt;line-height:1.1}
  .h-display,.prose h2,.pd h2,.person .pname{font-size:15pt;line-height:1.2}
  .prose h3,.slabel,.ev-label,.fgrid h4,.evidence h2,.crumb,.person .prole{font-size:9pt;color:#444444}
  .slabel,.fgrid h4,.cdetail dt,.bio-aside dt,form label{
    background-image:none;-webkit-background-clip:border-box;background-clip:border-box;
    color:#444444;text-shadow:none;filter:none;
  }
  .evidence{padding-left:0;box-shadow:none}
  .evidence::before{display:none}
  body,p,li,dd,dt,.lede,.meta,.legal,.assoc,.prose p,.pd .pd-body p,.about p,
  .fgrid a,.fgrid p,.services li,.tag,.evidence li,.consent,.pd-body .contact-line{
    font-size:10.5pt;line-height:1.5;color:#222222;
  }
  .hero h1 em,.page-head h1 em,.brand .brand-word{color:#111111}
  .hero h1 b{color:#111111}
  .brand u,.slabel em,.slabel .sn,.pindex .n{color:#555555}
  .pindex{box-shadow:none}
  .pa .ghost,.pd .ghost{display:none}
  .bio-grid .prose.has-drop > p:first-of-type::first-letter{float:none;font-size:inherit;color:inherit;margin:0}
  .tc{background:#FFFFFF;border:1px solid #999999;color:#444444;white-space:normal}
  .tag{
    background:none;border:1px solid #BBBBBB;color:#333333;
    box-shadow:none;text-shadow:none;
  }
  img{filter:none;box-shadow:none}
  .prose li::before{background:#999999;opacity:1}
  /* nothing that reads as one unit is allowed to straddle a page break */
  .pa,.pd,.person,figure,.prose li{break-inside:avoid}
}