.legal-page {
  --legal-copper:#efb586;
  --legal-line:#5a4739;
}

.legal-hero {
  padding-bottom:clamp(32px,5vw,68px);
}

.legal-hero::before {
  position:absolute;
  z-index:-1;
  inset:auto max(-16rem,2vw) -105%;
  inset-inline-start:auto;
  width:clamp(28rem,66vw,56rem);
  aspect-ratio:1;
  border:1px solid #c389563b;
  border-radius:50%;
  background:radial-gradient(circle at 50% 0%,#94532d30,transparent 56%);
  box-shadow:0 0 0 22px #ab774517,0 0 0 58px #ab774510;
  content:'';
  pointer-events:none;
}

.legal-hero h1 {
  max-width:21ch;
  font-size:clamp(42px,6vw,84px);
  line-height:1.02;
  overflow-wrap:anywhere;
}

.legal-hero .catalogue-intro {
  max-width:66ch;
  font-size:clamp(16px,1.5vw,19px);
}

.legal-status {
  display:inline-block;
  margin:0 0 14px;
  padding:4px 10px;
  border:1px solid var(--legal-line);
  border-radius:4px;
  color:var(--legal-copper);
  font-size:14px;
}

.legal-settings {
  margin-top:22px;
  background:var(--legal-copper);
  color:#16110c;
}

.legal-settings[hidden] {
  display:none;
}

.legal-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:24px;
}

.legal-panel {
  padding:clamp(18px,3.2vw,38px);
  border:1px solid var(--legal-line);
  border-radius:8px;
  background:linear-gradient(128deg,#24231b,#121613 75%);
  scroll-margin-top:110px;
}

.legal-panel h2 {
  margin:0 0 14px;
  color:#f2e5d6;
  font-size:clamp(21px,2.25vw,30px);
  line-height:1.25;
}

.legal-toc nav {
  display:block;
}

.legal-toc ol {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
  gap:8px;
  margin:0;
  padding:0;
  list-style:none;
}

.legal-panel a {
  color:var(--legal-copper);
  text-decoration:underline;
  text-underline-offset:.2em;
}

.legal-toc a {
  display:flex;
  align-items:center;
  gap:10px;
  min-height:100%;
  padding:10px 12px;
  border:1px solid var(--legal-line);
  border-radius:5px;
  background:#141713;
  font-size:16px;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.legal-toc a span {
  flex:none;
  color:var(--legal-copper);
  font-size:13px;
  font-variant-numeric:tabular-nums;
}

.legal-toc a:hover,.legal-toc a:focus-visible {
  border-color:var(--legal-copper);
  background:#27231a;
}

.legal-sections {
  display:grid;
  gap:16px;
}

.legal-sections h2 span {
  margin-inline-end:.7em;
  color:var(--legal-copper);
  font-size:.67em;
  font-variant-numeric:tabular-nums;
}

.legal-panel p,.legal-company address {
  max-width:77ch;
  margin:0 0 .9em;
  color:#d9d2c7;
  font-size:16px;
  line-height:1.65;
  overflow-wrap:anywhere;
}

.legal-panel p:last-child {
  margin-bottom:0;
}

.legal-promise {
  border-inline-start:3px solid var(--legal-copper);
  background:linear-gradient(128deg,#31271d,#141714 80%);
}

.legal-company address {
  font-style:normal;
}

.legal-storage {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
  gap:12px;
  margin:18px 0 0;
}

.legal-storage div {
  padding:14px;
  border:1px solid var(--legal-line);
  border-radius:5px;
  background:#111512;
}

.legal-storage dt {
  margin-bottom:8px;
  color:var(--legal-copper);
  overflow-wrap:anywhere;
}

.legal-storage dd {
  margin:0 0 6px;
  color:#d9d2c7;
  font-size:15px;
}

.legal-storage dd:last-child {
  margin-bottom:0;
}

@media(max-width:700px) {
  .legal-panel {
    scroll-margin-top:150px;
  }
}
