.hero {
  background:
    linear-gradient(110deg, rgba(114, 20, 16, .34), transparent 38%),
    repeating-linear-gradient(136deg, transparent 0 4rem, rgba(255, 255, 255, .025) 4rem 4.08rem),
    linear-gradient(132deg, #050506, #17110f 58%, #2b0d0b);
}
.hero h1 {
  max-width: 1120px;
  font-size: clamp(3rem, 7vw, 6.7rem);
}
.hero .deck {
  color: #efc9aa;
}
.hero-figure {
  background:
    radial-gradient(circle at center, rgba(149, 42, 31, .22), transparent 32rem),
    #050506;
}
.hero-figure img {
  width: min(520px, 88vw);
  border-color: rgba(209, 160, 98, .65);
}
.concept-figure {
  max-width: 46rem;
  margin: 2rem auto;
}
.concept-figure img {
  display: block;
  width: 100%;
  height: auto;
}
.concept-figure figcaption {
  margin-top: .6rem;
  color: #62564c;
  font: 400 .875rem/1.5 var(--sans);
  text-align: center;
}
.lens-stack {
  margin: 1.7rem 0 2.7rem;
  padding: 1.45rem;
  color: #f5eee5;
  background: #0b0a0a;
  border-left: 5px solid #a52b22;
  columns: 2;
  column-gap: 2rem;
}
.lens-stack p {
  break-inside: avoid;
  margin: .25rem 0;
  font-size: 1.08rem;
}
.lens-stack p:nth-child(odd) {
  color: #d6b47a;
}
.source-heading {
  margin: 3.4rem 0 1.25rem;
  padding-top: .85rem;
  color: #7f201a;
  border-top: 2px solid #9f3028;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  font-weight: 600;
}
.source-heading::before {
  content: "Source section";
  display: block;
  margin-bottom: .45rem;
  color: #8f6125;
  font: 800 .64rem var(--sans);
  letter-spacing: .16em;
  text-transform: uppercase;
}
.turning-line {
  margin: 2rem 0;
  padding: 1.15rem 1.35rem;
  color: #fff;
  background: linear-gradient(120deg, #1a1010, #3b1210);
  border-left: 5px solid #b53a30;
  font-size: 1.2rem;
  font-style: italic;
}
.label-sequence {
  margin: 1.4rem 0 2.6rem;
  padding: 1.35rem;
  background: #eee5d8;
  border: 1px solid #cfb99b;
}
.label-sequence p {
  margin: .32rem 0;
}
.label-sequence p:nth-child(even) {
  color: #851f19;
  font-weight: 700;
}
.mechanism-brief {
  margin: 3.2rem 0;
  padding: 1.5rem;
  color: #f7f0e7;
  background: #0a0909;
  border-top: 5px solid #a82d25;
}
.mechanism-brief h2 {
  margin: 0 0 1.2rem;
  padding: 0;
  color: #fff;
  border: 0;
  font-size: 1.55rem;
}
.mechanism-brief h2 small {
  display: block;
  margin-top: .35rem;
  color: #d9ad63;
  font: 700 .68rem var(--sans);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.mechanism-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: #51443f;
}
.mechanism-grid section {
  padding: 1rem;
  background: #171111;
}
.mechanism-grid span {
  color: #e4a263;
  font: 800 .68rem var(--sans);
  letter-spacing: .12em;
}
.mechanism-grid h3 {
  margin: .25rem 0 .45rem;
  color: #fff;
  font-size: 1.05rem;
}
.mechanism-grid p {
  margin: 0;
  color: #dfd4ca;
  font: 400 .8rem/1.5 var(--sans);
}
.mechanism-brief .calibration {
  margin: 1rem 0 0;
  color: #d8cec5;
  font: 400 .8rem/1.55 var(--sans);
}
.boundary-note,
.counterweight {
  margin: 2.5rem 0;
  padding: 1.3rem 1.45rem;
  background: #fff6e6;
  border: 1px solid #d2ad72;
  font-family: var(--sans);
  font-size: .87rem;
}
.boundary-note h3,
.counterweight h3 {
  margin: 0 0 .55rem;
  color: #761f19;
  font: 800 .72rem var(--sans);
  letter-spacing: .14em;
  text-transform: uppercase;
}
.boundary-note p:last-child,
.counterweight p:last-child {
  margin-bottom: 0;
}
.epigraph {
  margin: 2.6rem 0;
  padding: 1.35rem 1.5rem;
  background: #e7ddd0;
  border-left: 5px solid #8f261f;
  font-size: 1.22rem;
  font-style: italic;
}
.positioning {
  margin: 2rem 0 3rem;
}
.positioning h3 {
  font-size: 1.5rem;
}
.construct-table {
  border-color: #b8a995;
}
.construct-table table {
  min-width: 780px;
}
.construct-table th:nth-child(1) {
  width: 22%;
}
.construct-table th:nth-child(2) {
  width: 35%;
}
.construct-table td:nth-child(2) {
  min-width: 0;
}
.construct-table td:first-child {
  color: #7f201a;
  font-weight: 800;
}
.construct-table tr:last-child td {
  background: #fff0dc;
}
@media (max-width: 820px) {
  .hero h1 {
    font-size: 2.7rem;
  }
  .lens-stack {
    columns: 1;
  }
  .mechanism-grid {
    grid-template-columns: 1fr;
  }
}