/* ============================================================ projects page */
.nav a.link[aria-current="page"]{color:var(--color-warm)}
.nav a.link[aria-current="page"]::after{transform:scaleX(1)}
.ph-head{background:var(--color-black);color:var(--color-warm-dim);padding:clamp(150px,20vh,220px) 0 var(--space-xl)}
.ph-head h1{font-family:var(--font-display);font-size:var(--text-display);letter-spacing:.03em;line-height:1;color:var(--color-warm)}
.ph-head h1 .after{color:var(--color-warm-dim);font-size:.34em}
.ph-head .lead{color:var(--color-warm-dim);margin-top:var(--space-lg)}
.secs{list-style:none;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));margin-top:var(--space-xl);
  border-top:1px solid var(--color-warm-faint)}
.secs a{display:flex;flex-direction:column;gap:10px;min-height:44px;padding:22px 18px 22px 0;color:var(--color-warm);
  border-bottom:1px solid transparent;transition:border-color var(--dur-med) var(--ease-out)}
.secs a:hover{border-bottom-color:var(--color-gold)}
.secs b{font-family:var(--font-body);font-weight:200;font-size:clamp(30px,2.8vw,46px);line-height:1;color:var(--color-gold)}
.secs span{font-size:var(--text-xs);letter-spacing:.18em;text-transform:uppercase;line-height:1.5}
@media (max-width:1100px){.secs{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:620px){.secs{grid-template-columns:repeat(2,minmax(0,1fr))}}

.sector{padding-block:var(--space-2xl) 0;background:var(--color-paper);scroll-margin-top:60px}
.sector:last-of-type{padding-bottom:var(--space-2xl)}
.sec-head{display:flex;justify-content:space-between;align-items:last baseline;gap:var(--space-lg);
  padding-bottom:var(--space-lg);border-bottom:1px solid var(--color-ink)}
.sec-head .count{font-family:var(--font-body);font-weight:200;font-size:var(--text-figure);line-height:1;color:var(--color-gold-deep)}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,32px);margin-top:var(--space-xl)}
.strip.n1{grid-template-columns:minmax(0,1fr)}
.strip.n1 .frame{aspect-ratio:21/9}
.strip.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
.strip .frame{aspect-ratio:3/2}
.strip figure:hover .frame img{transform:scale(1.035)}
@media (max-width:820px){.strip,.strip.n1,.strip.n2{grid-template-columns:minmax(0,1fr)}}

.plist{list-style:none;margin-top:var(--space-xl)}
.plist li{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,6fr) minmax(0,3fr) minmax(0,1.6fr);
  gap:var(--space-md);align-items:baseline;padding-block:22px;border-bottom:1px solid var(--color-hair);scroll-margin-top:90px}
.plist .yr{font-family:var(--font-body);font-size:var(--text-sm);color:var(--color-soft);letter-spacing:.02em}
.plist .nm{font-size:var(--text-lg);font-weight:400;line-height:1.35;color:var(--color-ink)}
.plist .sc{display:block;margin-top:6px;font-size:var(--text-sm);line-height:1.55;color:var(--color-soft);max-width:60ch}
.plist .lc{font-size:var(--text-sm);color:var(--color-text);line-height:1.5}
.plist .st{font-size:var(--text-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--color-gold-deep);text-align:right}
@media (max-width:820px){
  .plist li{grid-template-columns:minmax(0,1fr) auto;gap:6px var(--space-md)}
  .plist .yr{grid-row:1}
  .plist .st{grid-row:1;grid-column:2}
  .plist .nm,.plist .lc{grid-column:1 / -1}
}
.before{background:var(--color-bone);padding-block:var(--space-xl)}
.before .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:var(--space-lg);align-items:baseline}
.before h2{font-family:var(--font-display);font-size:var(--text-xl);letter-spacing:.03em;color:var(--color-ink)}
.before p{font-size:var(--text-lg);line-height:1.6;color:var(--color-soft)}
@media (max-width:820px){.before .wrap{grid-template-columns:minmax(0,1fr)}}
.cta{background:var(--color-black);color:var(--color-warm-dim);padding-block:var(--space-2xl);text-align:center}
.cta .display{color:var(--color-warm)}
.cta .after{color:var(--color-warm-dim)}
.cta .btn{margin-top:var(--space-xl);color:var(--color-warm)}
.cta .btn:hover{background:var(--color-warm);color:var(--color-ink)}

