/* Office relocation page only. Classes prefixed office- and scoped under .page-office-relocation. */
@layer pages {
  /* Sample label key (c-panel--bordered): coloured desk codes */
  .page-office-relocation .office-key { --panel-gap: 4px; }
  .page-office-relocation .office-key__caption { padding-bottom: 10px; }
  .page-office-relocation .office-key__list { display: flex; flex-direction: column; padding: 0; list-style: none; }
  .page-office-relocation .office-key__row { display: flex; gap: 16px; align-items: center; padding: 14px 0; border-top: 1px solid var(--border-soft); }
  .page-office-relocation .office-key__code { flex: 0 0 auto; padding: 8px 12px; border-radius: 8px; background: var(--powder); color: var(--harbor-dark); font-weight: 800; font-size: 14px; letter-spacing: 1.5px; line-height: 1.4; }
  .page-office-relocation .office-key__code--seafoam { background: var(--seafoam); color: var(--on-seafoam); }
  .page-office-relocation .office-key__code--peach { background: var(--peach); color: var(--on-peach); }
  .page-office-relocation .office-key__code--harbor { background: var(--harbor); color: var(--white); }
  .page-office-relocation .office-key__code--outline { padding: 6.5px 10.5px; background: var(--mist); border: 1.5px solid var(--input-border); color: var(--ink); }
  .page-office-relocation .office-key__text { font-size: var(--fs-list); line-height: 1.6; color: var(--body); }

  /* Building rules on the peach band: sans titles in on-peach, warm rules */
  .page-office-relocation .office-rules { border-bottom: 1px solid var(--peach-rule); }
  .page-office-relocation .office-rules,
  .page-office-relocation .office-rules .c-divided__item { --peach-rule: color-mix(in srgb, var(--on-peach) 22%, var(--peach)); border-color: var(--peach-rule); }
  .page-office-relocation .office-rules .c-divided__item { gap: 4px; padding: 20px 0; }
  .page-office-relocation .office-rules .c-divided__title { font-family: var(--font-sans); font-weight: 700; font-size: 19px; line-height: 1.5; color: var(--on-peach); }
}
