@layer framework {
  [data-layout] > .slot {
    --section-bg: var(--bg-page, var(--bg));
  }
  [data-layout="sidebar"] {
    display: grid;
    grid-template-columns: 280px 1fr;
    min-height: 100dvh;
    align-items: start;
  }
  [data-layout="sidebar"] > .slot[data-section="nav"] {
    grid-column: 1;
    grid-row: 1 / 9999;
    position: sticky;
    top: 0;
    height: 100dvh;
    overflow-y: auto;
  }
  [data-layout="sidebar"] > .slot:not([data-section="nav"]) {
    grid-column: 2;
  }
  @media (max-width: 768px) {
    [data-layout="sidebar"] {
      display: block;
    }
    [data-layout="sidebar"] > .slot[data-section="nav"] {
      position: static;
      height: auto;
      overflow: visible;
    }
  }
  [data-framework="uniform"] > .slot { --section-bg: var(--bg-page, var(--bg)); }
  [data-framework="alternating"] > .slot:nth-of-type(odd) { --section-bg: var(--bg-page, var(--bg)); }
  [data-framework="alternating"] > .slot:nth-of-type(even) { --section-bg: var(--bg-mid); }
  [data-framework="accent-bands"] > .slot { --section-bg: var(--bg-page, var(--bg)); }
  [data-framework="accent-bands"] > .slot[data-section="trust"],
  [data-framework="accent-bands"] > .slot[data-section="pricing"],
  [data-framework="accent-bands"] > .slot[data-section="consult"] {
    --section-bg: var(--bg-mid);
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
  }
  [data-framework="layered"] > .slot { --section-bg: var(--bg-page, var(--bg)); }
  [data-framework="layered"] > .slot ~ .slot {
    box-shadow: 0 -6px 16px -14px rgba(0, 0, 0, 0.32);
    position: relative;
    z-index: 0;
  }
}