/* Session controls for the private VI review, matching the existing utility bar. */
.utility-bar > nav .utility-logout { display: flex; align-self: stretch; margin: 0; }
.utility-bar > nav .utility-logout-button { display: block; border: 0; border-radius: 0; padding: 10px 12px; background: var(--strong-blue, #0070a6); color: #fff; font-size: 13px; }
.utility-bar > nav .utility-logout-button:hover,
.utility-bar > nav .utility-logout-button:focus-visible { background: #005d8b; }
.utility-bar > nav .utility-logout-button:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }

/* VI identity: programme name and official logo, retaining its white protection area. */
.vi-brand-row { align-items: center; padding-bottom: 12px; }
.vi-brand-row .brand { width: 310px; max-width: 60%; }
.vi-partner-logo { display: block; flex: none; width: 291.428571px; height: auto; max-width: 100%; }
.vi-programme { padding: 0 18px 22px; line-height: 1.3; overflow-wrap: anywhere; }
.vi-programme > span { display: block; margin-bottom: 4px; color: var(--dark); font-size: 14px; }
.vi-programme > strong { display: block; color: var(--strong-blue); font-size: 26px; font-weight: 700; }
.vi-site .page-grid { grid-template-columns: minmax(0, 1fr); padding-inline: 80px; }

/* Same table and column widths for all employer categories, including empty ones. */
.vi-site main table.vi-employer-table { display: table; width: 100%; max-width: 100%; table-layout: fixed; }
.vi-employer-table col { width: 33.333333%; }
.vi-employer-table th, .vi-employer-table td { overflow-wrap: anywhere; }
.vi-employer-table p { max-width: 100%; }

@media (max-width: 900px) {
  .vi-site .page-grid { padding-inline: 16px; }
}

@media (max-width: 600px) {
  .vi-brand-row { flex-wrap: wrap; gap: 16px; padding: 14px; }
  .vi-brand-row .brand { width: 280px; max-width: 100%; }
  .vi-partner-logo { max-width: 100%; }
  .vi-programme { padding: 0 14px 18px; }
  .vi-programme > strong { font-size: 22px; }
}
