.ps-limewash {
--pslw-paper: #f4f1ea;
--pslw-paper-deep: #e6ded2;
--pslw-ink: #141311;
--pslw-muted: rgba(20, 19, 17, 0.64);
--pslw-soft: rgba(20, 19, 17, 0.39);
--pslw-line: rgba(20, 19, 17, 0.14);
--pslw-line-strong: rgba(20, 19, 17, 0.24);
--pslw-dark: #11110f;
--pslw-light: #f3efe7;
--pslw-light-muted: rgba(243, 239, 231, 0.64);
--pslw-light-soft: rgba(243, 239, 231, 0.40);
--pslw-light-line: rgba(243, 239, 231, 0.14);
--pslw-serif: "Prata", Georgia, "Times New Roman", serif;
--pslw-sans: "Inter", "Helvetica Neue", Arial, sans-serif;
--pslw-mono: "JetBrains Mono", monospace;
--pslw-gutter: clamp(22px, 4.8vw, 88px);
--pslw-max: 1680px;
min-width: 0;
overflow-x: hidden;
overflow-x: clip;
background: var(--pslw-paper);
color: var(--pslw-ink);
}
.ps-limewash *,
.ps-limewash *::before,
.ps-limewash *::after {
box-sizing: border-box;
}
.ps-limewash :where(h1, h2, h3, p, figure, dl, dd) {
margin: 0;
}
.ps-limewash :where(h1, h2, h3) {
font-family: var(--pslw-serif) !important;
font-weight: 400 !important;
font-style: normal !important;
text-transform: none !important;
}
.ps-limewash :where(p, dd) {
font-family: var(--pslw-sans);
}
.pslw-shell {
width: calc(100% - (var(--pslw-gutter) * 2));
max-width: var(--pslw-max);
margin-inline: auto;
}
.pslw-kicker {
font-family: var(--pslw-mono) !important;
font-size: 10px;
line-height: 1.45;
font-weight: 400;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--pslw-soft);
}
.pslw-kicker--light {
color: var(--pslw-light-soft);
}
.pslw-actions,
.pslw-system__actions {
display: flex;
flex-wrap: wrap;
gap: 8px 32px;
align-items: center;
}
.pslw-link {
position: relative;
display: inline-flex;
gap: 13px;
align-items: center;
min-height: 44px;
padding-block: 9px;
font-family: var(--pslw-mono) !important;
font-size: 11.5px;
line-height: 1.25;
font-weight: 400;
letter-spacing: 0.09em;
text-transform: uppercase;
text-decoration: none !important;
color: rgba(20, 19, 17, 0.86);
}
.pslw-link::after {
position: absolute;
right: 0;
bottom: 1px;
left: 0;
height: 1px;
content: "";
background: currentColor;
opacity: 0.42;
transform: scaleX(.5);
transform-origin: left center;
}
.pslw-link > span[aria-hidden="true"] {
display: inline-block;
}
.pslw-link--secondary {
color: rgba(20, 19, 17, 0.54);
}
.pslw-link--light {
color: rgba(243, 239, 231, 0.90);
}
.pslw-link:focus-visible {
outline: 1px solid currentColor;
outline-offset: 5px;
}
.pslw-hero {
padding: clamp(150px, 11vw, 204px) 0 clamp(90px, 7.5vw, 130px);
background: var(--pslw-paper);
}
.pslw-hero__grid {
display: grid;
grid-template-columns: minmax(0, 1.06fr) minmax(420px, 0.74fr);
gap: clamp(62px, 8vw, 144px);
align-items: center;
}
.pslw-hero__content {
max-width: 880px;
}
.pslw-hero__title {
margin-top: clamp(28px, 3.2vw, 54px) !important;
font-size: clamp(76px, 8.3vw, 150px);
line-height: .95;
letter-spacing: -.07em;
}
.pslw-hero__statement {
max-width: 720px;
margin-top: clamp(34px, 3.2vw, 52px) !important;
font-family: var(--pslw-serif) !important;
font-size: clamp(30px, 2.6vw, 48px);
line-height: 1.08;
letter-spacing: -.052em;
color: rgba(20, 19, 17, .90);
text-wrap: balance;
}
.pslw-hero__lead {
max-width: 620px;
margin-top: clamp(22px, 2.2vw, 34px) !important;
font-size: clamp(15px, .98vw, 17px);
line-height: 1.68;
color: var(--pslw-muted);
}
.pslw-hero .pslw-actions {
margin-top: clamp(28px, 3vw, 46px);
}
.pslw-hero__media {
aspect-ratio: 4 / 5;
overflow: hidden;
background: #ddd6ca;
}
.pslw-hero__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.pslw-character {
padding: clamp(84px, 7.6vw, 132px) 0;
background: var(--pslw-dark);
color: var(--pslw-light);
}
.pslw-character__grid {
display: grid;
grid-template-columns: minmax(330px, .78fr) minmax(0, 1.02fr);
gap: clamp(72px, 9vw, 164px);
align-items: start;
}
.pslw-character__title {
max-width: 10.5ch;
margin-top: clamp(24px, 2.8vw, 42px) !important;
font-size: clamp(46px, 4.5vw, 80px);
line-height: 1.04;
letter-spacing: -.058em;
color: var(--pslw-light);
}
.pslw-character__content {
padding-top: clamp(36px, 4.2vw, 72px);
}
.pslw-character__intro {
max-width: 650px;
font-size: clamp(15px, 1vw, 17px);
line-height: 1.7;
color: var(--pslw-light-muted);
}
.pslw-character__facts {
margin-top: clamp(40px, 4vw, 66px) !important;
border-top: 1px solid var(--pslw-light-line);
}
.pslw-character__facts > div {
display: grid;
grid-template-columns: minmax(170px, .34fr) minmax(0, .66fr);
gap: 32px;
padding: clamp(24px, 2.4vw, 36px) 0;
border-bottom: 1px solid var(--pslw-light-line);
}
.pslw-character__facts dt {
font-family: var(--pslw-serif);
font-size: clamp(22px, 1.7vw, 29px);
line-height: 1.18;
color: rgba(243, 239, 231, .90);
}
.pslw-character__facts dd {
max-width: 520px;
font-size: clamp(14.5px, .96vw, 17px);
line-height: 1.65;
color: var(--pslw-light-muted);
}
.pslw-palette {
padding: clamp(90px, 8vw, 140px) 0;
background: var(--pslw-paper);
}
.pslw-palette__head {
display: grid;
grid-template-columns: minmax(130px, .18fr) minmax(440px, .48fr) minmax(300px, .34fr);
gap: clamp(36px, 5vw, 92px);
align-items: end;
margin-bottom: clamp(54px, 5.8vw, 92px);
}
.pslw-palette__title {
max-width: 10.5ch;
font-size: clamp(44px, 4.25vw, 74px);
line-height: 1.06;
letter-spacing: -.055em;
}
.pslw-palette__intro {
max-width: 520px;
padding-bottom: 6px;
font-size: clamp(15px, .96vw, 17px);
line-height: 1.68;
color: var(--pslw-muted);
}
.pslw-palette__directions {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
border-top: 1px solid var(--pslw-line-strong);
border-bottom: 1px solid var(--pslw-line-strong);
}
.pslw-direction {
display: grid;
grid-template-columns: minmax(150px, .33fr) minmax(0, .67fr);
gap: clamp(26px, 3vw, 52px);
align-items: center;
min-width: 0;
padding: clamp(34px, 3.6vw, 58px) clamp(30px, 3.8vw, 66px);
border-bottom: 1px solid var(--pslw-line);
}
.pslw-direction:nth-child(odd) {
padding-left: 0;
border-right: 1px solid var(--pslw-line);
}
.pslw-direction:nth-child(even) {
padding-right: 0;
}
.pslw-direction:nth-last-child(-n + 2) {
border-bottom: 0;
}
.pslw-direction__title {
font-size: clamp(27px, 2.3vw, 40px);
line-height: 1.08;
letter-spacing: -.05em;
}
.pslw-direction__swatches {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: clamp(7px, .75vw, 12px);
}
.pslw-swatch {
display: block;
aspect-ratio: 4 / 5;
overflow: hidden;
background: var(--pslw-swatch-color, #c4bdb1);
border: 1px solid rgba(20, 19, 17, .07);
}
.pslw-palette__foot {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 44px;
align-items: center;
padding-top: clamp(34px, 3.8vw, 58px);
}
.pslw-palette__foot p {
max-width: 700px;
font-size: clamp(14px, .9vw, 16px);
line-height: 1.65;
color: var(--pslw-muted);
}
.pslw-samples {
padding: clamp(90px, 8vw, 142px) 0;
background: var(--pslw-paper-deep);
}
.pslw-samples__grid {
display: grid;
grid-template-columns: minmax(320px, .78fr) minmax(520px, 1.22fr);
gap: clamp(64px, 8vw, 146px);
align-items: center;
}
.pslw-samples__content {
max-width: 650px;
}
.pslw-samples__title {
max-width: 10ch;
margin-top: clamp(24px, 2.8vw, 42px) !important;
font-size: clamp(42px, 4.1vw, 72px);
line-height: 1.06;
letter-spacing: -.055em;
}
.pslw-samples__lead {
max-width: 560px;
margin-top: clamp(26px, 2.7vw, 40px) !important;
font-size: clamp(15px, .96vw, 17px);
line-height: 1.7;
color: var(--pslw-muted);
}
.pslw-samples__content .pslw-link {
margin-top: clamp(26px, 3vw, 44px);
}
.pslw-samples__media {
position: relative;
min-height: clamp(480px, 42vw, 690px);
}
.pslw-samples__media-main {
position: absolute;
inset: 0 0 11% 17%;
overflow: hidden;
background: #d4ccbf;
}
.pslw-samples__media-small {
position: absolute;
left: 0;
bottom: 0;
width: 42%;
aspect-ratio: 4 / 3;
overflow: hidden;
background: #ddd6cb;
box-shadow: 0 0 0 10px var(--pslw-paper-deep);
}
.pslw-samples__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.pslw-system {
scroll-margin-top: 108px;
padding: clamp(92px, 8vw, 144px) 0 clamp(84px, 7vw, 124px);
background: var(--pslw-paper);
}
.pslw-system__head {
display: grid;
grid-template-columns: minmax(130px, .18fr) minmax(440px, .50fr) minmax(300px, .32fr);
gap: clamp(36px, 5vw, 92px);
align-items: end;
margin-bottom: clamp(48px, 5vw, 82px);
}
.pslw-system__title {
max-width: 11ch;
font-size: clamp(42px, 4vw, 70px);
line-height: 1.06;
letter-spacing: -.054em;
}
.pslw-system__intro {
max-width: 540px;
padding-bottom: 6px;
font-size: clamp(15px, .96vw, 17px);
line-height: 1.68;
color: var(--pslw-muted);
}
.pslw-system__sequence {
display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
gap: clamp(18px, 2vw, 36px);
align-items: center;
padding: clamp(24px, 2.6vw, 38px) 0;
border-top: 1px solid var(--pslw-line-strong);
border-bottom: 1px solid var(--pslw-line-strong);
}
.pslw-system__sequence span:nth-child(odd) {
font-family: var(--pslw-serif);
font-size: clamp(25px, 2.2vw, 39px);
line-height: 1.05;
text-align: center;
}
.pslw-system__sequence span:nth-child(even) {
font-family: var(--pslw-mono);
font-size: 16px;
color: var(--pslw-soft);
}
.pslw-system__stages {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
border-bottom: 1px solid var(--pslw-line-strong);
}
.pslw-system__stages article {
padding: clamp(46px, 5vw, 82px) clamp(42px, 5vw, 88px) clamp(48px, 5vw, 82px);
}
.pslw-system__stages article:first-child {
padding-left: 0;
border-right: 1px solid var(--pslw-line);
}
.pslw-system__stages article:last-child {
padding-right: 0;
}
.pslw-system__label {
margin-bottom: clamp(24px, 2.6vw, 38px) !important;
font-family: var(--pslw-mono) !important;
font-size: 9px;
line-height: 1.45;
letter-spacing: .16em;
text-transform: uppercase;
color: var(--pslw-soft);
}
.pslw-system__stages h3 {
font-size: clamp(48px, 5vw, 86px);
line-height: 1;
letter-spacing: -.065em;
}
.pslw-system__stages article > p:last-child {
max-width: 600px;
margin-top: clamp(24px, 2.8vw, 42px) !important;
font-size: clamp(15px, .95vw, 17px);
line-height: 1.68;
color: var(--pslw-muted);
}
.pslw-specs {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-top: clamp(42px, 4.4vw, 68px) !important;
border-top: 1px solid var(--pslw-line);
border-bottom: 1px solid var(--pslw-line);
}
.pslw-specs > div {
min-width: 0;
padding: 24px clamp(18px, 2.2vw, 36px);
border-right: 1px solid var(--pslw-line);
}
.pslw-specs > div:first-child {
padding-left: 0;
}
.pslw-specs > div:last-child {
padding-right: 0;
border-right: 0;
}
.pslw-specs dt {
font-family: var(--pslw-mono);
font-size: 9px;
line-height: 1.4;
letter-spacing: .14em;
text-transform: uppercase;
color: var(--pslw-soft);
}
.pslw-specs dd {
margin-top: 10px !important;
font-family: var(--pslw-sans);
font-size: 14px;
line-height: 1.5;
color: rgba(20, 19, 17, .76);
}
.pslw-system__actions {
margin-top: clamp(34px, 3.8vw, 58px);
}
.pslw-order {
padding: clamp(82px, 7.5vw, 132px) 0;
background: var(--pslw-dark);
color: var(--pslw-light);
}
.pslw-order__grid {
display: grid;
grid-template-columns: minmax(330px, .72fr) minmax(520px, 1.28fr);
gap: clamp(62px, 8vw, 144px);
align-items: center;
}
.pslw-order__content {
max-width: 650px;
}
.pslw-order__title {
max-width: 9ch;
margin-top: clamp(26px, 3vw, 46px) !important;
font-size: clamp(46px, 4.6vw, 80px);
line-height: 1.04;
letter-spacing: -.058em;
color: var(--pslw-light);
}
.pslw-order__text {
max-width: 520px;
margin-top: clamp(26px, 2.8vw, 42px) !important;
font-size: clamp(15px, .96vw, 17px);
line-height: 1.68;
color: var(--pslw-light-muted);
}
.pslw-order__content .pslw-link {
margin-top: clamp(28px, 3vw, 46px);
}
.pslw-order__media {
aspect-ratio: 16 / 10.4;
overflow: hidden;
background: #cfc6b8;
}
.pslw-order__image {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
@supports (content-visibility: auto) {
.pslw-palette,
.pslw-samples,
.pslw-system,
.pslw-order {
content-visibility: auto;
contain-intrinsic-size: 1px 900px;
}
}
@media (max-width: 1180px) {
.pslw-hero__grid {
grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
gap: 54px;
}
.pslw-hero__title {
font-size: clamp(72px, 10vw, 118px);
}
.pslw-character__grid {
grid-template-columns: minmax(280px, .70fr) minmax(0, 1fr);
gap: 56px;
}
.pslw-palette__head,
.pslw-system__head {
grid-template-columns: minmax(120px, .2fr) minmax(0, .8fr);
align-items: start;
}
.pslw-palette__intro,
.pslw-system__intro {
grid-column: 2;
}
.pslw-samples__grid,
.pslw-order__grid {
grid-template-columns: minmax(300px, .72fr) minmax(420px, 1fr);
gap: 54px;
}
.pslw-specs {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.pslw-specs > div:nth-child(2) {
padding-right: 0;
border-right: 0;
}
.pslw-specs > div:nth-child(3) {
padding-left: 0;
}
.pslw-specs > div:nth-child(-n + 2) {
border-bottom: 1px solid var(--pslw-line);
}
}
@media (max-width: 900px) {
.pslw-hero {
padding-top: clamp(132px, 16vw, 166px);
}
.pslw-hero__grid,
.pslw-character__grid,
.pslw-samples__grid,
.pslw-order__grid {
grid-template-columns: minmax(0, 1fr);
}
.pslw-hero__content,
.pslw-character__content,
.pslw-samples__content,
.pslw-order__content {
max-width: 760px;
}
.pslw-hero__media {
margin-inline: calc(var(--pslw-gutter) * -1);
aspect-ratio: 16 / 10;
}
.pslw-character__content {
padding-top: 0;
}
.pslw-palette__head,
.pslw-system__head {
grid-template-columns: minmax(0, 1fr);
gap: 22px;
}
.pslw-palette__intro,
.pslw-system__intro {
grid-column: auto;
}
.pslw-palette__directions {
grid-template-columns: minmax(0, 1fr);
}
.pslw-direction,
.pslw-direction:nth-child(odd),
.pslw-direction:nth-child(even),
.pslw-direction:nth-last-child(-n + 2) {
padding-inline: 0;
border-right: 0;
border-bottom: 1px solid var(--pslw-line);
}
.pslw-direction:last-child {
border-bottom: 0;
}
.pslw-samples__grid {
gap: 44px;
}
.pslw-samples__media {
min-height: clamp(430px, 68vw, 650px);
}
.pslw-system__stages {
grid-template-columns: minmax(0, 1fr);
}
.pslw-system__stages article,
.pslw-system__stages article:first-child,
.pslw-system__stages article:last-child {
padding-inline: 0;
border-right: 0;
}
.pslw-system__stages article:first-child {
border-bottom: 1px solid var(--pslw-line);
}
.pslw-order__media {
margin-inline: calc(var(--pslw-gutter) * -1);
}
}
@media (max-width: 767px) {
.ps-limewash {
--pslw-gutter: clamp(18px, 5.3vw, 24px);
}
.pslw-kicker {
font-size: 9px;
letter-spacing: .17em;
}
.pslw-link {
font-size: 11px;
letter-spacing: .08em;
}
.pslw-hero {
padding: 118px 0 66px;
}
.pslw-hero__grid {
gap: 34px;
}
.pslw-hero__title {
margin-top: 20px !important;
font-size: clamp(56px, 17vw, 82px);
line-height: .98;
letter-spacing: -.065em;
}
.pslw-hero__statement {
margin-top: 24px !important;
font-size: clamp(29px, 8.8vw, 40px);
line-height: 1.08;
}
.pslw-hero__lead {
margin-top: 18px !important;
font-size: 14px;
line-height: 1.64;
}
.pslw-hero .pslw-actions {
margin-top: 22px;
}
.pslw-hero__media {
aspect-ratio: 4 / 3;
}
.pslw-character,
.pslw-palette,
.pslw-samples,
.pslw-system,
.pslw-order {
padding-block: clamp(62px, 15vw, 82px);
}
.pslw-character__grid {
gap: 30px;
}
.pslw-character__title {
max-width: 12ch;
margin-top: 19px !important;
font-size: clamp(34px, 9.8vw, 46px);
line-height: 1.08;
}
.pslw-character__intro {
font-size: 14px;
line-height: 1.64;
}
.pslw-character__facts {
margin-top: 28px !important;
}
.pslw-character__facts > div {
grid-template-columns: minmax(0, 1fr);
gap: 8px;
padding: 20px 0 21px;
}
.pslw-character__facts dt {
font-size: 22px;
}
.pslw-character__facts dd {
font-size: 13.5px;
line-height: 1.62;
}
.pslw-palette__head,
.pslw-system__head {
margin-bottom: 34px;
}
.pslw-palette__title,
.pslw-system__title {
font-size: clamp(34px, 9.8vw, 46px);
line-height: 1.08;
}
.pslw-palette__intro,
.pslw-system__intro {
font-size: 14px;
line-height: 1.64;
}
.pslw-direction {
grid-template-columns: minmax(100px, .34fr) minmax(0, .66fr);
gap: 22px;
padding-block: 24px;
}
.pslw-direction__title {
font-size: clamp(25px, 7.4vw, 34px);
}
.pslw-direction__swatches {
gap: 6px;
}
.pslw-palette__foot {
grid-template-columns: minmax(0, 1fr);
gap: 18px;
padding-top: 30px;
}
.pslw-palette__foot p {
font-size: 13.5px;
}
.pslw-samples__title {
max-width: 11ch;
margin-top: 19px !important;
font-size: clamp(34px, 9.8vw, 46px);
line-height: 1.08;
}
.pslw-samples__lead {
margin-top: 20px !important;
font-size: 14px;
line-height: 1.64;
}
.pslw-samples__content .pslw-link {
margin-top: 20px;
}
.pslw-samples__media {
min-height: 84vw;
margin-inline: calc(var(--pslw-gutter) * -1);
}
.pslw-samples__media-main {
inset: 0 0 13% 12%;
}
.pslw-samples__media-small {
width: 46%;
box-shadow: 0 0 0 7px var(--pslw-paper-deep);
}
.pslw-system__sequence {
display: block;
padding: 0;
border-top: 1px solid var(--pslw-line-strong);
border-bottom: 1px solid var(--pslw-line-strong);
}
.pslw-system__sequence span:nth-child(odd) {
display: block;
padding: 17px 0 18px;
font-size: clamp(24px, 7vw, 31px);
line-height: 1.08;
text-align: left;
border-bottom: 1px solid var(--pslw-line);
}
.pslw-system__sequence span:nth-child(3) {
padding-left: clamp(12px, 4vw, 18px);
}
.pslw-system__sequence span:nth-child(5) {
padding-left: clamp(24px, 8vw, 36px);
border-bottom: 0;
}
.pslw-system__sequence span:nth-child(even) {
display: none;
}
.pslw-system__stages {
border-bottom: 0;
}
.pslw-system__stages article,
.pslw-system__stages article:first-child,
.pslw-system__stages article:last-child {
padding-block: 34px 36px;
}
.pslw-system__label {
margin-bottom: 20px !important;
}
.pslw-system__stages h3 {
font-size: clamp(46px, 13vw, 64px);
}
.pslw-system__stages article > p:last-child {
margin-top: 20px !important;
font-size: 14px;
line-height: 1.64;
}
.pslw-specs {
grid-template-columns: minmax(0, 1fr);
margin-top: 30px !important;
}
.pslw-specs > div,
.pslw-specs > div:first-child,
.pslw-specs > div:last-child {
padding: 17px 0;
border-right: 0;
border-bottom: 1px solid var(--pslw-line);
}
.pslw-specs > div:last-child {
border-bottom: 0;
}
.pslw-specs dd {
font-size: 13.5px;
}
.pslw-system__actions {
margin-top: 26px;
}
.pslw-order__grid {
gap: 34px;
}
.pslw-order__title {
max-width: 10ch;
margin-top: 20px !important;
font-size: clamp(36px, 10vw, 48px);
line-height: 1.07;
}
.pslw-order__text {
margin-top: 20px !important;
font-size: 14px;
line-height: 1.64;
}
.pslw-order__content .pslw-link {
margin-top: 21px;
}
.pslw-order__media {
aspect-ratio: 4 / 3;
}
}
@media (max-width: 340px) {
.ps-limewash {
--pslw-gutter: 16px;
}
.pslw-hero {
padding-top: 110px;
}
.pslw-hero__title {
font-size: 52px;
}
.pslw-hero__statement,
.pslw-character__title,
.pslw-palette__title,
.pslw-samples__title,
.pslw-system__title,
.pslw-order__title {
font-size: 31px;
}
.pslw-actions,
.pslw-system__actions {
display: grid;
justify-items: start;
}
.pslw-direction {
grid-template-columns: minmax(0, 1fr);
gap: 15px;
}
.pslw-direction__swatches {
max-width: 210px;
}
}
@media (hover: none) {
.pslw-link:hover > span[aria-hidden="true"] {
transform: none;
}
}
@media (prefers-reduced-motion: reduce) {
.ps-limewash *,
.ps-limewash *::before,
.ps-limewash *::after {
scroll-behavior: auto !important;
transition: none !important;
}
}