@font-face {
  font-family:Inter;
  src:url('fonts/Inter_400Regular.ttf') format('truetype');
  font-weight:400;
  font-display:swap;
}
@font-face {
  font-family:Inter;
  src:url('fonts/Inter_600SemiBold.ttf') format('truetype');
  font-weight:600 900;
  font-display:swap;
}
@font-face {
  font-family:Saira;
  src:url('fonts/SairaExtraCondensed_600SemiBold.ttf') format('truetype');
  font-weight:600;
  font-display:swap;
}
@font-face {
  font-family:Saira;
  src:url('fonts/SairaExtraCondensed_700Bold.ttf') format('truetype');
  font-weight:700;
  font-display:swap;
}
:root {
  color-scheme:light dark;
  --paper:#F2EFE8;
  --raised:#F7F5F0;
  --ink:#16110F;
  --soft:#4A443E;
  --muted:#6A645B;
  --line:#DED8CE;
  --accent:#7E2229;
  --olive:#6B674A;
  --wall:#674936;
  --wood:#B58A5C;
}
@media(prefers-color-scheme:dark) {
  :root {
    --paper:#16110F;
    --raised:#211B18;
    --ink:#F2EFE8;
    --soft:#D1C9BD;
    --muted:#AEA397;
    --line:#41362F;
    --accent:#E1989E;
    --olive:#BAB58F;
    --wall:#37271F;
    --wood:#94704B;
  }
}
* {
  box-sizing:border-box;
}
html {
  -webkit-text-size-adjust:100%;
  scroll-padding-top:24px;
}
body {
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.75 Inter,Arial,sans-serif;
}
a {
  color:var(--accent);
  text-underline-offset:4px;
  text-decoration-thickness:1px;
}
a:hover {
  text-decoration-thickness:2px;
}
a:focus-visible,summary:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:5px;
  border-radius:2px;
}
::selection {
  background:var(--accent);
  color:var(--paper);
}
.skip {
  position:absolute;
  left:20px;
  top:-100px;
  z-index:5;
  background:var(--raised);
  padding:12px;
}
.skip:focus {
  top:12px;
}
.wrap {
  width:min(1160px,calc(100% - 96px));
  margin-inline:auto;
}
.site-header {
  min-height:116px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid var(--line);
}
.brand {
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  color:var(--accent);
  font:700 32px/1 Saira,Arial,sans-serif;
  letter-spacing:7px;
}
.brand img {
  width:42px;
  height:42px;
  border-radius:7px;
}
.site-nav {
  display:flex;
  gap:30px;
}
.site-nav a {
  display:flex;
  align-items:center;
  min-height:44px;
  color:var(--soft);
  font-size:13px;
  text-decoration:none;
}
.site-nav a:hover,.site-nav a[aria-current] {
  color:var(--accent);
}
.site-nav a[aria-current] {
  box-shadow:inset 0 -2px var(--accent);
}
.eyebrow {
  font-size:11px;
  font-weight:600;
  letter-spacing:2px;
  color:var(--olive);
  text-transform:uppercase;
}
.hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:64px;
  align-items:center;
  padding-block:64px 56px;
}
.hero .eyebrow {
  margin:0 0 28px;
}
h1,h2,h3 {
  font-family:Saira,Arial,sans-serif;
  font-weight:600;
  color:var(--ink);
}
h1 {
  font-size:76px;
  line-height:1.04;
  letter-spacing:-.5px;
  margin:0 0 26px;
}
.hero h1 {
  font-size:clamp(80px,9vw,132px);
  font-weight:700;
  line-height:.94;
  margin:0 0 28px;
}
.rule {
  border:0;
  border-top:2px solid var(--accent);
  margin:0 0 24px;
}
.hero-copy>p:not(.eyebrow) {
  max-width:440px;
  color:var(--soft);
  font-size:17px;
  line-height:1.8;
}
.release {
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:22px;
  font-size:12px;
  font-weight:600;
  color:var(--olive);
}
.release::before {
  content:'';
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--olive);
}
.wall {
  position:relative;
  aspect-ratio:1/1.03;
  padding:40px 32px 32px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px 25px;
  background:repeating-linear-gradient(0deg,transparent 0 61px,#21130b40 62px,#bc936522 64px),repeating-linear-gradient(2deg,#ffffff03 0 1px,transparent 1px 7px),linear-gradient(100deg,var(--wall),#4B3325);
  box-shadow:inset 0 0 60px #100a0633;
}
.slot {
  position:relative;
  align-self:start;
  aspect-ratio:1;
  box-shadow:0 5px 12px #160f0a55;
  background:#F2EFE8;
  border-radius:2px;
}
.slot::after {
  content:'';
  position:absolute;
  bottom:-8px;
  left:22%;
  width:56%;
  height:9px;
  background:linear-gradient(var(--wood) 0 35%,#6E4A2E 35%);
  border-radius:1px;
  box-shadow:0 4px 4px #160f0a55;
}
.slot:nth-child(2),.slot:nth-child(8) {
  background:#7E2229;
}
.slot:nth-child(3),.slot:nth-child(7) {
  background:#8C8B69;
}
.slot:nth-child(5) {
  background:#C2AC88;
}
.slot:nth-child(6) {
  background:#322C27;
}
.slot:nth-child(4) {
  background:#7B5040;
}
.record {
  position:absolute;
  inset:12%;
  border-radius:50%;
  background:repeating-radial-gradient(circle,#16110F 0 3px,#302721 4px,#16110F 5px 7px);
  box-shadow:1px 3px 4px #0003;
}
.record::before {
  content:'';
  position:absolute;
  inset:35%;
  border-radius:50%;
  background:#C1A27D;
}
.record::after {
  content:'';
  position:absolute;
  width:4%;
  height:4%;
  left:48%;
  top:48%;
  border-radius:50%;
  background:#16110F;
}
.slot:nth-child(2) .record::before,.slot:nth-child(5) .record::before {
  background:#7E2229;
}
.slot:nth-child(3) .record {
  inset:20%;
  background:#F2EFE8;
}
.slot:nth-child(3) .record::before {
  background:#8C8B69;
}
.slot:nth-child(4) .record {
  inset:0 50% 0 -50%;
  border-radius:0;
  background:#C2AC88;
  box-shadow:none;
}
.slot:nth-child(4) {
  overflow:hidden;
}
.slot:nth-child(4)::after {
  display:none;
}
.slot:nth-child(4) .record::before {
  inset:22% -60% 22% 40%;
  background:#7E2229;
}
.slot:nth-child(4) .record::after {
  display:none;
}
.slot:nth-child(6) .record {
  inset:18%;
  background:#8C8B69;
}
.slot:nth-child(6) .record::before {
  background:#322C27;
}
.slot:nth-child(7) .record {
  border-radius:0;
  inset:14%;
  background:#F2EFE8;
  box-shadow:none;
}
.slot:nth-child(7) .record::before {
  inset:15%;
  background:#8C8B69;
}
.slot:nth-child(8) .record {
  inset:18%;
  background:#C2AC88;
}
.slot:nth-child(8) .record::before {
  background:#7E2229;
}
.slot:nth-child(9) {
  background:transparent;
  box-shadow:none;
  border:2px dashed #E4D7C1aa;
}
.slot:nth-child(9) .record {
  display:none;
}
.wall-caption {
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin:12px 0 0;
  color:var(--olive);
  font-size:10px;
  letter-spacing:1.5px;
  text-transform:uppercase;
}
.links {
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  padding:0;
  margin:0 0 68px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.links li+li {
  border-left:1px solid var(--line);
}
.links a {
  display:grid;
  grid-template-columns:1fr auto;
  align-content:center;
  gap:10px;
  padding:24px;
  min-height:116px;
  color:var(--ink);
  text-decoration:none;
}
.links a:hover {
  background:var(--raised);
}
.links .eyebrow {
  grid-column:1/-1;
  font-size:10px;
}
.links .link-title {
  font:600 27px/1.1 Saira,Arial,sans-serif;
}
.arrow {
  color:var(--accent);
  font-size:22px;
  line-height:1;
}
.document {
  display:grid;
  grid-template-columns:230px minmax(0,740px);
  gap:70px;
  padding-block:56px 80px;
  align-items:start;
}
.contents {
  position:sticky;
  top:32px;
}
.contents .eyebrow {
  margin:0 0 18px;
}
.contents nav {
  display:flex;
  flex-direction:column;
  gap:5px;
}
.contents nav a {
  font-size:12px;
  line-height:1.5;
  text-decoration:none;
  color:var(--soft);
  padding:9px 0;
  border-bottom:1px solid var(--line);
}
.contents nav a:hover {
  color:var(--accent);
}
.mobile-contents {
  display:none;
}
.article {
  min-width:0;
}
.article>.eyebrow {
  margin:0 0 18px;
  color:var(--olive);
}
.article h1 {
  max-width:700px;
}
.article h2 {
  font-size:36px;
  line-height:1.15;
  margin:48px 0 18px;
  padding-top:20px;
  border-top:1px solid var(--line);
  scroll-margin-top:24px;
}
.article h3 {
  font-size:28px;
  line-height:1.2;
  margin:32px 0 12px;
}
.article p,.article li {
  color:var(--soft);
}
.article p {
  margin:0 0 20px;
}
.article strong {
  font-weight:600;
  color:var(--ink);
}
.article ul,.article ol {
  padding-left:24px;
  margin:12px 0 24px;
}
.article li {
  padding-left:4px;
  margin:7px 0;
}
.article li ul,.article li ol {
  margin-block:8px;
}
.article code {
  font-size:.88em;
  background:var(--raised);
  padding:3px 5px;
  overflow-wrap:anywhere;
}
.article a {
  overflow-wrap:anywhere;
}
.table {
  margin:24px 0;
  overflow-x:auto;
  border:1px solid var(--line);
  background:var(--raised);
}
table {
  width:100%;
  border-collapse:collapse;
  font-size:13px;
  line-height:1.7;
}
th,td {
  text-align:left;
  vertical-align:top;
  padding:14px;
  border-bottom:1px solid var(--line);
}
th {
  color:var(--ink);
  font-weight:600;
}
td {
  color:var(--soft);
}
tr:last-child td {
  border-bottom:0;
}
.site-footer {
  border-top:1px solid var(--line);
  padding-block:32px 40px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px 64px;
  color:var(--muted);
  font-size:12px;
  line-height:1.8;
}
.site-footer p {
  margin:0;
}
.footer-contact {
  color:var(--ink);
}
.footer-contact a {
  display:inline-block;
  min-height:32px;
}
.copyright {
  grid-column:1/-1;
}
.not-found {
  padding-block:72px 80px;
  max-width:740px;
}
.not-found h1 {
  font-size:100px;
}
.not-found .eyebrow {
  margin:0 0 24px;
}
.not-found p {
  color:var(--soft);
}
.button {
  display:inline-flex;
  align-items:center;
  gap:32px;
  min-height:52px;
  background:#7E2229;
  color:#F7F5F0;
  border-radius:6px;
  text-decoration:none;
  padding:12px 24px;
  font-weight:600;
  font-size:14px;
  margin-top:16px;
}
.button:hover {
  background:#681b21;
}
@media(max-width:1000px) {
  .wrap {
    width:calc(100% - 64px);
  }
  .hero {
    gap:32px;
  }
  .hero h1 {
    font-size:100px;
  }
  .wall {
    padding:30px 24px;
    gap:24px 18px;
  }
  .document {
    grid-template-columns:190px minmax(0,1fr);
    gap:40px;
  }
  .article h1 {
    font-size:64px;
  }
  .links a {
    padding:20px;
  }
  .links .link-title {
    font-size:24px;
  }
}
@media(max-width:760px) {
  .wrap {
    width:calc(100% - 40px);
  }
  .site-header {
    min-height:116px;
    flex-direction:column;
    justify-content:center;
    gap:10px;
    padding-block:20px 8px;
  }
  .brand {
    font-size:30px;
    letter-spacing:6px;
  }
  .brand img {
    width:32px;
    height:32px;
  }
  .site-nav {
    gap:28px;
  }
  .site-nav a {
    font-size:12px;
    min-height:40px;
  }
  .hero {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    padding-block:32px;
    gap:28px;
  }
  .hero-copy {
    order:2;
  }
  .hero-visual {
    order:1;
  }
  .wall {
    aspect-ratio:1.55;
    padding:22px 35px;
    gap:22px 27px;
    grid-template-rows:repeat(2,1fr);
    overflow:hidden;
  }
  .slot:nth-child(n+7) {
    display:none;
  }
  .hero .eyebrow {
    margin:0 0 20px;
  }
  .hero h1 {
    font-size:80px;
    line-height:.98;
    margin-bottom:22px;
  }
  .hero-copy>p:not(.eyebrow) {
    font-size:16px;
    margin-bottom:0;
  }
  .release {
    margin-top:20px;
  }
  .wall-caption {
    font-size:9px;
    letter-spacing:1px;
  }
  .links {
    grid-template-columns:1fr;
    margin-bottom:40px;
  }
  .links li+li {
    border-left:0;
    border-top:1px solid var(--line);
  }
  .links a {
    min-height:96px;
    padding:20px 4px;
    gap:8px;
  }
  .links .link-title {
    font-size:27px;
  }
  .document {
    display:block;
    padding-block:32px 48px;
  }
  .contents {
    display:none;
  }
  .mobile-contents {
    display:block;
    border-block:1px solid var(--line);
    margin:24px 0 32px;
    padding-block:8px;
  }
  .mobile-contents summary {
    cursor:pointer;
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    font-size:11px;
    color:var(--olive);
    font-weight:600;
    letter-spacing:1.5px;
    list-style:none;
  }
  .mobile-contents summary::-webkit-details-marker {
    display:none;
  }
  .mobile-contents summary::after {
    content:'+';
    font-size:20px;
  }
  .mobile-contents[open] summary::after {
    content:'−';
  }
  .mobile-contents nav {
    display:flex;
    flex-direction:column;
    padding-bottom:12px;
  }
  .mobile-contents nav a {
    display:flex;
    align-items:center;
    min-height:44px;
    font-size:13px;
    padding-block:8px;
    text-decoration:none;
  }
  .article h1 {
    font-size:58px;
    line-height:1.05;
  }
  .article>.eyebrow {
    font-size:10px;
  }
  .article h2 {
    font-size:32px;
    margin-top:36px;
  }
  .article {
    font-size:15px;
    line-height:1.8;
  }
  .table {
    border:0;
    overflow:visible;
    background:transparent;
  }
  table,tbody,tr,td {
    display:block;
  }
  thead {
    display:none;
  }
  tr {
    border:1px solid var(--line);
    margin:0 0 14px;
    background:var(--raised);
  }
  td {
    padding:12px 14px;
  }
  td::before {
    content:attr(data-label);
    display:block;
    font-size:10px;
    letter-spacing:1px;
    text-transform:uppercase;
    font-weight:600;
    color:var(--olive);
    margin-bottom:6px;
  }
  .site-footer {
    grid-template-columns:1fr;
    gap:20px;
    font-size:11px;
    padding-block:26px 32px;
  }
  .not-found {
    padding-block:48px 64px;
  }
  .not-found h1 {
    font-size:80px;
  }
}
@media(prefers-reduced-motion:no-preference) {
  a {
    transition:background-color .15s,color .15s;
  }
}
@media print {
  .site-header,.contents,.mobile-contents,.site-footer,.skip {
    display:none;
  }
  .wrap {
    width:100%;
  }
  .document {
    display:block;
    padding:0;
  }
  .article {
    max-width:none;
  }
  body {
    background:white;
    color:#16110F;
  }
  .article h1 {
    font-size:40px;
  }
  .article h2 {
    break-after:avoid;
  }
  .table {
    overflow:visible;
  }
  a {
    color:inherit;
  }
}
