.hero-mark{text-align:center;place-items:center;min-height:92vh;padding-top:140px;display:grid}.hero-mark img{width:min(260px,50vw);height:auto;margin:0 auto 44px}.hero-mark h1{margin-top:22px;font-size:clamp(40px,6vw,84px)}.grid.four{grid-template-columns:repeat(4,1fr)}.grid.two{grid-template-columns:repeat(2,1fr)}.step{gap:26px;min-height:0;margin:0}.step svg,.step img{width:120px;height:120px;margin:12px auto 0;display:block}.step figcaption{color:var(--grey);font-size:15px}.step figcaption .dot{color:var(--grey);margin-bottom:12px;padding:0;display:block}.step b{color:var(--ink);font-weight:400}.swatch{border-radius:var(--r-card);place-items:center;padding:44px 20px;display:grid}.swatch img{width:min(420px,100%);height:auto}.swatch.paper{background:var(--paper)}.swatch.ink{background:var(--ink)}#type .card{background:var(--paper)}.rules{color:var(--grey);grid-template-columns:repeat(2,1fr);gap:14px 32px;margin:28px 0 0;padding:0;font-size:15px;list-style:none;display:grid}.rules .dot{color:var(--ink);margin-right:10px;font-size:14px}.sizes{flex-wrap:wrap;align-items:flex-end;gap:26px;display:flex}.sizes .gap{width:40px}.specimen{margin:0 0 18px;color:var(--ink)!important}.specimen.text{letter-spacing:-.02em;font-size:36px;line-height:1.1}.specimen.dots{font:900 44px/1 var(--font-dot)}.specimen.mono-s{font:400 22px/1.2 var(--font-mono);text-transform:uppercase}#type .card{min-height:240px}#type .card .dot{padding-bottom:36px}.colours{grid-template-columns:repeat(4,1fr) 1.4fr;gap:12px;display:grid}.colours div{border-radius:var(--r-card);flex-direction:column;justify-content:space-between;min-height:160px;padding:16px;display:flex}.colours .redbox{background:var(--paper);position:relative}.colours .redbox:after{content:"";background:var(--red);border-radius:50%;width:22px;height:22px;margin:-11px;position:absolute;top:50%;left:50%}code.inline{font:400 .85em var(--font-mono);background:var(--white);border:1px solid var(--line);color:var(--ink);border-radius:3px;padding:1px 6px}.files{flex-wrap:wrap;gap:8px;display:flex}.files a{border-radius:var(--r-control);background:var(--white);align-items:center;height:36px;padding:0 12px;display:inline-flex}.files a:hover{background:var(--ink);color:var(--white)}footer.band{padding:32px 24px}@media (width<=860px){.grid.four,.grid.two,.rules,.colours{grid-template-columns:1fr}.colours div{min-height:96px}}
