/* Shared alignment over the existing impressionist materials. */
:root {
  --page-width: 1080px;
  --panel-padding: 24px;
  --section-gap: 24px;
}

.topbar,
.content {
  width: 100%;
  max-width: var(--page-width);
  margin-inline: auto;
}

.main { min-width: 0; }
.simple-chat,
.simple-chat .chat-window,
.partner-assessment {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

.hero { padding-inline: 0; }

.pagehead,
.partner-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--section-gap);
  padding: 32px 0 28px;
}

.pagehead > div:first-child,
.partner-heading > div:first-child { min-width: 0; }

.pagehead .eyebrow,
.partner-heading .eyebrow {
  display: block;
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: 1.5px;
  margin: 0 0 12px;
}

.pagehead h1,
.partner-heading h1 {
  font-size: 34px;
  line-height: 1.5;
  letter-spacing: 1px;
  margin: 0 0 10px;
}

.pagehead p,
.partner-heading p {
  max-width: none;
  font-size: 15px;
  line-height: 1.8;
  margin: 0;
}

.journey-actions,
.partner-working {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 12px;
  max-width: none;
  margin: 0;
  flex-shrink: 0;
}

.pagehead > .btn,
.partner-heading > .btn,
.journey-actions .btn {
  min-height: 48px;
  padding: 10px 18px;
  font-size: 14px;
  white-space: nowrap;
  align-self: center;
}

.card,
.simple-chat .chat-window,
.simple-chat .compose,
.partner-portrait,
.partner-chart,
.journey-cover-main,
.journey-cover-note {
  padding: var(--panel-padding);
}
.journey-cover { margin-top: 0; }

.home-guide,
.settings-grid { gap: var(--section-gap); }
.home-guide > div,
.home-guide > div + div { padding: var(--panel-padding); }
.settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-grid .card { min-width: 0; }

.partner-chart {
  --chart-label: 89px;
  --chart-value: 47px;
  --chart-gap: 10px;
}
.partner-chart-row {
  grid-template-columns: var(--chart-label) minmax(0, 1fr) var(--chart-value);
  gap: var(--chart-gap);
  align-items: center;
}
.partner-chart-scale {
  margin-left: calc(var(--chart-label) + var(--chart-gap));
  margin-right: calc(var(--chart-value) + var(--chart-gap));
}
.partner-chart-row > strong,
.partner-total strong,
.partner-dimension-score { font-variant-numeric: tabular-nums; }

.journey-toolbar {
  align-items: center;
  gap: var(--section-gap);
}
.journey-toolbar h2 { margin-bottom: 8px; }
.journey-toolbar p { margin-bottom: 0; }

@media (max-width: 820px) {
  .pagehead,
  .partner-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 20px;
  }
  .journey-actions,
  .partner-working { justify-content: flex-start; flex-shrink: 1; }
  .pagehead > .btn,
  .partner-heading > .btn { align-self: flex-start; margin-top: 0; }
}

@media (max-width: 760px) {
  :root { --panel-padding: 20px; --section-gap: 20px; }
  .hero { padding-inline: 0; }
  .pagehead,
  .partner-heading { padding: 28px 0 24px; }
  .pagehead h1,
  .partner-heading h1 { font-size: 29px; }
  .pagehead .eyebrow,
  .partner-heading .eyebrow { font-size: 10px; letter-spacing: 1px; }
  .simple-chat .compose { padding: 18px; }
  .home-guide,
  .settings-grid { grid-template-columns: minmax(0, 1fr); }
  .home-guide > div,
  .home-guide > div + div { padding: var(--panel-padding); }
  .partner-chart { --chart-label: 87px; --chart-value: 45px; --chart-gap: 8px; }
  .partner-working .btn { margin-top: 0; }
}