/* layout-executive — the recruiter's view. Theme: Korporat.
 *
 * A sticky identity rail keeps the name, proof and contact in view while the
 * credential grid scrolls. That is the whole point: a recruiter scanning a
 * candidate should never lose track of whose page they are on. */

.page { min-height: 100vh; background: var(--c-canvas); }

.main {
  max-width: var(--w-content);
  margin: 0 auto;
  padding: var(--sp-8) var(--sp-6) var(--sp-12);
  display: grid;
  grid-template-columns: var(--w-rail) 1fr;
  align-items: start;
  gap: var(--sp-6);
}

/* The showcase owns the right column; the rail auto-places in DOM order so the
 * console's arrangement takes effect. */
.showcase { grid-column: 2; grid-row: 1 / span 20; }
.banner-wrap, .foot { grid-column: 1 / -1; }

@supports (position: sticky) {
  .identity { position: sticky; top: var(--sp-6); }
}

.identity {
  display: flex; flex-direction: column; gap: var(--sp-3);
  padding: var(--sp-6);
  background: var(--c-surface);
  border: var(--bw) solid var(--c-line);
  border-radius: var(--r-lg);
  box-shadow: var(--sh-soft);
}
.identity .avatar { width: 76px; height: 76px; border-radius: var(--r-md); font-size: var(--fs-xl); }
.identity__name { font-size: var(--fs-2xl); }
.identity__meta { display: flex; flex-direction: column; gap: var(--sp-1); font-size: var(--fs-sm); color: var(--c-ink-muted); }

.actions { display: grid; gap: var(--sp-2); }

.showcase { display: flex; flex-direction: column; gap: var(--sp-4); }
.showcase__title { font-size: var(--fs-2xl); }

/* Credentials in a responsive grid — two up on desktop, one on narrow. */
.creds {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--sp-3);
}
.cred { flex-direction: column; }
.cred__go { padding-top: var(--sp-2); }
.cred__n, .cred__status { display: none; }

@media (max-width: 1000px) {
  .main { grid-template-columns: 1fr; }
  .showcase { grid-column: 1; grid-row: auto; }
  .identity { position: static; }
}
@media (max-width: 560px) {
  .main { padding: var(--sp-5) var(--sp-4) var(--sp-10); }
  .trust__stats { grid-template-columns: 1fr; }
  .trust__stat { border-right: 0; border-bottom: var(--bw) solid var(--c-line); }
  .qrbox { flex-direction: column; text-align: center; }
}