@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@300;400&family=Manrope:wght@400;500;600&family=Playfair+Display:ital,wght@1,500&display=swap');
:root{--ink:#171713;--paper:#f4f2ea;--acid:#d9ed45;--line:rgba(23,23,19,.18);--muted:#706f67}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;-webkit-font-smoothing:antialiased}.grain{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:10;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E")}.site-header{height:108px;padding:18px clamp(22px,4vw,64px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand img{width:72px;height:72px;display:block;transition:transform .5s ease}.brand:hover img{transform:rotate(-8deg)}.since,.eyebrow,.number,small,footer{font-family:"DM Mono",monospace;text-transform:uppercase;letter-spacing:.12em}.since{margin:0;font-size:11px;display:flex;align-items:center;gap:10px}.since span{width:7px;height:7px;border-radius:50%;background:var(--acid);box-shadow:0 0 0 5px rgba(217,237,69,.2)}.hero{min-height:calc(100vh - 108px);padding:clamp(70px,11vh,128px) clamp(22px,8vw,132px) 48px;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(250px,.55fr);grid-template-rows:auto 1fr auto;column-gap:7vw}.eyebrow{margin:0 0 28px;font-size:11px;color:var(--muted)}.hero .eyebrow{grid-column:1/-1}h1{margin:0;font-size:clamp(64px,9.5vw,148px);line-height:.86;letter-spacing:-.072em;font-weight:500;align-self:start}h1 em{font-family:"Playfair Display",Georgia,serif;font-weight:500;color:var(--muted)}.intro{margin:12px 0 0;max-width:390px;font-size:clamp(16px,1.35vw,21px);line-height:1.65;align-self:center}.scroll-cue{grid-column:1/-1;justify-self:end;display:flex;gap:34px;align-items:center;padding:13px 0;border-bottom:1px solid var(--ink);color:inherit;text-decoration:none;font-size:13px}.scroll-cue span{font-size:21px;transition:transform .25s}.scroll-cue:hover span{transform:translateY(4px)}.directory{background:var(--ink);color:var(--paper);padding:clamp(76px,10vw,150px) clamp(22px,8vw,132px)}.section-heading{display:grid;grid-template-columns:1fr 1fr;column-gap:8vw;margin-bottom:70px}.section-heading .eyebrow{grid-column:1/-1;color:#aaa99e}h2{margin:0;font-size:clamp(46px,6vw,88px);line-height:.95;letter-spacing:-.055em;font-weight:500}.section-heading>p:last-child{max-width:300px;margin:10px 0 0;color:#aaa99e;line-height:1.6}.family-grid{border-top:1px solid rgba(244,242,234,.25)}.person{display:grid;grid-template-columns:70px 1fr 72px 54px;gap:24px;min-height:132px;align-items:center;border-bottom:1px solid rgba(244,242,234,.25);color:inherit;text-decoration:none;position:relative;isolation:isolate}.person:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--acid);transform:scaleY(0);transform-origin:var(--highlight-origin,bottom);transition:transform .35s cubic-bezier(.2,.8,.2,1)}.person:hover:before,.person.is-highlighted:before,.person:focus-visible:before{transform:scaleY(1)}.person:hover,.person.is-highlighted,.person:focus-visible{color:var(--ink);outline:none}.number{font-size:10px;color:#aaa99e}.person:hover .number,.person.is-highlighted .number{color:var(--ink)}.details{display:flex;align-items:baseline;gap:28px}.details strong{font-size:clamp(30px,4vw,60px);font-weight:400;letter-spacing:-.045em}.details small{color:#aaa99e;font-size:9px}.person:hover small,.person.is-highlighted small{color:var(--ink)}.qr{width:50px;height:50px;image-rendering:pixelated;filter:invert(1);opacity:.7;transition:filter .2s,opacity .2s}.person:hover .qr,.person.is-highlighted .qr{filter:none;opacity:1}.arrow{justify-self:end;font-size:32px;transition:transform .25s}.person:hover .arrow,.person.is-highlighted .arrow{transform:translate(5px,-5px)}footer{min-height:130px;padding:30px clamp(22px,4vw,64px);display:flex;align-items:center;justify-content:space-between;font-size:10px}footer span{color:var(--muted)}
@media(max-width:760px){.site-header{height:84px}.brand img{width:54px;height:54px}.hero{min-height:calc(100svh - 84px);display:flex;flex-direction:column;padding-top:16vh}h1{font-size:clamp(52px,17vw,88px)}.intro{margin:46px 0;align-self:flex-end;max-width:300px}.scroll-cue{margin-top:auto}.section-heading{grid-template-columns:1fr;margin-bottom:42px}.section-heading>p:last-child{margin-top:24px}.person{grid-template-columns:36px 1fr 38px;gap:12px;min-height:108px}.details{display:block}.details strong{display:block}.details small{display:block;margin-top:7px;font-size:8px}.qr{display:none}.arrow{font-size:25px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before{transition-duration:.01ms!important;animation:none!important}}

@keyframes highlight-breathe{0%,100%{opacity:1}50%{opacity:.9}}
@keyframes highlight-sweep{from{transform:translateX(-160%) skewX(-18deg)}to{transform:translateX(460%) skewX(-18deg)}}
.person{overflow:hidden}
.person>*{position:relative;z-index:1}
.person:before{z-index:0}
.person:after{content:"";position:absolute;z-index:0;top:0;bottom:0;left:0;width:28%;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:translateX(-160%) skewX(-18deg)}
.person.is-lingering:before{animation:highlight-breathe 2.2s ease-in-out infinite}
.person.is-lingering:after{animation:highlight-sweep var(--sweep-duration,5.5s) cubic-bezier(.25,.65,.35,1) 1}

/* QR contrast follows the row state while preserving image transparency. */
.person{grid-template-columns:70px 1fr 50px;padding-left:24px;padding-right:48px}
.details{display:grid;grid-template-columns:clamp(140px,14vw,210px) 1fr;align-items:baseline;gap:14px}
.details strong,.details small{display:block;text-align:left}
.details small{margin-top:0}
.qr-single{display:block;width:50px;height:50px;justify-self:end;background:transparent;image-rendering:pixelated;filter:brightness(1.4);transition:filter .2s}
.person:hover .qr-single,.person.is-highlighted .qr-single,.person:focus-visible .qr-single{filter:none}

@media(max-width:760px){.person{grid-template-columns:36px 1fr;padding-left:14px;padding-right:24px}.details{display:block}.details small{margin-top:7px}.qr-single{display:none}}

.brand img{width:82px;height:82px}
@media(max-width:760px){.brand img{width:62px;height:62px}}

.section-heading>p:last-child{max-width:none;white-space:nowrap}