.brand { display:flex; align-items:center; min-width:0; transition:opacity .2s ease; }
.brand img { width:auto; height:22px; aspect-ratio:935 / 609; flex:none; }
/* brand mark: MartinsTech single-colour logo, navy on light, white on dark (portal.css .logo-l/.logo-d).
   Never recolour or stretch it: height fixed, width follows the 935x609 ratio. Respiro: 50% of the
   22px height (11px) on every side, so the gap to the product name is 11px. */
.pa .brand { border:0; background:transparent; padding:4px 8px 4px 0; border-radius:8px; text-align:left; gap:11px; }
.brand .logo-d { display:none; }
.brand:hover .brand-name { color:var(--nav-active-fg); }
.pa .brand.side { width:100%; min-height:44px; padding:4px 8px; }
.pa.dark .brand .logo-l { display:none; }
.pa.dark .brand .logo-d { display:block; }
.brand-name { font-size:14px; font-weight:600; color:var(--text-2); }
.side-brand { display:flex; align-items:center; gap:4px; padding:12px 10px 0 14px; }
.pa .side-brand { padding-left:10px; padding-right:6px; }
.side-brand .brand.side { flex:1; width:auto; }
.side-island img { display:block; }
.pa .side-island {
  position:fixed; z-index:6; top:12px; left:16px; display:inline-flex; align-items:center; gap:10px;
  min-height:44px; padding:4px 12px 4px 14px; border:0; border-radius:999px; background:var(--ag-bg);
  color:var(--text-2); box-shadow:var(--shadow-sm); cursor:pointer;
}
.side-island:focus-visible { outline:2px solid var(--focus); outline-offset:2px; }
.side-island .logo-d { display:none; }
.pa .side-island[hidden] { display:none; }
.pa .side-island:hover { background:var(--nav-active-bg); color:var(--text); }
.pa.dark .side-island .logo-l { display:none; }
.pa.dark .side-island .logo-d { display:block; }
.welcome-mark.logo-d { display:none; }
.pa.dark .welcome-mark.logo-l { display:none; }
.pa.dark .welcome-mark.logo-d { display:block; }
/* the logo button also carries the "open sidebar" icon (shown in the rail on hover/focus) */
.brand .brand-open { display:none; width:24px; height:24px; flex:none; }
@container (min-width: 720px) and (max-width: 1099px) {
  /* rail: logo (turns into the open icon) then search; the collapse toggle only exists inside the drawer */
  .pa:not(.side-over) .brand-name { display:none; }
  .pa:not(.side-over) .side-brand { flex-direction:column; align-items:center; gap:4px; padding:12px 0 0; }
  .pa:not(.side-over) .side-brand .brand.side { flex:none; width:auto; min-width:48px; justify-content:center; padding:4px 8px; }
  .pa:not(.side-over) .contacts .side-brand { position:sticky; top:0; z-index:2; background:var(--surface); padding-bottom:8px; }
  .pa:not(.side-over) .side-toggle { display:none; }
  .pa:not(.side-over) .brand.side:is(:hover, :focus-visible) img { display:none; }
  .pa:not(.side-over) .brand.side:is(:hover, :focus-visible) .brand-open { display:block; }
}
@container (max-width: 1099px) {
  .pa .side-island { display:none; }
}
@container (max-width: 719px) {
  .brand { flex:1; min-height:44px; }
  .pa:not(.side-over) .side-toggle { display:none; }
}