/* ------------------------------------------------ project cards, shared with the story page */
.pcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));
  gap:var(--space-xl) clamp(18px,2vw,32px);margin-top:var(--space-xl)}
.pc{min-width:0;scroll-margin-top:110px}
.pc-img{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--color-bone)}
.pc-img img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease-out)}
.pc:hover .pc-img img{transform:scale(1.035)}
.pc-img.art img{object-fit:contain;padding:8% 16% 16%}
.pc-img.ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.pc-img.ph img{width:34px;height:auto;opacity:.45}
.pc:hover .pc-img.ph img,.pc:hover .pc-img.art img{transform:none}
.pc-img .lbl{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--color-soft)}
.pc-img.art .lbl{position:absolute;left:14px;bottom:12px}
.pc-st{display:flex;flex-wrap:wrap;align-items:stretch;margin-top:16px;font-size:clamp(11px,.78vw,12px);line-height:1;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--color-ink)}
.pc-tag{display:inline-flex;align-items:center;padding:7px 10px 6px;background:var(--color-ink);color:var(--color-paper);border:1px solid var(--color-ink)}
.pc-tag.on{background:var(--color-gold);border-color:var(--color-gold);color:var(--color-ink)}
.pc-yr{display:inline-flex;align-items:center;padding:7px 10px 6px;border:1px solid var(--color-ink);border-left:0}
.pc-tag.on + .pc-yr{border-color:var(--color-gold)}
.pc-nm{font-family:var(--font-body);font-weight:400;font-size:var(--text-lg);line-height:1.3;color:var(--color-ink);margin-top:8px}
.pc-sc{font-size:var(--text-sm);line-height:1.55;color:var(--color-soft);margin-top:6px}
.pc-lc{font-size:var(--text-sm);line-height:1.5;color:var(--color-text);margin-top:4px}
.pcs{grid-auto-flow:row dense}
.pc.ft{grid-column:span 2;grid-row:span 2;align-self:start}
.pc.ft .pc-nm{font-size:var(--text-xl)}
@media (max-width:640px){.pc.ft{grid-column:auto;grid-row:auto}}


/* boost:css:start */
:root{--nav-h:64px}
/* ---------- hero: full height, drawn as a general arrangement sheet ---------- */
.ph-head{position:relative;overflow:hidden;min-height:100svh;display:flex;align-items:flex-end;
  padding:calc(var(--nav-h) + 40px) 0 clamp(88px,13vh,132px);isolation:isolate}
