/* assets/css/brand-lockup.css — Ailane brand lockup: Nexus mark + Ai·lane wordmark.
   Single source of truth for the lockup on every surface outside the index.html and
   monitoring/index.html navigation, which carry equivalent inline rules (NEXUS-LOGO-001/002).
   Authority: AMD-291 §4 (gold carve-out) and §5 (wordmark); AILANE-SPEC-EILEEN-NEXUS-001-AM-001.
   Requires /assets/css/tokens.css for --nexus-ring-baseline, --nexus-core, --text-prime, --text-sec.
   No Nexus hex value appears in this file by design (NEXUS-001 §11). */

.ail-lockup {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'DM Serif Display', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.02em;
  line-height: 1;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
}
.ail-lockup .ail-mark { width: 40px; height: 40px; flex: none; display: block; }
.ail-lockup .ail-mark img { width: 100%; height: 100%; display: block; }
.ail-lockup .ail-word { color: var(--text-prime); }
.ail-lockup .ail-ai { color: var(--nexus-ring-baseline); }
.ail-lockup .ail-suffix {
  font-family: 'DM Sans', system-ui, sans-serif;
  font-size: 0.62em;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--text-sec);
  margin-left: 4px;
}

/* Hover and keyboard focus: the wordmark in the Core Identity Colour (AMD-291 §4).
   The last four selectors cover a lockup nested inside a parent link. */
.ail-lockup:hover .ail-word,
.ail-lockup:hover .ail-ai,
.ail-lockup:focus-visible .ail-word,
.ail-lockup:focus-visible .ail-ai,
a:hover > .ail-lockup .ail-word,
a:hover > .ail-lockup .ail-ai,
a:focus-visible > .ail-lockup .ail-word,
a:focus-visible > .ail-lockup .ail-ai { color: var(--nexus-core); }

/* Compact variant: footers and application top bars. */
.ail-lockup--sm { font-size: 1.25rem; }
.ail-lockup--sm .ail-mark { width: 28px; height: 28px; }

@media (max-width: 480px) {
  .ail-lockup { font-size: 1.25rem; }
  .ail-lockup .ail-mark { width: 32px; height: 32px; }
  .ail-lockup--sm .ail-mark { width: 24px; height: 24px; }
}