/*
 * Structural layout
 *
 * This file controls page width, grids, spacing, header and footer
 * positioning. Visual component details live in components.css.
 */

.qive-container {
  width: min(calc(100% - var(--qive-page-gutter)), var(--qive-page-width));
  margin-inline: auto;
}

.qive-header {
  padding-top: 24px;
}

.qive-hero {
  min-height: 75vh;
  display: grid;
  grid-template-columns:
    minmax(0, 1.45fr)
    minmax(280px, 0.55fr);
  align-items: center;
  gap: 70px;
  padding-block: 90px 70px;
}

.qive-hero__content {
  min-width: 0;
}

.qive-section-grid {
  display: grid;
  grid-template-columns:
    minmax(220px, 0.6fr)
    minmax(0, 1.4fr);
  gap: 60px;
}

.qive-panel {
  margin-bottom: var(--qive-section-gap);
  padding: clamp(28px, 5vw, 64px);
}

.qive-section-content {
  min-width: 0;
}

.qive-footer {
  padding-block: 18px 38px;
}

.qive-footer__inner {
  display: flex;
  justify-content: space-between;
  gap: 30px;
}