.container {
  width: 100%;
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.page {
  padding-top: calc(var(--navbar-height) + var(--space-lg));
  padding-bottom: var(--space-3xl);
  min-height: 100vh;
}

.page.page-landing {
  padding-top: calc(var(--navbar-height) + 8px);
  padding-bottom: 10px;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(120% 56% at 50% 112%, rgba(240, 199, 94, 0.1) 0%, rgba(240, 199, 94, 0) 62%),
    linear-gradient(180deg, rgba(13, 17, 23, 0) 54%, rgba(15, 19, 25, 0.44) 80%, rgba(10, 14, 19, 0.9) 100%);
}

.page.page-landing::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: clamp(120px, 18vh, 240px);
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(72% 100% at 50% 0%, rgba(240, 199, 94, 0.12) 0%, rgba(240, 199, 94, 0) 70%),
    linear-gradient(180deg, rgba(23, 19, 12, 0.08) 0%, rgba(13, 17, 23, 0.76) 100%);
}

.footer.footer-hidden-on-landing {
  display: none;
}

.page-header {
  margin-bottom: var(--space-2xl);
}

.page-header h1 {
  font-size: var(--font-size-3xl);
  margin-bottom: var(--space-sm);
}

.page-header p {
  color: var(--text-secondary);
  font-size: var(--font-size-lg);
}

/* Flex utilities */
.flex {
  display: flex;
}

.flex-col {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.items-center {
  align-items: center;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-xs { gap: var(--space-xs); }
.gap-sm { gap: var(--space-sm); }
.gap-md { gap: var(--space-md); }
.gap-lg { gap: var(--space-lg); }
.gap-xl { gap: var(--space-xl); }

/* Grid utilities */
.grid {
  display: grid;
  gap: var(--space-md);
}

.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

/* Dashboard layout */
.dashboard-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-lg);
}

/* Reduce container padding on dashboard for more space */
@media (min-width: 1025px) {
  .dashboard-container {
    max-width: none;
    width: calc(100vw - var(--space-md));
    margin-left: 0;
    margin-right: auto;
    padding-left: var(--space-xs);
    padding-right: var(--space-sm);
  }
}

/* Text utilities */
.text-center { text-align: center; }
.text-secondary { color: var(--text-secondary); }
.text-muted { color: var(--text-muted); }
.text-sm { font-size: var(--font-size-sm); }
.text-lg { font-size: var(--font-size-lg); }
.text-xl { font-size: var(--font-size-xl); }

/* Visibility */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.hidden {
  display: none !important;
}