:root {
  --ink: #172440;
  --ink-soft: #40506b;
  --paper: #f8f5ed;
  --paper-deep: #eee8dc;
  --accent: #8a4b3a;
  --line: rgba(23,36,64,.28);
  --line-strong: rgba(23,36,64,.58);
  --serif: "Iowan Old Style","Baskerville","Palatino Linotype",Georgia,serif;
  --sans: "Aptos","Segoe UI",Helvetica,Arial,sans-serif;
  --ink-deep: #101a2e;
  --ink-panel: #172440;
  --paper-on-deep: #eae6dd;
  --line-on-deep: rgba(234,230,221,.16);
  --navy: var(--ink);
  --navy-dark: var(--ink-deep);
  --muted: var(--ink-soft);
  --border: var(--line);
  --focus: var(--accent);
  --white: #fffdf8;
}

/* Public institutional surface */
.hla-public { min-height: 100vh; background: var(--paper); color: var(--ink); font-family: var(--sans); }
.hla-public * { box-sizing: border-box; }
.hla-public a { color: inherit; text-underline-offset: .2em; }
.hla-public a:hover { color: var(--accent); }
.hla-public a:focus-visible,
.hla-public button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.hla-skip { position: absolute; left: 1rem; top: -5rem; z-index: 100; padding: .7rem 1rem; background: var(--ink); color: var(--paper); }
.hla-skip:focus { top: .75rem; }
.hla-public-inner { width: min(calc(100% - 2rem), 72rem); margin: 0 auto; }
.hla-utility { min-height: 44px; display: flex; align-items: center; justify-content: flex-end; gap: 1.15rem; border-bottom: 1px solid var(--line); padding: 0 max(1rem,calc((100vw - 72rem)/2)); font-size: .78rem; color: var(--ink-soft); }
.hla-utility a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.hla-public-header { border-bottom: 1px solid var(--line-strong); background: rgba(248,245,237,.96); }
.hla-public-header__inner { min-height: 5.25rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.hla-public-brand { display: grid; gap: .12rem; text-decoration: none; }
.hla-public-brand strong { font: 400 1.28rem/1.1 var(--serif); letter-spacing: .01em; }
.hla-public-brand span { color: var(--ink-soft); font-size: .68rem; letter-spacing: .17em; text-transform: uppercase; }
.hla-public-nav { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .65rem 1.1rem; font-size: .84rem; }
.hla-public-nav a { min-height: 44px; display: inline-flex; align-items: center; text-decoration: none; }
.hla-public-nav .hla-nav-action { min-height: 44px; border: 1px solid var(--ink); padding: .52rem .8rem; }
.hla-public-hero { padding: clamp(4.5rem,8vw,7.5rem) 0 clamp(3.5rem,6vw,5rem); border-bottom: 1px solid var(--line); }
.hla-public-hero__grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(18rem,.8fr); gap: clamp(2.5rem,6vw,5rem); align-items: center; }
.hla-eyebrow,.hla-section-label { margin: 0 0 1rem; color: var(--accent); font-size: .72rem; font-weight: 600; letter-spacing: .19em; text-transform: uppercase; }
.hla-public h1,.hla-public h2,.hla-public h3 { margin-top: 0; color: var(--ink); font-family: var(--serif); font-weight: 400; }
.hla-public h1 { max-width: 17ch; margin-bottom: 0; font-size: clamp(2.6rem,4.4vw,4.1rem); line-height: 1.08; letter-spacing: -.02em; }
html[lang="fr-CA"] .hla-public h1 { max-width: 21ch; font-size: clamp(2.35rem,3.9vw,3.75rem); }
.hla-public h2 { max-width: 20ch; font-size: clamp(1.8rem,2.8vw,2.6rem); line-height: 1.15; }
.hla-public h3 { font-size: 1.3rem; line-height: 1.2; }
.hla-public-copy,.hla-public-prose { max-width: 62ch; color: var(--ink-soft); font-size: clamp(1.05rem,1.4vw,1.2rem); line-height: 1.65; }
.hla-public-prose { font-size: 1rem; line-height: 1.6; }
.hla-public-prose p:first-child { margin-top: 0; }
.hla-public-prose p:last-child { margin-bottom: 0; }
.hla-public-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .8rem 1rem; margin-top: 2rem; }
.hla-button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--ink); padding: .68rem 1rem; font-size: .86rem; font-weight: 650; text-decoration: none; }
.hla-button--primary { background: var(--ink); color: var(--paper)!important; }
.hla-button--light { border-color: var(--paper); background: var(--paper); color: var(--ink)!important; }
.hla-text-action { min-height: 44px; display: inline-flex; align-items: center; font-weight: 650; }
.hla-public-illustration { width: min(100%,34rem); margin: 0; opacity: .9; }
.hla-public-illustration img { display: block; width: 100%; height: auto; }
.hla-public-section { padding: clamp(4rem,7vw,6.5rem) 0; border-bottom: 1px solid var(--line); }
.hla-public-section--tinted { background: var(--paper-deep); }
.hla-public-split { display: grid; grid-template-columns: minmax(14rem,.72fr) minmax(0,1.28fr); gap: clamp(2rem,6vw,6rem); }
.hla-public-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.4rem; margin-top: 2.4rem; }
.hla-public-card { border-top: 1px solid var(--line); padding-top: 1.2rem; }
.hla-public-card > span { color: var(--accent); font-size: .72rem; letter-spacing: .16em; }
.hla-public-card h3 { margin: 1rem 0 .65rem; }
.hla-public-card p { margin: 0; color: var(--ink-soft); line-height: 1.6; }
.hla-public-boundary { display: grid; grid-template-columns: minmax(12rem,.42fr) minmax(0,1.58fr); gap: 2rem; margin-top: 2.2rem; border-top: 1px solid var(--line-strong); padding-top: 1.4rem; }
.hla-public-boundary h3 { color: var(--accent); }
.hla-public-boundary p { max-width: 72ch; margin: 0; line-height: 1.6; }
.hla-public-situations { margin-top: 2rem; border-top: 1px solid var(--line-strong); }
.hla-public-situation { display: grid; grid-template-columns: minmax(10rem,.5fr) minmax(0,1.5fr); gap: 2rem; border-bottom: 1px solid var(--line); padding: 1.35rem 0; }
.hla-public-situation h3,.hla-public-situation p { margin: 0; }
.hla-public-situation p { color: var(--ink-soft); }
.hla-public-section--cta { border-bottom: 0; background: var(--ink); color: var(--paper); }
.hla-public-cta h2 { color: var(--paper); }
.hla-public-cta > p:not(.hla-section-label) { max-width: 44rem; color: var(--paper-on-deep); }
.hla-public-cta .hla-section-label { color: #c48774; }
.hla-public-cta .hla-text-action { color: var(--paper); }
.hla-access-panel { scroll-margin-top: 1rem; }
.hla-access-panel:target { background: var(--paper-deep); }
.hla-access-panel .hla-public-inner { max-width: 48rem; }
.hla-access-security { margin-top: 1.5rem; border-top: 1px solid var(--line); padding-top: 1rem; color: var(--ink-soft); font-size: .92rem; }
.hla-public-footer { border-top: 1px solid var(--line-strong); padding: 1.5rem 0 2rem; color: var(--ink-soft); font-size: .8rem; }
.hla-public-footer .hla-public-inner { display: flex; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.hla-public-footer nav { display: flex; gap: 1rem; flex-wrap: wrap; }

/* Client-access standalone page */
.access-gateway { background: var(--paper); }
.access-main { width: min(100%,48rem); }
.access-card { border: 0; border-top: 1px solid var(--line-strong); background: transparent; padding: clamp(2rem,5vw,3.5rem) 0 0; }
.access-card h1,.access-card h2 { color: var(--ink); font-family: var(--serif); }
.client-login { border-radius: 0; background: var(--ink); border-color: var(--ink); }

/* Deep client and staff workspaces */
body[data-page="client"],body[data-page="staff"] { background: var(--ink-deep); color: var(--paper-on-deep); font-family: var(--sans); }
body[data-page="client"] .masthead,body[data-page="staff"] .masthead { background: var(--ink-deep); color: var(--paper-on-deep); box-shadow: none; border-bottom: 1px solid var(--line-on-deep); }
body[data-page="client"] .brand::before,body[data-page="staff"] .brand::before { width: 2px; background: var(--accent); }
body[data-page="client"] .shell,body[data-page="staff"] .shell { color: var(--paper-on-deep); }
body[data-page="client"] h1,body[data-page="client"] h2,body[data-page="client"] h3,body[data-page="staff"] h1,body[data-page="staff"] h2,body[data-page="staff"] h3 { color: var(--paper-on-deep); font-family: var(--serif); }
body[data-page="client"] .lede,body[data-page="client"] .meta,body[data-page="staff"] .lede,body[data-page="staff"] .meta { color: #c7c4bc; }
body[data-page="client"] .portal-head,body[data-page="staff"] .portal-head { border-bottom: 1px solid var(--line-on-deep); }
body[data-page="client"] .portal-head::after,body[data-page="staff"] .portal-head::after { display: none; }
body[data-page="client"] .status,body[data-page="staff"] .status { border-color: var(--line-on-deep); color: var(--paper-on-deep); }
body[data-page="client"] .panel,body[data-page="staff"] .panel { border: 0; border-top: 1px solid var(--line-on-deep); background: transparent; padding: 1.2rem 0; }
body[data-page="client"] .section-title,body[data-page="staff"] .section-title { border-bottom-color: var(--line-on-deep); }
body[data-page="client"] .operation-form,body[data-page="staff"] .operation-form { border-bottom-color: var(--line-on-deep); }
body[data-page="client"] .operation-form label,body[data-page="staff"] .operation-form label { color: #d3d0c8; }
body[data-page="client"] :is(input,select,textarea),body[data-page="staff"] :is(input,select,textarea) { background: rgba(234,230,221,.05); color: var(--paper-on-deep); border-color: rgba(234,230,221,.34); }
body[data-page="client"] .button,body[data-page="staff"] .button { border-color: rgba(234,230,221,.6); color: var(--paper-on-deep); }
body[data-page="client"] .button--primary,body[data-page="staff"] .button--primary { border-color: var(--paper-on-deep); background: var(--paper-on-deep); color: var(--ink-deep); }
body[data-page="client"] .list li,body[data-page="staff"] .list li { border-top-color: var(--line-on-deep); }
body[data-page="client"] .message,body[data-page="staff"] .message { background: rgba(234,230,221,.035); border-left-color: var(--line-on-deep); }
body[data-page="client"] .message--staff,body[data-page="staff"] .message--staff { background: rgba(234,230,221,.06); border-left-color: #8f99aa; }
body[data-page="client"] .message--client,body[data-page="staff"] .message--client { background: rgba(138,75,58,.08); border-left-color: var(--accent); }
body[data-page="client"] .app-link,body[data-page="staff"] .app-link { border: 0; border-top: 1px solid var(--line-on-deep); background: transparent; }
body[data-page="client"] .app-purpose,body[data-page="staff"] .app-purpose { color: #c7c4bc; }
body[data-page="client"] .footer,body[data-page="staff"] .footer { border-top-color: var(--line-on-deep); color: #bdb9b0; }
body[data-page="client"] .environment-banner,body[data-page="staff"] .environment-banner { border: 1px solid var(--line-on-deep); border-left: 2px solid var(--accent); background: transparent; color: var(--paper-on-deep); }
body[data-page="client"] .environment-banner--synthetic,body[data-page="staff"] .environment-banner--synthetic { color: #e3c4a3; }

.hla-module-nav { margin: 0 0 1.5rem!important; border: 0!important; border-bottom: 1px solid var(--line-on-deep)!important; background: transparent!important; padding: 0!important; gap: 1rem!important; }
.hla-module-nav a { position: relative; min-height: 44px!important; border: 0!important; padding: .7rem .15rem .72rem!important; color: #d6d2ca!important; font-size: .88rem!important; font-weight: 650!important; }
.hla-module-nav a:hover { color: var(--paper-on-deep)!important; }
.hla-module-nav a:focus-visible { outline: 2px solid var(--accent)!important; outline-offset: 2px!important; }
.hla-module-nav a[aria-current="page"] { background: transparent!important; color: var(--paper-on-deep)!important; }
.hla-module-nav a[aria-current="page"]::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent); }
.hla-module-icon { width: 1.05rem!important; height: 1.05rem!important; fill: none!important; stroke: currentColor!important; stroke-width: 1.5!important; stroke-linecap: round!important; stroke-linejoin: round!important; }
.hla-overview { border-top: 0!important; display: grid; grid-template-columns: minmax(0,1fr) minmax(10rem,.34fr)!important; align-items: center; gap: clamp(1.5rem,4vw,3rem)!important; }
.hla-overview__art { width: min(13rem,100%)!important; opacity: .76; }
.hla-overview__links a { color: var(--paper-on-deep)!important; font-weight: 650!important; }

@media (max-width: 850px) {
  .hla-public-header__inner { align-items: flex-start; flex-direction: column; padding: 1rem 0; gap: .8rem; }
  .hla-public-nav { justify-content: flex-start; }
  .hla-public-hero__grid,.hla-public-split { grid-template-columns: 1fr; }
  .hla-public-illustration { width: min(100%,38rem); }
  .hla-public-cards { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .hla-utility { justify-content: space-between; gap: .45rem; padding: 0 .75rem; font-size: .72rem; white-space: nowrap; }
  .hla-public-nav { gap: .35rem .7rem; }
  .hla-public-nav > a:not(.hla-nav-action) { font-size: .82rem; }
  .hla-public-nav .hla-nav-action { padding-inline: .65rem; }
  .hla-public-hero { padding-top: 3.4rem; }
  .hla-public-situation,.hla-public-boundary { grid-template-columns: 1fr; gap: .55rem; }
  .hla-public-footer .hla-public-inner { flex-direction: column; }
  .hla-public-illustration { width: 100%; }
  .hla-overview { grid-template-columns: 1fr!important; }
  .hla-overview__art { display: none; }
}
@media (max-width: 390px) {
  .hla-utility { font-size: .68rem; }
  .hla-public-nav { align-items: stretch; }
  .hla-public-nav .hla-nav-action { flex: 1 1 auto; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto!important; transition: none!important; animation: none!important; }
}

/* UX-R2 Category C production artwork. Presentation only. */
.hla-public-illustration img {
  content: normal;
}
body[data-page="client"] .hla-overview__art img {
  content: normal;
}
body[data-page="staff"] .hla-overview__art img {
  content: normal;
}

/* R2.1 sparse public access wall. */
.hla-wall {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
}
.hla-wall * { box-sizing: border-box; }
.hla-wall-main {
  flex: 1;
  display: grid;
  align-items: center;
  padding: clamp(4.5rem,10vw,8rem) 1rem;
}
.hla-wall-inner {
  width: min(100%,72rem);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(18rem,.95fr);
  align-items: center;
  gap: clamp(3rem,8vw,7rem);
}
.hla-wall-wordmark {
  margin: 0 0 2.75rem;
  font: 400 1.3rem/1.1 var(--serif);
  letter-spacing: .01em;
}
.hla-wall-copy h1 {
  max-width: 19ch;
  margin: 0;
  color: var(--ink);
  font: 400 clamp(2.6rem,4.8vw,4.5rem)/1.06 var(--serif);
  letter-spacing: -.025em;
}
.hla-wall-copy > p:not(.hla-wall-wordmark) {
  max-width: 43rem;
  margin: 1.7rem 0 0;
  color: var(--ink-soft);
  font-size: clamp(1rem,1.3vw,1.14rem);
  line-height: 1.65;
}
.hla-wall-copy .hla-button { margin-top: 2rem; }
.hla-wall-art { width: 100%; margin: 0; opacity: .84; }
.hla-wall-art img { display: block; width: 100%; height: auto; }

/* UX-R2 light institutional private workspaces. */
body[data-page="client"],
body[data-page="staff"] {
  background: var(--paper)!important;
  color: var(--ink)!important;
}
body[data-page="client"] .masthead,
body[data-page="staff"] .masthead {
  background: var(--paper)!important;
  color: var(--ink)!important;
  box-shadow: none!important;
  border-bottom: 1px solid var(--line-strong)!important;
}
body[data-page="client"] .brand::before,
body[data-page="staff"] .brand::before {
  width: 2px!important;
  background: var(--accent)!important;
}
body[data-page="client"] .shell,
body[data-page="staff"] .shell {
  color: var(--ink)!important;
}
body[data-page="client"] h1,
body[data-page="client"] h2,
body[data-page="client"] h3,
body[data-page="staff"] h1,
body[data-page="staff"] h2,
body[data-page="staff"] h3 {
  color: var(--ink)!important;
  font-family: var(--serif)!important;
}
body[data-page="client"] .lede,
body[data-page="client"] .meta,
body[data-page="staff"] .lede,
body[data-page="staff"] .meta,
body[data-page="client"] .app-purpose,
body[data-page="staff"] .app-purpose {
  color: var(--ink-soft)!important;
}
body[data-page="client"] .portal-head,
body[data-page="staff"] .portal-head {
  border-bottom-color: var(--line)!important;
}
body[data-page="client"] .status,
body[data-page="staff"] .status {
  border-color: var(--line-strong)!important;
  color: var(--ink)!important;
}
body[data-page="client"] .panel,
body[data-page="staff"] .panel {
  border: 0!important;
  border-top: 1px solid var(--line)!important;
  background: transparent!important;
  color: var(--ink)!important;
}
body[data-page="client"] .section-title,
body[data-page="staff"] .section-title,
body[data-page="client"] .operation-form,
body[data-page="staff"] .operation-form {
  border-bottom-color: var(--line)!important;
}
body[data-page="client"] .operation-form label,
body[data-page="staff"] .operation-form label {
  color: var(--ink-soft)!important;
}
body[data-page="client"] :is(input,select,textarea),
body[data-page="staff"] :is(input,select,textarea) {
  background: #fffdf8!important;
  color: var(--ink)!important;
  border-color: var(--line-strong)!important;
}
body[data-page="client"] .button,
body[data-page="staff"] .button {
  border-color: var(--ink)!important;
  color: var(--ink)!important;
}
body[data-page="client"] .button--primary,
body[data-page="staff"] .button--primary {
  border-color: var(--ink)!important;
  background: var(--ink)!important;
  color: var(--paper)!important;
}
body[data-page="client"] .list li,
body[data-page="staff"] .list li,
body[data-page="client"] .app-link,
body[data-page="staff"] .app-link,
body[data-page="client"] .footer,
body[data-page="staff"] .footer {
  border-color: var(--line)!important;
}
body[data-page="client"] .message,
body[data-page="staff"] .message {
  background: rgba(238,232,220,.46)!important;
  border-left-color: var(--line-strong)!important;
  color: var(--ink)!important;
}
body[data-page="client"] .message--client,
body[data-page="staff"] .message--client {
  background: rgba(138,75,58,.06)!important;
  border-left-color: var(--accent)!important;
}
body[data-page="client"] .environment-banner,
body[data-page="staff"] .environment-banner {
  border: 1px solid var(--line)!important;
  border-left: 2px solid var(--accent)!important;
  background: var(--paper-deep)!important;
  color: var(--ink)!important;
}
body[data-page="client"] .environment-banner--synthetic,
body[data-page="staff"] .environment-banner--synthetic {
  color: #6f3d2f!important;
}
body[data-page="client"] .footer,
body[data-page="staff"] .footer {
  color: var(--ink-soft)!important;
}
.hla-module-nav { border-bottom-color: var(--line)!important; }
.hla-module-nav a { color: var(--ink-soft)!important; }
.hla-module-nav a:hover,
.hla-module-nav a[aria-current="page"] { color: var(--ink)!important; }
.hla-overview__links a { color: var(--ink)!important; }

/* Final touch targets. */
.hla-public-brand { min-height: 44px; align-content: center; }
.hla-utility a { min-width: 44px; justify-content: center; }
.hla-public-footer a,
.access-gateway .language a,
.access-back a,
.gateway-footer a,
body[data-page="client"] .masthead .nav a,
body[data-page="staff"] .masthead .nav a,
.hla-overview__links a,
body[data-page="client"] .footer__links a,
body[data-page="staff"] .footer__links a {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
}

@media (max-width: 850px) {
  .hla-wall-inner { grid-template-columns: 1fr; }
  .hla-wall-art { width: min(100%,38rem); }
}
@media (max-width: 620px) {
  .hla-public-illustration img {
    content: normal;
  }
  .hla-wall-main { padding-top: 3.5rem; }
  .hla-wall-wordmark { margin-bottom: 2rem; }
  .hla-wall-art img { content: normal; }
}


/* APPROVED-HLA-DESIGN-RESTORATION: PNG artwork and branded access gateways. */
.hla-public-illustration img { content: url("/assets/hla-iso/letterhead-band-berth.png") !important; }
body[data-page="client"] .hla-overview__art img { content: url("/assets/hla-iso/emblem-01-berth.png") !important; }
body[data-page="staff"] .hla-overview__art img { content: url("/assets/hla-iso/emblem-02-terminal.png") !important; }
.hla-wall-art img { content: normal !important; }
.hla-access-gateway-grid {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(14rem,.55fr);
  gap: clamp(2.5rem,8vw,7rem);
  align-items: center;
  padding: clamp(3rem,8vw,7rem) 1rem;
}
.hla-access-gateway-grid h1 {
  margin: .55rem 0 1rem;
  font: 400 clamp(2.75rem,5vw,4.7rem)/1.04 var(--serif);
  color: var(--ink);
  letter-spacing: -.025em;
}
.hla-access-gateway-grid .hla-overview__art { width: min(20rem,100%); justify-self: center; }
.hla-access-gateway-grid .hla-public-actions { margin-top: 2rem; }
.hla-access-gateway-grid .access-back { margin-top: 2.25rem; }
@media (max-width: 760px) {
  .hla-access-gateway-grid { grid-template-columns: 1fr; min-height: auto; }
  .hla-access-gateway-grid .hla-overview__art { width: min(13rem,55vw); justify-self: start; }
}