/* Project experience (2026-10-06): the shared company hero, a standard section
   head, then one spaced index of work on the site's dark ground. Images use the
   site's 12px corners; numbering and captions use the body sans; items enter
   with the shared scroll motion (motion-system.js). */
.pjx{--pjx-ink:#eef0ec;--pjx-text:#c9d0d7;--pjx-muted:#9aa4af;--pjx-line:#ffffff1f;--pjx-rule:#ffffff40;background:#151922;color:var(--pjx-ink)}
.pjx figure{margin:0}
.pjx :is(button,a):focus-visible{outline:2px solid var(--gold);outline-offset:4px}

/* Hero: a generated daylight scene (Codex CLI); the towers sit right of the
   copy. Type, spacing and position follow the specialist pages' .spf-hero so
   the first view reads the same as the rest of the site. */
.pjx .pjx-hero{min-height:min(880px,max(720px,94svh));height:auto;align-items:center}
@media (min-width:901px){.pjx .pjx-hero{min-height:max(640px,100svh)}}
.pjx-hero .company-scene__image{object-position:60% 30%}
.pjx-hero .company-scene__shade{background:linear-gradient(180deg,#071724a6,transparent 24%),linear-gradient(90deg,#071622d9 0%,#0716228a 38%,#07162212 76%),linear-gradient(0deg,#151922,#15192200 30%)}
.pjx .pjx-hero .company-scene__content{padding-block:148px 108px}
.pjx .pjx-hero .company-scene__content>*{max-width:650px}
.pjx .pjx-hero .eyebrow{font-size:11px;letter-spacing:.14em;margin-bottom:30px}
.pjx .pjx-hero h1{color:#f5f3ee;font-size:clamp(44px,4.65vw,72px);line-height:1.24;letter-spacing:-.025em;margin:0 0 28px;max-width:12em}
html[lang=en] .pjx .pjx-hero h1{font-size:clamp(44px,4.4vw,68px);line-height:1.12}
.pjx .pjx-hero .lede{color:#c5cbd2;max-width:35em;font-size:17px;line-height:1.9}
.pjx .pjx-hero .actions{margin-top:34px;gap:20px 28px}
.pjx .pjx-hero .text-link{font-size:14px;color:var(--gold)}
.pjx-hero-caption{position:absolute;bottom:25px;right:6.25%;z-index:3;max-width:36em;margin:0;color:#b7c0ca;font-size:10px;line-height:1.7;letter-spacing:.045em;text-align:right}
@media (prefers-reduced-motion:no-preference){
  .pjx-hero .company-scene__image{animation:pjx-scene-in 24s cubic-bezier(.22,.68,.28,1) both}
  @keyframes pjx-scene-in{from{transform:scale(1.02)}to{transform:scale(1.055)}}
}
@media (min-width:1921px){
  .pjx .pjx-hero h1,html[lang=en] .pjx .pjx-hero h1{font-size:clamp(72px,3.6vw,110px);max-width:15em}
  .pjx .pjx-hero .lede{font-size:clamp(18px,.7vw,23px)}
  .pjx .pjx-hero .eyebrow{font-size:clamp(12px,.46vw,15px)}
  .pjx .pjx-hero .company-scene__content>*{max-width:none}
  .pjx .pjx-hero .lede{max-width:35em}
}
@media (max-width:900px){
  .pjx .pjx-hero{min-height:760px}
  .pjx .pjx-hero .company-scene__content>*{max-width:570px}
}
@media (max-width:760px){
  .pjx .pjx-hero{align-items:center}
  .pjx-hero .company-scene__image{object-position:66% 30%}
  .pjx-hero .company-scene__shade{background:linear-gradient(180deg,#071724a6,transparent 22%),linear-gradient(0deg,#151922 0%,#0c1118eb 36%,#0c11189c 62%,#0c11181f 92%)}
}
@media (max-width:600px){
  .pjx .pjx-hero{min-height:780px;align-items:flex-end}
  .pjx .pjx-hero .company-scene__content{padding-block:145px 88px}
  .pjx .pjx-hero .company-scene__content>*{max-width:none}
  .pjx .pjx-hero .eyebrow{font-size:10px;letter-spacing:.1em;margin-bottom:24px}
  .pjx .pjx-hero h1,html[lang=en] .pjx .pjx-hero h1{font-size:40px;line-height:1.32;margin-bottom:24px}
  html[lang=en] .pjx .pjx-hero h1{font-size:42px;line-height:1.12}
  .pjx .pjx-hero .lede{font-size:15px;line-height:1.85;max-width:none}
  .pjx .pjx-hero .actions{gap:20px;margin-top:27px;align-items:flex-start;flex-direction:column}
  .pjx .pjx-hero .button{font-size:13px;max-width:100%}
  .pjx .pjx-hero .text-link{font-size:13px}
  .pjx-hero-caption{bottom:22px;right:22px;left:22px;font-size:9px;text-align:left}
}

/* Index of work */
.pjx .pjx-index{background:#151922;color:var(--pjx-ink);padding:clamp(96px,9vw,150px) 0 clamp(88px,8vw,130px)}
.pjx-index .section-head{margin:0 0 clamp(40px,4.2vw,64px);align-items:end}
.pjx-index .section-head>p{color:var(--pjx-text)}
.pjx-toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 40px;padding:6px 0 14px;border-bottom:1px solid var(--pjx-rule)}
.pjx-filters{display:flex;flex-wrap:wrap;gap:6px 32px}
.pjx-views{display:flex;gap:24px}
.pjx-filters button,.pjx-views button{position:relative;appearance:none;background:none;border:0;border-radius:0;padding:6px 0;font:inherit;font-size:14px;line-height:1.4;letter-spacing:.06em;color:var(--pjx-muted);cursor:pointer;transition:color .2s ease}
.pjx-filters button:hover,.pjx-views button:hover,.pjx-filters button[aria-pressed="true"],.pjx-views button[aria-pressed="true"]{color:var(--pjx-ink)}
.pjx-filters button:after,.pjx-views button:after{content:"";position:absolute;left:0;right:0;bottom:-15px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .32s cubic-bezier(.22,.75,.24,1)}
.pjx-filters button[aria-pressed="true"]:after,.pjx-views button[aria-pressed="true"]:after{transform:none}
.pjx-filters sup{margin-left:5px;font-size:10px;line-height:1;letter-spacing:.04em;color:var(--gold)}

.pjx-items{list-style:none;margin:clamp(44px,4.4vw,72px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(60px,5.6vw,96px) clamp(24px,2.8vw,48px)}
.pjx-item{display:grid;grid-template-areas:"media" "no" "name" "loc";margin:0;min-width:0}
.pjx-item[hidden]{display:none}
.pjx .pjx-item__media{grid-area:media;margin:0 0 22px;aspect-ratio:1;overflow:hidden;border-radius:12px;background:#222934}
.pjx-item__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1),filter .5s ease}
/* A light, shared grade (2026-10-07): the sources range from saturated
   renderings to night photographs, so each is eased slightly in saturation
   and brightness to sit together. No colour cast; hovering shows the original. */
.pjx-item__media img{filter:saturate(.84) contrast(1.03) brightness(.96)}
@media (hover:hover){.pjx-item:hover .pjx-item__media img{filter:none}}
.pjx-item__no{grid-area:no;font-size:12px;line-height:1.4;letter-spacing:.16em;color:var(--gold)}
.pjx .pjx-item__name{grid-area:name;margin:10px 0 6px;font-size:clamp(19px,1.45vw,23px);line-height:1.4;letter-spacing:.02em;color:var(--pjx-ink)}
.pjx-item__loc{grid-area:loc;font-size:13px;line-height:1.6;letter-spacing:.06em;color:var(--pjx-muted)}
@media (hover:hover) and (prefers-reduced-motion:no-preference){
  .pjx-item:hover .pjx-item__media img{transform:scale(1.04)}
}
.pjx-list-head{display:none}

.pjx-index[data-view="list"] .pjx-list-head,.pjx-index[data-view="list"] .pjx-item{display:grid;grid-template-columns:88px minmax(0,2.4fr) minmax(0,1.6fr);grid-template-areas:none;gap:24px;align-items:baseline}
.pjx-index[data-view="list"] .pjx-list-head{padding:26px 0 12px;font-size:12px;letter-spacing:.12em;color:var(--pjx-muted)}
.pjx-index[data-view="list"] .pjx-items{display:block;margin-top:0;border-top:1px solid var(--pjx-line)}
.pjx-index[data-view="list"] .pjx-item{padding:22px 0;border-bottom:1px solid var(--pjx-line)}
.pjx-index[data-view="list"] .pjx-item[hidden]{display:none}
.pjx-index[data-view="list"] .pjx-item:hover{background:#ffffff08}
.pjx-index[data-view="list"] .pjx-item>*{grid-area:auto}
.pjx-index[data-view="list"] .pjx-item__media{display:none}
.pjx-index[data-view="list"] .pjx-item__no{padding-left:4px}
.pjx-index[data-view="list"] .pjx-item__name{margin:0;font-size:21px}
.pjx-index[data-view="list"] .pjx-item__loc{font-size:14px}
.pjx-preview{position:fixed;left:0;top:0;z-index:30;width:300px;height:225px;object-fit:cover;border-radius:12px;pointer-events:none;opacity:0;transition:opacity .2s ease;box-shadow:0 24px 60px #00000080}
.pjx-preview.is-on{opacity:1}

@media (max-width:1100px){
  .pjx-items{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:760px){
  .pjx-items{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 16px;margin-top:32px}
  .pjx .pjx-item__media{margin-bottom:16px;border-radius:10px}
  .pjx .pjx-item__name{margin:6px 0 2px;font-size:16px}
  .pjx-item__loc{font-size:12px}
  .pjx-toolbar{align-items:flex-start;flex-direction:column;gap:10px}
  .pjx-filters{gap:4px 20px}
  .pjx-filters button:after{bottom:0;height:1px}
  .pjx-views button:after{bottom:0;height:1px}
  .pjx-index[data-view="list"] .pjx-list-head{display:none}
  .pjx-index[data-view="list"] .pjx-item{grid-template-columns:44px 1fr;gap:2px 12px;padding:16px 0}
  .pjx-index[data-view="list"] .pjx-item__name{grid-column:2;font-size:17px}
  .pjx-index[data-view="list"] .pjx-item__loc{grid-column:2;font-size:12px}
}
@media (prefers-reduced-motion:reduce){.pjx-item__media img,.pjx-preview,.pjx-filters button:after,.pjx-views button:after{transition:none}}