.legal-hero{
  padding-block:var(--space-4);
  background:#f2faf7;
  color:#071b19
}

.legal-hero__inner{
  display:grid;
  gap:var(--space-3)
}

.legal-hero__copy{
  display:grid;
  gap:var(--space-1);
  max-width:58rem;
  margin-inline:0
}

.legal-hero__copy p{
  max-width:52rem;
  color:#586461
}

.legal-hero__meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:var(--space-1);
  color:#586461;
  font-size:var(--fs-2)
}

.legal-hero__meta .c-badge{
  width:fit-content;
  max-width:100%;
  align-self:flex-start
}

.legal-layout{
  display:grid;
  grid-template-columns:minmax(13rem,17rem) minmax(0,1fr);
  align-items:start;
  gap:var(--space-4)
}

.legal-index{
  position:sticky;
  top:calc(var(--header-height) + var(--space-3));
  display:grid;
  gap:var(--space-3);
  min-width:0;
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#f2faf7;
  color:#071b19
}

.legal-index__head{
  display:grid;
  gap:var(--space-1)
}

.legal-index__label{
  color:#00463f;
  font-family:var(--font-mono);
  font-size:var(--fs-0);
  font-weight:800;
  letter-spacing:.08em
}

.legal-index ol{
  display:grid;
  gap:var(--space-1);
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:legal-index
}

.legal-index li{
  min-width:0;
  counter-increment:legal-index;
  font-size:var(--fs-2)
}

.legal-index a{
  display:grid;
  grid-template-columns:1.8rem minmax(0,1fr);
  gap:var(--space-1);
  align-items:start;
  color:#34423f;
  overflow-wrap:anywhere
}

.legal-index a::before{
  content:counter(legal-index,decimal-leading-zero);
  color:#00463f;
  font-family:var(--font-mono);
  font-size:var(--fs-0);
  font-weight:800
}

.legal-index a:hover{
  color:#005c52
}

.legal-index p{
  color:#586461;
  font-size:var(--fs-2)
}

.legal-article{
  min-width:0;
  max-width:58rem
}

.legal-section{
  scroll-margin-top:calc(var(--header-height) + var(--space-3));
  min-width:0
}

.legal-section + .legal-section{
  margin-top:var(--space-4);
  padding-top:var(--space-4);
  border-top:1px solid #dce5e1
}

.legal-section__head{
  display:grid;
  gap:var(--space-1)
}

.legal-section__head p{
  max-width:52rem;
  color:#586461
}

.legal-section__number{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  padding:.45em .8em;
  border-radius:var(--radius-pill);
  background:#c9f8e9;
  color:#00463f;
  font-family:var(--font-mono);
  font-size:var(--fs-0);
  font-weight:800;
  line-height:1.2;
  letter-spacing:.06em
}

.legal-section__body{
  display:grid;
  gap:var(--space-3);
  margin-top:var(--space-3)
}

.legal-block{
  display:grid;
  gap:var(--space-1);
  min-width:0
}

.legal-block h3{
  font-size:var(--fs-4)
}

.legal-block p{
  color:#34423f
}

.legal-list{
  display:grid;
  gap:var(--space-1);
  padding-inline-start:1.25rem;
  color:#34423f
}

.legal-list li{
  padding-inline-start:.25rem
}

.legal-definition-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));
  align-items:start;
  gap:var(--space-2)
}

.legal-definition-grid > div{
  display:grid;
  gap:var(--space-1);
  min-width:0;
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#f2faf7;
  color:#071b19
}

.legal-definition-grid p{
  color:#586461;
  font-size:var(--fs-2)
}

.legal-note{
  display:grid;
  gap:var(--space-1);
  min-width:0;
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#63e6be;
  color:#071b19
}

.legal-note p{
  color:#203c37
}

.legal-migration{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));
  align-items:start;
  gap:var(--space-2)
}

.legal-migration > div{
  display:grid;
  gap:var(--space-1);
  min-width:0;
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#f6f8f7;
  color:#071b19
}

.legal-migration span{
  color:#00463f;
  font-family:var(--font-mono);
  font-size:var(--fs-0);
  font-weight:800;
  letter-spacing:.06em
}

.legal-migration p{
  color:#586461;
  font-size:var(--fs-2)
}

.legal-rule-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
  align-items:start;
  gap:var(--space-2)
}

.legal-rule-grid > div{
  display:grid;
  gap:var(--space-1);
  min-width:0;
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#f2faf7;
  color:#071b19
}

.legal-rule-grid p{
  color:#586461;
  font-size:var(--fs-2)
}

.legal-sla{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  min-width:0;
  border-radius:var(--radius-md);
  overflow:hidden;
  background:#071b19;
  color:#effff9
}

.legal-sla__meter{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:var(--space-1);
  min-width:0;
  padding:var(--space-3);
  background:#63e6be;
  color:#071b19
}

.legal-sla__value{
  font-family:var(--font-mono);
  font-size:var(--fs-6);
  font-weight:800;
  line-height:1;
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere
}

.legal-sla__meter p{
  color:#203c37;
  font-size:var(--fs-2)
}

.legal-sla__rules{
  display:grid;
  align-content:start;
  min-width:0;
  padding:var(--space-3);
  background:#071b19;
  color:#effff9
}

.legal-sla__rules > div{
  display:grid;
  gap:var(--space-1);
  min-width:0;
  padding-block:var(--space-2);
  border-bottom:1px solid #29423d
}

.legal-sla__rules > div:last-child{
  border-bottom:0
}

.legal-sla__rules p{
  color:#a7bcb6;
  font-size:var(--fs-2)
}

.legal-endcap__copy{
  display:grid;
  gap:var(--space-1);
  max-width:44rem;
  margin-inline:0
}

.legal-endcap__copy .c-badge{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  background:#63e6be;
  color:#071b19
}

.legal-endcap__copy h2{
  color:#effff9
}

.legal-endcap__copy p{
  color:#a7bcb6
}

.legal-endcap__actions{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--space-1);
  min-width:min(100%,14rem)
}

.legal-endcap__actions .c-btn{
  width:100%
}

.legal-endcap__actions .c-btn--secondary{
  background:#ffffff;
  border-color:#ffffff;
  color:#071b19
}

.legal-endcap__actions .c-btn--ghost{
  background:transparent;
  border-color:#91a8a2;
  color:#effff9
}

@media (max-width:64rem){
  .legal-layout{
    grid-template-columns:1fr
  }

  .legal-index{
    position:static
  }

  .legal-index ol{
    grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr))
  }

  .legal-article{
    max-width:none
  }
}

@media (max-width:42rem){
  .legal-hero{
    padding-block:var(--space-3)
  }

  .legal-sla{
    grid-template-columns:1fr
  }

  .legal-index,
  .legal-definition-grid > div,
  .legal-migration > div,
  .legal-rule-grid > div,
  .legal-note,
  .legal-sla__meter,
  .legal-sla__rules{
    padding:var(--space-2)
  }

  .legal-section + .legal-section{
    margin-top:var(--space-3);
    padding-top:var(--space-3)
  }

  .legal-endcap__actions{
    width:100%
  }
}
