:root {
  --bg:#e9e1d2;
  --ink:#292722;
  --accent:#9a3d2d;
  --second:#426268;
  --wrap:min(1320px,calc(100% - 48px));
  font-family:Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.65
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  overflow-x:hidden
}
img {
  display:block;
  width:100%;
  height:auto;
  object-fit:cover
}
a {
  color:inherit
}
.skip {
  position:fixed;
  left:8px;
  top:8px;
  transform:translateY(-150%);
  background:#fff;
  padding:.5rem;
  z-index:99
}
.skip:focus {
  transform:none
}
.ps-header {
  width:var(--wrap);
  margin:auto;
  min-height:82px;
  display:flex;
  align-items:center;
  gap:2rem;
  border-bottom:2px solid
}
.brand {
  font-weight:900;
  font-size:1.35rem;
  text-decoration:none;
  margin-right:auto
}
.ps-header nav {
  display:flex;
  gap:1.25rem
}
.ps-header nav a {
  text-decoration:none
}
.ps-header button {
  display:none
}
.eyebrow {
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.72rem;
  font-weight:800
}
h1 {
  font-size:clamp(3.5rem,7.5vw,8.2rem);
  line-height:.9;
  letter-spacing:-.07em;
  margin:.5rem 0 1.2rem
}
h2 {
  font-size:clamp(2rem,4vw,4.5rem);
  line-height:1.05;
  letter-spacing:-.045em
}
h3 {
  font-size:1.4rem
}
.cta,form button {
  display:inline-block;
  background:var(--accent);
  color:var(--ink);
  border:2px solid var(--ink);
  padding:.75rem 1rem;
  text-decoration:none;
  font-weight:800
}
.ps-hero {
  width:var(--wrap);
  margin:2rem auto 0;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:2.5rem;
  align-items:center
}
.ps-hero figure {
  margin:0
}
.ps-hero img {
  height:690px
}
.ps-premise,.ps-line,.ps-record,.ps-statement,.ps-truth {
  width:min(1050px,calc(100% - 48px));
  margin:7rem auto
}
.ps-premise {
  display:grid;
  grid-template-columns:.35fr 1.65fr;
  gap:3rem
}
.ps-branch,.ps-drawing,.ps-capture,.ps-repro,.ps-sessions,.ps-paint,.ps-moods,.ps-crit,.ps-milestones,.ps-scope,.ps-release,.ps-retro {
  width:var(--wrap);
  margin:6rem auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
  align-items:center
}
.ps-branch img,.ps-drawing img,.ps-capture img,.ps-repro img,.ps-sessions img,.ps-paint img,.ps-moods img,.ps-crit img,.ps-milestones img,.ps-scope img,.ps-release img,.ps-retro img {
  height:500px
}
.ps-beats,.ps-grid,.ps-lanes {
  width:var(--wrap);
  margin:5rem auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:2px solid
}
.ps-beats {
  grid-template-columns:repeat(4,1fr)
}
.ps-beats article,.ps-grid article,.ps-lanes article {
  padding:2rem;
  border-right:1px solid
}
.ps-test,.ps-review {
  margin:0;
  background:var(--ink);
  color:var(--bg);
  display:grid;
  grid-template-columns:1.5fr .5fr;
  align-items:end
}
.ps-test img,.ps-review img {
  height:620px
}
.ps-test blockquote,.ps-review figcaption {
  font-size:1.5rem;
  padding:3rem
}
.ps-wall,.ps-curves {
  display:grid;
  grid-template-columns:1.4fr .6fr;
  background:var(--second);
  align-items:center
}
.ps-wall img,.ps-curves img {
  height:570px
}
.ps-wall div,.ps-curves div {
  padding:3rem
}
.line {
}
.wave {
}
.ps-line>div,.ps-record>div {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1rem;
  border-bottom:2px solid;
  padding-bottom:1rem
}
.ps-matrix {
  width:var(--wrap);
  margin:5rem auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1rem
}
.ps-matrix img {
  grid-column:1/-1;
  height:420px
}
.ps-matrix article {
  padding:1.5rem;
  border:1px solid
}
.ps-delivery,.ps-output {
  width:min(900px,calc(100% - 48px));
  margin:6rem auto;
  padding:3rem;
  border:3px solid
}
.ps-materials {
  display:grid;
  grid-template-columns:1.4fr repeat(3,.5fr);
  margin:6rem 0;
  background:var(--ink);
  color:var(--bg);
  align-items:end
}
.ps-materials img {
  height:570px
}
.ps-materials article {
  padding:2rem
}
.ps-contact {
  width:var(--wrap);
  margin:7rem auto 0;
  padding:4rem;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:5rem;
  background:var(--second)
}
.ps-contact address {
  font-style:normal
}
.ps-contact label {
  display:block;
  font-weight:700;
  margin-bottom:1rem
}
.ps-contact input,.ps-contact select,.ps-contact textarea {
  display:block;
  width:100%;
  padding:.75rem;
  margin-top:.3rem;
  border:1px solid;
  background:var(--bg);
  color:var(--ink)
}
.ps-footer {
  background:var(--ink);
  color:var(--bg);
  padding:3rem max(24px,calc((100% - 1320px)/2));
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:2rem
}
.ps-footer address {
  font-style:normal
}
.ps-footer nav {
  display:grid;
  gap:.3rem
}
.ps-legal {
  width:min(880px,calc(100% - 48px));
  margin:5rem auto
}
.ps-legal h1 {
  font-size:clamp(3rem,6vw,6rem)
}
.ps-legal h2 {
  font-size:2rem;
  margin-top:3rem
}
@media(max-width:820px) {
  .ps-header nav {
    display:none;
    position:absolute;
    top:75px;
    left:24px;
    right:24px;
    background:var(--bg);
    border:2px solid;
    padding:1rem;
    z-index:9;
    flex-direction:column
  }
  .ps-header nav.open {
    display:flex
  }
  .ps-header button {
    display:block;
    background:var(--accent);
    border:1px solid;
    padding:.5rem
  }
  .ps-hero,.ps-premise,.ps-branch,.ps-drawing,.ps-capture,.ps-repro,.ps-sessions,.ps-paint,.ps-moods,.ps-crit,.ps-milestones,.ps-scope,.ps-release,.ps-retro,.ps-contact,.ps-test,.ps-review,.ps-wall,.ps-curves {
    grid-template-columns:1fr
  }
  .ps-beats,.ps-grid,.ps-lanes,.ps-matrix,.ps-line>div,.ps-record>div,.ps-materials,.ps-footer {
    grid-template-columns:1fr
  }
  h1 {
    font-size:4rem
  }
  .ps-hero img {
    height:430px
  }
}
/* Portfolio-window opening: the image reads like a working wall, with a caption panel crossing it. */
.ps-hero {
  width:100%;
  margin:2rem 0 0;
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(360px,.72fr);
  gap:0;
  align-items:end
}
.ps-hero figure {
  margin:0
}
.ps-hero figure img {
  height:780px
}
.ps-hero>div {
  margin-left:-5rem;
  margin-bottom:4rem;
  padding:3rem;
  background:var(--bg);
  border:2px solid var(--ink);
  position:relative
}
.ps-hero h1 {
  font-size:clamp(3.4rem,6vw,6.7rem)
}
@media(max-width:820px) {
  .ps-hero {
    display:block
  }
  .ps-hero figure img {
    height:520px
  }
  .ps-hero>div {
    margin:-3rem 24px 0;
    padding:1.5rem
  }
}
/* Navigation: centred portfolio masthead */
.ps-header {
  min-height:142px;
  border:0;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-content:center;
  gap:.7rem
}
.ps-header .brand {
  width:100%;
  margin:0;
  text-align:center;
  font-family:Georgia,serif;
  font-size:2rem;
  font-weight:500
}
.ps-header nav {
  display:flex;
  gap:0;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink)
}
.ps-header nav a {
  padding:.45rem 1.2rem
}
.ps-header nav a+ a {
  border-left:1px solid var(--ink)
}
@media(max-width:820px) {
  .ps-header {
    display:flex;
    min-height:82px;
    justify-content:flex-start;
    flex-wrap:nowrap
  }
  .ps-header .brand {
    width:auto;
    margin-right:auto;
    text-align:left;
    font-family:inherit;
    font-size:1.35rem;
    font-weight:900
  }
  .ps-header nav {
    display:none
  }
  .ps-header nav.open {
    display:flex
  }
  .ps-header nav a {
    border:0;
    padding:0
  }
}
/* Site-specific privacy choice */
.ps-cookie {
  position:fixed;
  left:3vw;
  bottom:3vw;
  z-index:40;
  width:min(470px,92vw);
  padding:1.6rem 1.8rem;
  background:var(--bg);
  color:var(--ink);
  border:1px solid var(--ink);
  border-radius:48px 8px 48px 8px
}
.ps-cookie-title {
  font-family:Georgia,serif;
  font-size:1.35rem
}
.ps-cookie p {
  margin:.2rem 0 .8rem
}
.ps-cookie>div {
  display:flex;
  justify-content:flex-end;
  gap:.6rem
}
.ps-cookie button {
  padding:.55rem 1rem;
  border:1px solid var(--ink);
  border-radius:999px;
  background:var(--second);
  color:#fff;
  font-weight:800
}
.ps-cookie button[data-decline] {
  background:transparent;
  color:var(--ink)
}
.ps-cookie.is-hidden {
  display:none
}
.ps-purpose {
  width:var(--wrap);
  margin:7rem auto;
  display:grid;
  grid-template-columns:1.35fr .8fr .8fr;
  gap:2rem;
  align-items:start
}
.ps-purpose article {
  padding:1.6rem;
  border-top:2px solid var(--ink)
}
.ps-purpose h2,.ps-services h2,.ps-workflow h2 {
  margin-top:.4rem
}
.ps-services {
  width:var(--wrap);
  margin:7rem auto
}
.ps-services>div {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:2.5rem;
  border-top:2px solid var(--ink);
  border-bottom:2px solid var(--ink)
}
.ps-services article {
  padding:2rem
}
.ps-services article+article {
  border-left:1px solid var(--ink)
}
.ps-workflow {
  width:var(--wrap);
  margin:7rem auto;
  display:grid;
  grid-template-columns:.8fr 1.2fr;
  gap:5rem
}
.ps-workflow ol {
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:workflow
}
.ps-workflow li {
  counter-increment:workflow;
  padding:1.25rem 0 1.25rem 4rem;
  border-top:1px solid var(--ink);
  position:relative
}
.ps-workflow li::before {
  content:counter(workflow,decimal-leading-zero);
  position:absolute;
  left:0;
  font-family:Georgia,serif;
  font-size:1.35rem
}
@media(max-width:820px) {
  .ps-purpose,.ps-workflow,.ps-services>div {
    grid-template-columns:1fr
  }
  .ps-purpose {
    gap:1rem
  }
  .ps-services article+article {
    border-left:0;
    border-top:1px solid var(--ink)
  }
}

