/* Client portal (public page): what the portal is and how a client gets in.
   The portals themselves are served by netlify/functions/portal.mjs. */
.portal-info { padding: var(--space-9) 0; }
.portal-info__grid {
  display: grid; gap: var(--space-7) var(--space-8);
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  grid-template-areas: "intro intro" "steps lost";
  align-items: start;
}
.portal-info__intro { grid-area: intro; display: grid; gap: var(--space-5); }
.portal-info__intro h1 { font-size: var(--text-display); line-height: 0.98; letter-spacing: -0.025em; }
.portal-info__steps { grid-area: steps; }
.portal-info__lost { grid-area: lost; }
.portal-info h2 { font-size: var(--text-step); line-height: 1.15; margin-bottom: var(--space-5); }
.portal-info__lost h2 { margin-bottom: 0; }
.portal-info__lost p { max-width: var(--measure); }
.portal-info .stepper--compact .stepper__body { font-size: var(--text-body); padding-bottom: 20px; }
.portal-info .stepper__note { display: inline-block; margin-top: 2px; }

@media (max-width: 860px) {
  .portal-info__grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "intro" "steps" "lost"; }
}
@media (max-width: 767px) {
  .portal-info { padding: var(--space-8) 0; }
}