/* ORYN Design System v1 — Layout primitives. */

.o-wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 var(--gutter);
}

.o-section {
  padding: var(--space-8) 0;
  position: relative;
}
.o-section--alt {
  background: linear-gradient(180deg, transparent 0%, rgba(20,24,51,0.30) 50%, transparent 100%);
}

.o-section-head {
  max-width: 820px;
  margin-bottom: 44px;
}

.o-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.o-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.o-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }

.o-hero-split {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: var(--space-7);
  align-items: center;
}

/* Dashboard / admin / seller / user portal layout shell. */
.o-app {
  min-height: 100vh;
  display: grid;
  grid-template-rows: var(--header-h) 1fr;
  grid-template-columns: var(--sidenav-w) 1fr;
  grid-template-areas:
    "header  header"
    "sidenav main";
}
.o-app--no-sidenav { grid-template-columns: 1fr; grid-template-areas: "header" "main"; }
.o-app__header  { grid-area: header; }
.o-app__sidenav { grid-area: sidenav; }
.o-app__main    { grid-area: main; padding: var(--space-5); overflow: auto; }

.o-sidebar-layout {
  display: grid;
  grid-template-columns: var(--sidenav-w) 1fr;
  gap: var(--space-6);
}

@media (max-width: 980px) {
  .o-grid-3, .o-grid-4, .o-hero-split, .o-sidebar-layout { grid-template-columns: 1fr; }
  .o-app {
    grid-template-columns: 1fr;
    grid-template-areas: "header" "main";
  }
  .o-app__sidenav { display: none; }
}