/* RM BUSINESS PWA — SHARED HEADER BASELINE v60
   Single source of truth for vertical logo/title alignment across
   Business Hub, Business Manager, Cleaning Calculator and VAT Calculator.
*/
:root {
  --rm-header-top: max(40px, calc(env(safe-area-inset-top) + 20px));
  --rm-header-top-standalone: calc(env(safe-area-inset-top) + 22px);
  --rm-header-inner-top: 6px;
  --rm-brand-mark-size: 46px;
  --rm-brand-mark-offset-y: -3px;
  --rm-brand-gap: 12px;
  --rm-eyebrow-size: 11px;
  --rm-eyebrow-line: 1.2;
  --rm-eyebrow-weight: 800;
  --rm-eyebrow-spacing: .13em;
  --rm-app-title-size: 25px;
  --rm-app-title-line: 1.1;
  --rm-app-title-weight: 800;
  --rm-app-title-spacing: -.025em;
}

/* Same top coordinate on every internal page. */
.rm-header-shell {
  padding-top: var(--rm-header-top) !important;
}
html.is-standalone .rm-header-shell {
  padding-top: var(--rm-header-top-standalone) !important;
}

/* Same inner offset from the shell/header top to the brand block. */
.rm-header-frame {
  padding-top: var(--rm-header-inner-top) !important;
}

/* Same geometry regardless of whether an app has a subtitle. */
.rm-brand-cluster {
  display: flex !important;
  align-items: flex-start !important;
  gap: var(--rm-brand-gap) !important;
  min-width: 0;
}
.rm-brand-copy {
  min-width: 0;
}

/* Logo is positioned relative to the eyebrow/title block, not to subtitles. */
.rm-brand-cluster .brand-home-link {
  display: inline-flex !important;
  flex: 0 0 var(--rm-brand-mark-size) !important;
  align-self: flex-start !important;
  transform: translateY(var(--rm-brand-mark-offset-y)) !important;
}
.rm-brand-cluster .brand-mark {
  width: var(--rm-brand-mark-size) !important;
  height: var(--rm-brand-mark-size) !important;
  flex: 0 0 var(--rm-brand-mark-size) !important;
  font-size: 16px !important;
  line-height: 1 !important;
  transform: none !important;
}

/* Exact same eyebrow baseline. */
.rm-brand-copy .eyebrow {
  margin: 0 !important;
  position: static !important;
  top: auto !important;
  font-size: var(--rm-eyebrow-size) !important;
  line-height: var(--rm-eyebrow-line) !important;
  font-weight: var(--rm-eyebrow-weight) !important;
  letter-spacing: var(--rm-eyebrow-spacing) !important;
}

/* Exact same app-title baseline. Bottom spacing stays app-specific. */
.rm-brand-copy h1 {
  margin-top: 0 !important;
  font-size: var(--rm-app-title-size) !important;
  line-height: var(--rm-app-title-line) !important;
  font-weight: var(--rm-app-title-weight) !important;
  letter-spacing: var(--rm-app-title-spacing) !important;
}