.app-layout {
  display: grid;
  grid-template-columns: 224px minmax(0, 1fr);
  min-height: calc(100vh - 69px);
}

.app-sidebar {
  position: sticky;
  z-index: 10;
  top: 69px;
  align-self: start;
  height: calc(100vh - 69px);
  overflow-y: auto;
  border-right: 1px solid var(--line, #e4e5e1);
  background: #fbfaf7;
}

.sidebar-heading {
  display: grid;
  gap: 2px;
  padding: 24px 22px 17px;
  border-bottom: 1px solid var(--line, #e4e5e1);
}

.sidebar-heading strong { color: var(--public-ink, var(--ink, #17362c)); font-size: .96rem; }
.sidebar-heading span { color: var(--public-muted, var(--muted, #68776f)); font-size: .7rem; }
.sidebar-nav { display: grid; gap: 15px; padding: 17px 12px 28px; }
.sidebar-nav section { display: grid; gap: 3px; margin: 0; }
.sidebar-nav p { margin: 0 10px 6px; color: var(--public-muted, var(--muted, #68776f)); font-size: .68rem; font-weight: 700; letter-spacing: .08em; }
.sidebar-nav a {
  display: block;
  padding: 9px 11px;
  border-radius: 7px;
  color: var(--public-text, var(--ink, #17362c));
  font-size: .82rem;
  text-decoration: none;
}
.sidebar-nav a:hover { background: #f0f3ef; color: var(--public-ink, var(--ink, #17362c)); }
.sidebar-nav a.active { background: #e8f0ec; color: #123a30; font-weight: 750; }
.sidebar-external { padding-top: 13px; border-top: 1px solid var(--line, #e4e5e1); }

.public-layout > main {
  width: min(1180px, calc(100% - 48px));
  min-width: 0;
}
.public-layout + footer { margin-left: 224px; }

.admin-layout > main {
  width: min(1180px, calc(100% - 48px));
  min-width: 0;
}
.admin-sidebar { top: 0; height: calc(100vh - 65px); background: #f3f1ea; }

@media (min-width: 981px) {
  .public-layout .home-hero,
  .public-layout .section-block {
    margin-right: 0;
    margin-left: 0;
    padding-right: 28px;
    padding-left: 28px;
  }
}

@media (max-width: 980px) {
  .app-layout { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .app-sidebar {
    position: sticky;
    top: 58px;
    width: 100%;
    height: auto;
    overflow-x: auto;
    overflow-y: hidden;
    border-right: 0;
    border-bottom: 1px solid var(--line, #e4e5e1);
    background: rgb(251 250 247 / 97%);
    backdrop-filter: blur(8px);
  }
  .admin-sidebar { top: 0; }
  .sidebar-heading, .sidebar-nav p, .sidebar-categories, .sidebar-external { display: none; }
  .sidebar-nav { display: flex; width: max-content; gap: 4px; padding: 8px 12px; }
  .sidebar-nav section { display: flex; gap: 4px; }
  .sidebar-nav a { padding: 8px 11px; white-space: nowrap; }
  .public-layout > main, .admin-layout > main { width: min(100% - 32px, 1180px); }
  .public-layout + footer { margin-left: 0; }
}