/* v1.9.5 portfolio: homepage section + /portfolio/ page */
.pfw{--gold:#c99a3e}
.pf-k{font:700 13px var(--hf);letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin:0 0 14px}
/* filter chips */
.pf-fl{display:flex;flex-wrap:wrap;gap:8px}
.pf-fl button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:8px;font:600 14px var(--hf);font-stretch:90%;padding:9px 14px;border:1.5px solid #6b5f56;color:#d9d2c8;transition:background .2s,color .2s,border-color .2s}
.pf-fl button i{width:9px;height:9px;border-radius:50%}.pf-fl button b{font-weight:700;color:var(--gold)}
.pf-fl button:hover{border-color:var(--gold)}.pf-fl button[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:var(--ink)}.pf-fl button[aria-pressed=true] b{color:var(--ink)}.pf-fl button:focus-visible{outline:3px solid var(--brass);outline-offset:2px}
/* map */
.pf-map{margin:0;position:relative}
.pf-svg{width:100%;height:auto;display:block;border:1px solid #4a3f37;background:radial-gradient(120% 100% at 30% 20%,#221a15,#150f0c)}
.pf-map figcaption{font:500 13px var(--hf);color:#a89d92;margin-top:10px}
.pfw .gr path{stroke:#2e2520;stroke-width:1;fill:none}.pfw .lb text{font:600 11px var(--hf);letter-spacing:.14em;fill:#7f7368}.pfw .lb .sm{font-weight:500;letter-spacing:.04em;fill:#a89d92}.pfw .far{fill:none;stroke:#4a3f37;stroke-dasharray:5 5}
.pfw .of rect{fill:var(--gold)}.pfw .of text{font:700 11px var(--hf);letter-spacing:.14em;fill:var(--gold)}
.pfw .rt{fill:none;stroke:var(--c,#c99a3e);stroke-width:1.8;stroke-dasharray:5 6;opacity:0;transition:opacity .3s}.pfw .rt.on{opacity:1;animation:pfmv 1.2s linear infinite}@keyframes pfmv{to{stroke-dashoffset:-22}}
.pfw .mk{cursor:pointer;transition:opacity .3s}.pfw .mk .pd{fill:#f5f4f1;stroke:var(--c);stroke-width:2.5;transition:fill .25s}.pfw .mk text{font:800 14px var(--hf);text-anchor:middle;fill:var(--ink);pointer-events:none}.pfw .mk .pu{fill:none;stroke:var(--c);stroke-width:2;opacity:0}
.pfw .mk.on .pd{fill:var(--c)}.pfw .mk.on .pu{animation:pfpu 1.8s ease-out infinite}@keyframes pfpu{0%{opacity:.9;r:13}100%{opacity:0;r:32}}.pfw .mk.off{opacity:.16;pointer-events:none}.pfw .mk:focus-visible{outline:none}.pfw .mk:focus-visible .pd{stroke:#fff;stroke-width:3.5}
.pf-ro{background:#17110e;border:1px solid #4a3f37;border-top:0;border-left:4px solid var(--c,#c99a3e);padding:14px 18px;display:grid;gap:3px;color:#f1ede6;min-height:116px;align-content:center}
.pf-ro .ro-s{font:700 11px var(--hf);letter-spacing:.16em;text-transform:uppercase;color:var(--c,#c99a3e)}.pf-ro .ro-n{font:800 clamp(24px,2.4vw,34px)/1 var(--hf);font-stretch:62%;text-transform:uppercase}.pf-ro .ro-l{font:500 14px var(--hf);color:#c9c0b5}.pf-ro .ro-m{font:600 13px var(--hf);color:var(--gold)}
/* homepage */
.pfh-hd{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:30px}
.pfh-hd h2{font-size:clamp(40px,5.4vw,84px);font-stretch:68%;text-transform:uppercase}.pfh-sub{max-width:52ch;margin:14px 0 0;color:#c9c0b5}
.atl-st{margin:0;font:500 clamp(16px,1.4vw,20px) var(--hf);font-stretch:90%;color:#a89d92}.atl-st b{font:800 clamp(34px,3.4vw,52px)/1 var(--hf);font-stretch:62%;color:var(--gold);margin:0 4px 0 18px}.atl-st b:first-child{margin-left:0}
.pfh .pf-fl{margin-bottom:22px}
.pfh-g{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:calc(var(--g)*1.2);align-items:start}
.pfh-list{list-style:none;margin:0;padding:0;border-top:1px solid #4a3f37;max-height:min(640px,70vh);overflow:auto;scrollbar-width:thin;scrollbar-color:#6b5f56 transparent}
.pfh-list li{border-bottom:1px solid #4a3f37;transition:opacity .3s}.pfh-list li.off{display:none}
.hr{all:unset;box-sizing:border-box;cursor:pointer;display:grid;grid-template-columns:40px 1fr auto;grid-template-areas:"n b i" "n s i";gap:0 14px;align-items:center;width:100%;padding:13px 10px;border-left:3px solid transparent;transition:border-color .25s,background .25s}
.hr:focus-visible{outline:3px solid var(--brass);outline-offset:-3px}
.hr em{grid-area:n;font:800 18px var(--hf);font-style:normal;font-stretch:70%;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1.5px solid #8a7d70;color:#d9d2c8}
.hr b{grid-area:b;font:800 clamp(22px,2.2vw,32px)/1.02 var(--hf);font-stretch:62%;text-transform:uppercase;color:#fff}.hr span{grid-area:s;font:500 14px var(--hf);color:#a89d92}.hr i{grid-area:i;font:700 14px var(--hf);font-style:normal;color:var(--c,var(--gold));text-align:right}
.hr[aria-pressed=true]{border-left-color:var(--c,var(--gold));background:rgba(255,255,255,.05)}.hr[aria-pressed=true] em{background:var(--c,var(--gold));border-color:var(--c,var(--gold));color:var(--ink)}
.og{font:700 11px var(--hf);letter-spacing:.08em;text-transform:uppercase;color:var(--gold)}
.pfh-more{margin:26px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}.pfh-more span{font:500 14px var(--hf);color:#a89d92}
.pfh .pf-map{position:sticky;top:104px}
/* page hero */
.pfx-hero{background:var(--ink);color:#f1ede6;position:relative;overflow:hidden;padding-top:clamp(48px,7vw,110px)}
.pfx-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(201,154,62,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(201,154,62,.08) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(#000,transparent 90%);mask-image:linear-gradient(#000,transparent 90%)}
.pfx-hero .wrap{position:relative}
.pfx-k{font:700 13px var(--hf);letter-spacing:.2em;text-transform:uppercase;color:#a89d92;margin:0 0 22px}.pfx-k i{color:var(--gold);font-style:normal;margin:0 8px}
.pfx-hero h1{font-size:clamp(64px,13vw,210px);font-stretch:62%;text-transform:uppercase;line-height:.86;color:#fff;max-width:11ch}
.pfx-hero h1 small{display:block;font:700 clamp(14px,1.4vw,18px) var(--hf);font-stretch:100%;letter-spacing:.24em;color:var(--gold);margin-bottom:20px}.pfx-hero h1 em{font-style:normal;color:var(--gold)}
.pfx-l{max-width:46ch;font-size:clamp(18px,1.6vw,22px);color:#d9d2c8;margin:28px 0 0}
.pfx-st{list-style:none;margin:clamp(40px,6vw,80px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #4a3f37}
.pfx-st li{padding:24px 20px 28px 0;border-right:1px solid #3a2f28;padding-left:20px}.pfx-st li:first-child{padding-left:0}.pfx-st li:last-child{border-right:0}
.pfx-st b{display:block;font:800 clamp(48px,6.4vw,100px)/1 var(--hf);font-stretch:62%;color:var(--gold)}.pfx-st span{font:500 15px var(--hf);color:#c9c0b5}
.pfx-mq{border-block:1px solid #4a3f37;overflow:hidden;padding-block:16px;position:relative}
.pfx-mq .tr{display:flex;align-items:center;gap:34px;width:max-content;animation:pfmq 70s linear infinite}.pfx-mq:hover .tr{animation-play-state:paused}
.pfx-mq span{font:800 clamp(22px,2.6vw,38px)/1 var(--hf);font-stretch:62%;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px #8a7d70;white-space:nowrap}.pfx-mq i{color:var(--gold);font-style:normal;font-size:14px}
@keyframes pfmq{to{transform:translateX(-50%)}}
/* sticky filter bar */
.pf-bar{position:sticky;top:88px;z-index:20;background:rgba(30,23,19,.95);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid #3a2f28}
.pf-bar .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:space-between;padding-block:14px}
.pf-ct{margin:0;font:500 14px var(--hf);color:#a89d92}.pf-ct b{color:var(--gold)}
.pfp-m .sh h2{color:#fff}.pfp-m .sh p{color:#c9c0b5}
.pfp-m .pf-map{margin-bottom:clamp(32px,4vw,56px)}
/* project cards */
.pcs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.pc{display:flex;flex-direction:column;background:#241c17;border:1px solid #3a2f28;border-top:3px solid var(--c);transition:transform .3s,background .3s,border-color .3s}.pc.off{display:none}
.pc:hover{transform:translateY(-4px);background:#2b221c}
.pc .hr{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:20px 20px 18px;border-left:0;flex:1}.pc .hr[aria-pressed=true]{background:rgba(255,255,255,.04);box-shadow:inset 0 -3px 0 var(--c)}
.pc .hr .pc-t{display:flex;justify-content:space-between;align-items:center;color:var(--c);margin-bottom:18px}.pc .hr em{all:unset;font:800 clamp(44px,4.6vw,68px)/1 var(--hf);font-stretch:62%;color:transparent;-webkit-text-stroke:1.5px var(--c)}
.pc .hr b{font-size:clamp(28px,2.6vw,38px);margin-bottom:6px}.pc .hr .pc-l{font:500 15px var(--hf);color:#c9c0b5;margin-bottom:16px}
.pc .hr .pc-m{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.pc .hr .pc-m i{font:600 12px var(--hf);font-style:normal;letter-spacing:.04em;padding:4px 9px;border:1px solid #5a4d44;color:#e8e1d6;text-align:left}.pc .hr .pc-m i.og{border-color:var(--gold);color:var(--gold)}
.pc .hr .pc-d{font:500 13px var(--hf);color:#a89d92;margin-top:auto}
.pc-a{display:block;padding:12px 20px;border-top:1px solid #3a2f28;font:700 14px var(--hf);color:var(--gold);text-decoration:none}.pc-a:hover{background:var(--gold);color:var(--ink)}
.pf-none{font:600 18px var(--hf);color:#c9c0b5;margin-top:24px}
/* sectors */
.pfs-g{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:1.5px solid var(--ink);border-left:1.5px solid var(--ink)}
.pfs-g>li{position:relative;padding:30px 28px 32px;border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transition:background .3s}.pfs-g>li:hover{background:var(--lime)}
.pfs-n{position:absolute;right:22px;top:14px;font:800 clamp(40px,4vw,60px)/1 var(--hf);font-stretch:62%;color:transparent;-webkit-text-stroke:1.5px var(--c)}
.pfs-g h3{display:flex;align-items:center;gap:10px;font-size:clamp(26px,2.4vw,34px);margin-bottom:14px;text-transform:uppercase;font-stretch:62%;max-width:70%}.pfs-g .pf-ic{color:var(--c);flex:none;stroke:var(--ink)}
.pfs-g p{color:var(--mut);font-size:17px}.pfs-g .chips{margin:0}
/* developers */
.pfd-g{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.pfd-g li{background:var(--plaster);border:1.5px solid var(--ink);padding:22px 20px;display:grid;gap:4px}.pfd-g b{font:800 clamp(28px,2.6vw,38px)/1 var(--hf);font-stretch:62%;text-transform:uppercase}.pfd-g span{font:700 14px var(--hf);color:var(--ox)}.pfd-g i{font:500 14px var(--hf);font-style:normal;color:var(--mut)}
/* film strip */
.pff{padding-bottom:clamp(48px,6vw,90px)}.fs-w{position:relative}
.fs{list-style:none;margin:0;padding:0 var(--g) 14px;display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#8a7d70 transparent;scroll-padding-inline:var(--g)}
.fs li{flex:0 0 clamp(240px,27vw,380px);scroll-snap-align:start}.fs a{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:var(--lime);cursor:zoom-in}.fs img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.fs a:hover img{transform:scale(1.05)}
.fs span{position:absolute;left:0;right:0;bottom:0;padding:44px 16px 14px;background:linear-gradient(transparent,rgba(0,0,0,.82));color:#fff;font:700 15px/1.15 var(--hf);font-stretch:85%}
.fs-b{all:unset;cursor:pointer;position:absolute;top:calc(50% - 22px);z-index:3;width:48px;height:48px;display:grid;place-items:center;background:var(--ink);color:#fff;font:700 22px var(--hf);box-shadow:0 4px 18px rgba(0,0,0,.35)}.fs-b:hover{background:var(--ox)}.fs-b:focus-visible{outline:3px solid var(--brass)}.fs-b.p{left:14px}.fs-b.n{right:14px}
.pff-m{margin:26px 0 0}
/* reveal on scroll (only when JS is running) */
.pfjs .rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}.pfjs .rv.in{opacity:1;transform:none}
@media(max-width:1000px){.pfs-g{grid-template-columns:repeat(2,minmax(0,1fr))}.pfx-st{grid-template-columns:repeat(2,minmax(0,1fr))}.pfx-st li:nth-child(2){border-right:0}.pfx-st li:nth-child(3){padding-left:0}}
@media(max-width:900px){.pfh-g{grid-template-columns:1fr}.pfh .pf-map{position:static;order:-1}.pf-bar{top:76px}.pfh-list{max-height:none}}
@media(max-width:620px){.pfs-g{grid-template-columns:1fr}.pfx-st b{font-size:clamp(44px,15vw,72px)}.fs-b{display:none}.pf-fl button{padding:8px 11px;font-size:13px}.pfh-hd{align-items:start}}
@media(prefers-reduced-motion:reduce){.pfw .rt.on,.pfw .mk.on .pu,.pfx-mq .tr{animation:none}.pfx-mq .tr{flex-wrap:wrap;width:auto;gap:14px 26px;padding-inline:var(--g)}.pfjs .rv{opacity:1;transform:none;transition:none}.pc,.fs img{transition:none}}
/* hero collage */
.pfx-col{position:absolute;right:0;top:clamp(0px,1vw,20px);width:min(38vw,520px);height:clamp(380px,38vw,560px);pointer-events:none}
.pfx-col figure{position:absolute;margin:0;border:1px solid var(--brass);background:var(--lime);box-shadow:0 24px 60px rgba(0,0,0,.55);overflow:hidden}
.pfx-col img{width:100%;height:100%;object-fit:cover}
.pfx-col .c1{right:0;top:0;width:78%;height:56%;transform:rotate(1.6deg);animation:pffl 9s ease-in-out infinite}
.pfx-col .c2{left:0;top:40%;width:46%;height:46%;transform:rotate(-2.4deg);animation:pffl 11s ease-in-out -3s infinite}
.pfx-col .c3{right:2%;bottom:0;width:40%;height:50%;transform:rotate(2.2deg);animation:pffl 10s ease-in-out -6s infinite}
@keyframes pffl{50%{translate:0 -10px}}
@media(max-width:1100px){.pfx-col{display:none}}
@media(prefers-reduced-motion:reduce){.pfx-col figure{animation:none}}
.pfx-hero h1{position:relative;z-index:2}.pfx-hero .pfx-l{position:relative;z-index:2}
@media(max-width:1300px){.pfx-col{width:min(33vw,440px)}}