.ph-head > .wrap{position:relative;z-index:2}
.ph-draw{position:absolute;inset:var(--nav-h) 0 0 0;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%)}
.ph-draw .dw{position:absolute;inset:0;width:100%;height:100%}
.dw-c{stroke:rgba(239,234,225,.055);stroke-width:1;stroke-dasharray:42 7 4 7;vector-effect:non-scaling-stroke}
.dw-b{fill:var(--color-black);stroke:rgba(239,234,225,.11);stroke-width:1;vector-effect:non-scaling-stroke}
.dw-t{fill:rgba(239,234,225,.2);font-family:var(--font-display);font-size:22px;letter-spacing:.04em;text-anchor:middle}
.dw-d{stroke:rgba(239,234,225,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.dw-k{stroke:rgba(239,234,225,.16);stroke-width:1.4;vector-effect:non-scaling-stroke}
.dw-n{fill:rgba(239,234,225,.17);font-family:"Figures",var(--font-body);font-size:16px;letter-spacing:.06em;text-anchor:middle}
/* the sheet is plotted top to bottom once, on the first visit */
.ph-head.reveal .ph-draw{clip-path:inset(0 0 100% 0);animation:plot 1400ms cubic-bezier(.22,.61,.36,1) 100ms forwards}
@keyframes plot{to{clip-path:inset(0 0 0 0)}}
/* the S mark as a watermark */
.ph-ghost{position:absolute;z-index:1;pointer-events:none;right:-17vw;top:46%;height:min(112svh,1120px);aspect-ratio:1333/1491;
  transform:translateY(calc(-50% + var(--px,0px)))}
.ph-ghost .gh{width:100%;height:100%;overflow:visible}
.gh-form{fill:rgba(239,234,225,.03);stroke:rgba(239,234,225,.14);stroke-width:2.2;vector-effect:non-scaling-stroke}
.gh-gold{fill:rgba(210,175,109,.05);stroke:rgba(210,175,109,.4);stroke-width:2.2;vector-effect:non-scaling-stroke}
.ph-head.reveal .gh-gold{stroke-dasharray:1;stroke-dashoffset:1;fill-opacity:0;animation:ghDraw 900ms cubic-bezier(.22,.61,.36,1) 600ms forwards,ghFill 600ms ease-out 1450ms forwards}
.ph-head.reveal .gh-form{stroke-dasharray:1;stroke-dashoffset:1;fill-opacity:0;animation:ghDraw 1100ms cubic-bezier(.22,.61,.36,1) 1000ms forwards,ghFill 700ms ease-out 1900ms forwards}
@keyframes ghDraw{to{stroke-dashoffset:0}}
@keyframes ghFill{to{fill-opacity:1}}
/* title: letters settle in, 24 px at most */
.ph-head h1 .ch{display:inline-block;opacity:0;transform:translateY(24px);
  animation:chIn 520ms cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(260ms + var(--i)*45ms)}
.ph-head h1 .after{opacity:0;animation:fadeIn 600ms ease-out 900ms forwards}
.ph-head .lead{opacity:0;transform:translateY(16px);animation:chIn 600ms cubic-bezier(.22,.61,.36,1) 1000ms forwards}
@keyframes chIn{to{opacity:1;transform:none}}
@keyframes fadeIn{to{opacity:1}}
/* the finished floor level, with the span of the record above it */
.ph-datum{position:absolute;z-index:2;left:max(var(--gutter),16px);right:max(var(--gutter),16px);bottom:clamp(34px,5vh,52px);
  display:flex;align-items:center;gap:10px;color:var(--color-warm-dim);font-size:var(--text-xs);letter-spacing:.2em;text-transform:uppercase;
  opacity:0;animation:fadeIn 700ms ease-out 1300ms forwards}
.ph-datum::after{content:"";flex:1;height:1px;background:var(--color-gold);transform:scaleX(0);transform-origin:left;
  animation:lineDraw 1100ms cubic-bezier(.22,.61,.36,1) 1400ms forwards}
.ph-datum svg{width:15px;height:10px;fill:none;stroke:var(--color-gold);stroke-width:1.4}
.ph-datum b{font-family:"Figures",var(--font-body);font-weight:400;font-size:14px;letter-spacing:.06em;color:var(--color-warm)}
@keyframes lineDraw{to{transform:scaleX(1)}}
.ph-dim{position:absolute;z-index:2;right:max(var(--gutter),16px);top:calc(var(--nav-h) + 36px);display:flex;align-items:center;gap:14px;
  font-size:var(--text-xs);letter-spacing:.2em;text-transform:uppercase;color:var(--color-warm-dim);opacity:0;animation:fadeIn 700ms ease-out 1700ms forwards}
.ph-dim i{display:block;width:clamp(80px,14vw,220px);height:9px;border-left:1px solid currentColor;border-right:1px solid currentColor;
  background:linear-gradient(currentColor,currentColor) center/100% 1px no-repeat}
.ph-dim b{font-family:"Figures",var(--font-body);font-weight:400;letter-spacing:.06em;color:var(--color-warm)}
@media (max-width:720px){.ph-ghost{right:-38vw;height:86svh;opacity:.55}.ph-dim{display:none}
  .ph-draw{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 55%,transparent 85%);mask-image:linear-gradient(180deg,#000 0,#000 55%,transparent 85%)}
  .ph-draw .dw{inset:auto;left:0;top:0;width:1300px;height:597px}}

/* ---------- sticky sector bar ---------- */
.secbar{position:sticky;top:var(--nav-h);z-index:30;background:var(--color-paper);border-bottom:1px solid var(--color-hair)}
.secbar .wrap{display:flex;gap:clamp(18px,2.6vw,40px);overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.secbar .wrap::-webkit-scrollbar{display:none}
.secbar a{position:relative;flex:none;display:flex;align-items:baseline;gap:8px;padding:16px 0 15px;white-space:nowrap;
  font-size:var(--text-xs);letter-spacing:.18em;text-transform:uppercase;color:var(--color-soft);text-decoration:none;transition:color 180ms ease-out}
.secbar a b{font-family:"Figures",var(--font-body);font-weight:400;letter-spacing:0;font-size:13px;color:var(--color-gold-deep)}
.secbar a::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--color-ink);transform:scaleX(0);
  transform-origin:left;transition:transform 280ms ease-out}
.secbar a:hover,.secbar a[aria-current="true"]{color:var(--color-ink)}
.secbar a[aria-current="true"]::after{transform:scaleX(1)}
.secbar a:focus-visible{outline:1px solid var(--color-ink);outline-offset:4px}

/* ---------- selected work: a slider the reader drives (no autoplay) ---------- */
.sel{background:var(--color-paper);padding-block:var(--space-2xl) var(--space-xl)}
.sel-head{display:flex;justify-content:space-between;align-items:end;gap:var(--space-lg);flex-wrap:wrap}
.sel-head p{max-width:46ch;color:var(--color-soft)}
.sel-ctl{display:flex;align-items:center;gap:18px}
.sel-ctl button{width:48px;height:48px;border:1px solid var(--color-ink);background:transparent;color:var(--color-ink);cursor:pointer;
  display:grid;place-items:center;transition:background 180ms ease-out,color 180ms ease-out}
.sel-ctl button:hover:not(:disabled){background:var(--color-ink);color:var(--color-paper)}
.sel-ctl button:disabled{opacity:.3;cursor:default}
.sel-ctl button:focus-visible{outline:1px solid var(--color-ink);outline-offset:3px}
.sel-ctl svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4}
.sel-n{font-family:"Figures",var(--font-body);font-size:14px;letter-spacing:.08em;color:var(--color-soft);min-width:56px;text-align:center}
.sel-track{display:grid;grid-auto-flow:column;grid-auto-columns:min(62vw,880px);gap:clamp(16px,2vw,28px);overflow-x:auto;
  scroll-snap-type:x mandatory;scroll-padding-inline:max(var(--gutter),calc((100vw - 1520px)/2));padding-inline:max(var(--gutter),calc((100vw - 1520px)/2));
  margin-top:var(--space-xl);scrollbar-width:none;overscroll-behavior-x:contain}
.sel-track::-webkit-scrollbar{display:none}
.sel-card{scroll-snap-align:start;min-width:0;text-decoration:none;color:inherit}
.sel-card .im{aspect-ratio:16/10;overflow:hidden;background:var(--color-bone)}
.sel-card .im img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.2s var(--ease-out)}
.sel-card:hover .im img{transform:scale(1.06)}
.sel-card .cap{display:grid;grid-template-columns:1fr auto;gap:4px 24px;padding-top:16px}
.sel-card .nm{font-family:var(--font-display);font-size:clamp(20px,1.8vw,28px);letter-spacing:.03em;line-height:1.15;color:var(--color-ink)}
.sel-card .yr{font-family:"Figures",var(--font-body);font-size:14px;color:var(--color-soft);align-self:start;padding-top:6px}
.sel-card .lc{font-size:var(--text-sm);letter-spacing:.16em;text-transform:uppercase;color:var(--color-soft)}
.sel-bar{height:1px;background:var(--color-hair);margin:var(--space-lg) max(var(--gutter),calc((100vw - 1520px)/2)) 0;position:relative}
.sel-bar i{position:absolute;left:0;top:-1px;height:3px;width:var(--w,10%);transform:translateX(var(--x,0));background:var(--color-ink);
  transition:transform 280ms ease-out,width 280ms ease-out}