/* Contact spread: editorial briefing sheet rather than a generic split form. */
.ps-contact {
  width:min(1180px,calc(100% - 48px));
  margin:8rem auto 0;
  padding:0;
  display:grid;
  grid-template-columns:.68fr 1.32fr;
  gap:0;
  background:transparent;
  border:2px solid var(--ink)
}
.ps-contact-intro {
  grid-column:1/-1;
  padding:3rem;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  column-gap:4rem;
  border-bottom:2px solid var(--ink)
}
.ps-contact-intro .eyebrow {
  grid-column:1
}
.ps-contact-intro h2 {
  grid-column:1;
  margin:.5rem 0 0
}
.ps-contact-intro>p:last-child {
  grid-column:2;
  grid-row:1/3;
  align-self:center;
  max-width:580px
}
.ps-contact-card {
  padding:2.5rem;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:430px;
  background:var(--accent);
  color:#fff
}
.ps-contact-card>span {
  font-family:Georgia,serif;
  font-size:1.8rem
}
.ps-contact-card a {
  color:inherit
}
.ps-contact form {
  padding:2.5rem 3rem;
  background:#f7f1e5
}
.ps-form-pair {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem
}
.ps-form-action {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem
}
.ps-form-action small {
  max-width:330px
}
.ps-footer {
  background:var(--bg);
  color:var(--ink);
  border-top:1px solid var(--ink);
  grid-template-columns:1.1fr 1fr auto;
  align-items:end
}
.ps-footer-signature {
  display:grid;
  gap:.4rem
}
.ps-footer-signature strong {
  font-family:Georgia,serif;
  font-size:1.7rem
}
.ps-footer p {
  max-width:430px;
  margin:0;
  font-family:Georgia,serif;
  font-style:italic
}
@media(max-width:820px) {
  .ps-contact,
  .ps-contact-intro,
  .ps-form-pair,
  .ps-footer {
    grid-template-columns:1fr
  }
  .ps-contact-intro>p:last-child {
    grid-column:1;
    grid-row:auto
  }
  .ps-contact-card {
    min-height:260px
  }
  .ps-contact form {
    padding:1.5rem
  }
  .ps-form-action {
    align-items:flex-start;
    flex-direction:column
  }
}