.et-masthead__brand a {
  color: inherit;
  text-decoration: none;
}
.et-masthead__brand a:focus-visible {
  outline: var(--et-focus-width) solid var(--et-color-focus);
  outline-offset: var(--et-focus-offset);
}
.et-sample-main {
  padding-block: var(--et-space-24) var(--et-space-80);
}
.et-home-list {
  display: flex;
  flex-direction: column;
  gap: var(--et-space-32);
}
.et-legal {
  max-inline-size: var(--et-content-max);
  margin: 0 auto;
  padding: 0 var(--et-page-gutter) var(--et-space-48);
  color: var(--et-color-muted);
  font-size: var(--et-font-size-caption);
  line-height: 1.7;
}
.et-legal a { color: inherit; }
.et-hero {
  position: relative;
  min-block-size: min(70vh, 40rem);
  display: grid;
  align-items: end;
  color: #fff8f0;
  background: #1a1814 center / cover no-repeat;
}
.et-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  block-size: 55%;
  background: linear-gradient(transparent, rgb(26 24 20 / 0.72));
}
.et-hero__inner {
  position: relative;
  z-index: 1;
  padding: var(--et-space-40) var(--et-page-gutter) var(--et-space-48);
  max-inline-size: var(--et-content-max);
  margin-inline: auto;
  inline-size: 100%;
}
.et-hero__kicker {
  font-size: var(--et-font-size-caption);
  letter-spacing: var(--et-tracking-label);
}
.et-hero__title {
  margin: var(--et-space-12) 0 0;
  font-size: var(--et-font-size-headline);
  font-weight: 400;
  line-height: var(--et-leading-tight);
  text-shadow: 0 1px 12px rgb(0 0 0 / 0.35);
}
.et-size {
  margin-block-start: var(--et-space-48);
}
.et-size h2 {
  font-size: var(--et-font-size-card);
  font-weight: 400;
}
.et-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--et-space-24);
  margin-block-start: var(--et-space-24);
}
@media (max-width: 56rem) {
  .et-pair { grid-template-columns: 1fr; }
}
.et-well-label {
  margin-block-start: var(--et-space-12);
  color: var(--et-color-muted);
  font-size: var(--et-font-size-ui);
}
.et-prose {
  max-inline-size: 40rem;
  margin-block-start: var(--et-space-16);
  color: var(--et-color-ink);
  font-size: var(--et-font-size-body);
  line-height: var(--et-leading-body);
}
.et-foundation strong {
  font-weight: 700;
  color: #1a1814;
  font-synthesis: weight;
}
.et-sample-main h2,
.et-sample-main h3 {
  font-weight: 700;
  color: var(--et-color-ink);
}
.et-product-photo {
  margin-block: var(--et-space-16) var(--et-space-8);
}
.et-product-photo img {
  display: block;
  max-inline-size: 20rem;
  width: 100%;
  height: auto;
  border-radius: var(--et-radius-medium);
  background: var(--et-color-photo-empty);
}
.et-diagram {
  margin-block: var(--et-space-24);
  padding: var(--et-space-16);
  border: 1px solid var(--et-color-line);
  border-radius: var(--et-radius-medium);
  background: var(--et-color-surface);
}
.et-overlap {
  position: relative;
  block-size: 7rem;
}
.et-box {
  position: absolute;
  inset-block-start: 0.5rem;
  border: 2px solid var(--et-color-action);
  border-radius: 4px;
  display: grid;
  place-items: center;
  font-size: 0.75rem;
}
.et-box-a { inset-inline-start: 0; inline-size: 96%; block-size: 90%; background: rgb(69 66 59 / 0.08); }
.et-box-b { inset-inline-start: 1%; inline-size: 94%; block-size: 84%; background: rgb(69 66 59 / 0.16); }
.et-bands { display: grid; gap: var(--et-space-12); }
.et-band { display: grid; grid-template-columns: 5rem 1fr; gap: var(--et-space-8); align-items: center; }
.et-band__row { display: flex; flex-wrap: wrap; gap: var(--et-space-8); }
.et-dot { padding: 0.25rem 0.6rem; border-radius: 999px; background: var(--et-color-paper); border: 1px solid var(--et-color-line); font-size: 0.875rem; }
.et-table {
  inline-size: 100%;
  margin-block-start: var(--et-space-32);
  border-collapse: collapse;
  font-size: var(--et-font-size-ui);
}
.et-table th,
.et-table td {
  padding: var(--et-space-12);
  border: 1px solid var(--et-color-line);
  text-align: start;
  vertical-align: top;
}
.et-table th {
  background: var(--et-color-surface);
  font-weight: 400;
}

.et-ad {
  font-size: var(--et-font-size-body);
  line-height: var(--et-leading-body);
  color: var(--et-color-ink);
  margin: 0 0 var(--et-space-24);
}
.et-sample-main .et-cta { max-inline-size: 20rem; margin-block-start: var(--et-space-24); }