@media (max-width:720px){.sel-track{grid-auto-columns:84vw}}

/* ---------- cards: a hairline grows under the name ---------- */
.pc-nm{position:relative;padding-bottom:6px}
.pc-nm::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--color-ink);transform:scaleX(0);
  transform-origin:left;transition:transform 280ms ease-out}
.pc:hover .pc-nm::after{transform:scaleX(1)}

@media (prefers-reduced-motion:reduce){
  .ph-head .ch,.ph-head h1 .after,.ph-head .lead,.ph-datum,.ph-dim{opacity:1!important;transform:none!important;animation:none!important}
  .ph-datum::after{transform:none!important;animation:none!important}
  .ph-head.reveal .ph-draw{clip-path:none!important;animation:none!important}
  .ph-head.reveal .gh-form,.ph-head.reveal .gh-gold{animation:none!important;stroke-dashoffset:0!important;fill-opacity:1!important}
  .ph-ghost{transform:translateY(-50%)!important}
  .sel-bar i,.secbar a::after,.pc-nm::after{transition:none}
}
/* boost:css:end */
/* boost:white */ :root{--color-paper:#FFFFFF}

.bx{position:relative;overflow:hidden;isolation:isolate}
.bx > .wrap,.bx > .art{position:relative;z-index:1}
/* the sheet keeps the hero's scale however tall the section is, and fades out below its first screen */
.s-hero.bx > .bx-draw{top:var(--nav-h,78px)}
.bx > .bx-draw{position:absolute;left:0;right:0;top:0;height:min(100%,900px);z-index:0;pointer-events:none;overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg,#000 0,#000 55%,transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 55%,transparent 100%)}
.bx > .bx-draw .dw{position:absolute;left:0;top:0;width:1960px;height:900px}
.bx .dw-c{stroke:rgba(239,234,225,.055);stroke-width:1;stroke-dasharray:42 7 4 7;vector-effect:non-scaling-stroke}
.bx .dw-b{fill:var(--color-black);stroke:rgba(239,234,225,.11);stroke-width:1;vector-effect:non-scaling-stroke}
.bx .dw-t{fill:rgba(239,234,225,.2);font-family:var(--font-display);font-size:22px;letter-spacing:.04em;text-anchor:middle}
.bx .dw-d{stroke:rgba(239,234,225,.08);stroke-width:1;vector-effect:non-scaling-stroke}
.bx .dw-k{stroke:rgba(239,234,225,.16);stroke-width:1.4;vector-effect:non-scaling-stroke}
.bx .dw-n{fill:rgba(239,234,225,.17);font-family:"Figures",var(--font-body);font-size:16px;letter-spacing:.06em;text-anchor:middle}
/* on a light ground the sheet is drawn in graphite */
.bx.light .dw-c{stroke:rgba(42,43,45,.07)}
.bx.light .dw-b{fill:var(--color-bone);stroke:rgba(42,43,45,.13)}
.bx.light .dw-t{fill:rgba(42,43,45,.26)}
.bx.light .dw-d{stroke:rgba(42,43,45,.1)}
.bx.light .dw-k{stroke:rgba(42,43,45,.2)}
.bx.light .dw-n{fill:rgba(42,43,45,.24)}
/* the S mark, quietly, behind the footer */
/* the whole mark, uncut, set to the right and sized to the footer's height (Pawan, 17 October 2026) */
.foot-site.bx > .bx-ghost{position:absolute;z-index:0;pointer-events:none;right:max(var(--gutter,24px),3vw);top:50%;
  height:min(calc(100% - 72px),118vw);aspect-ratio:1333/1491;transform:translateY(-50%)}
.foot-site.bx > .bx-ghost .gh{width:100%;height:100%;overflow:visible}
.foot-site.bx .gh-form{fill:rgba(239,234,225,.032);stroke:none}
/* solid shapes, no outline: a quiet presence behind the footer, never line art (Pawan, 17 October 2026) */
.foot-site.bx .gh-gold{fill:rgba(210,175,109,.045);stroke:none}
.foot-site.bx > .wrap{position:relative;z-index:1}
@media (max-width:720px){.bx > .bx-draw .dw{width:1300px;height:597px}}