/**
 * TumiTrust Brand System — canonical design tokens.
 * Import once per surface: marketing, institution console, docs, hubs.
 */
:root {
  /* Primary palette */
  --tt-brand-orange: #e95420;
  --tt-brand-orange-bright: #ff8c00;
  --tt-brand-gold: #daa520;
  --tt-brand-amber: #f59e0b;
  --tt-brand-ink: #2a221c;
  --tt-brand-slate-900: #0f172a;
  --tt-brand-slate-700: #334155;
  --tt-brand-slate-500: #64748b;
  --tt-brand-canvas-warm: #fff9f4;
  --tt-brand-canvas-white: #ffffff;
  --tt-brand-border: rgba(107, 76, 58, 0.14);
  --tt-brand-border-strong: rgba(233, 84, 32, 0.35);

  /* Semantic */
  --tt-brand-link: #b45309;
  --tt-brand-link-hover: #9a3412;
  --tt-brand-success: #15803d;
  --tt-brand-muted: rgba(42, 34, 28, 0.72);

  /* Typography */
  --tt-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --tt-font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;
  --tt-font-display-size: clamp(2rem, 4vw, 3rem);
  --tt-font-h1-size: clamp(1.75rem, 3vw, 2.25rem);
  --tt-font-h2-size: 1.35rem;
  --tt-font-body-size: 1rem;
  --tt-font-small-size: 0.875rem;
  --tt-line-height-tight: 1.2;
  --tt-line-height-body: 1.6;

  /* Spacing */
  --tt-space-xs: 0.25rem;
  --tt-space-sm: 0.5rem;
  --tt-space-md: 1rem;
  --tt-space-lg: 1.5rem;
  --tt-space-xl: 2rem;
  --tt-space-2xl: 3rem;
  --tt-space-section: clamp(3rem, 6vw, 5rem);

  /* Radius & shadow */
  --tt-radius-sm: 0.375rem;
  --tt-radius-md: 0.75rem;
  --tt-radius-lg: 1rem;
  --tt-radius-pill: 9999px;
  --tt-shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08);
  --tt-shadow-md: 0 8px 24px rgba(15, 23, 42, 0.1);
  --tt-shadow-lg: 0 18px 48px rgba(15, 23, 42, 0.14);

  /* Layout */
  --tt-content-max: 72rem;
  --tt-prose-max: 48rem;
  --tt-nav-height: 4rem;

  /* Legacy aliases (migrate consumers gradually) */
  --neon-orange: var(--tt-brand-orange);
  --neon-gold: var(--tt-brand-gold);
  --ubuntu-orange: var(--tt-brand-orange-bright);
  --ubuntu-gold: var(--tt-brand-gold);
}

/* Enterprise hub surfaces */
.tt-enterprise-surface {
  font-family: var(--tt-font-sans);
  color: var(--tt-brand-ink);
  background: var(--tt-brand-canvas-warm);
}

.tt-enterprise-surface--dark {
  color: #e2e8f0;
  background: linear-gradient(180deg, var(--tt-brand-slate-900) 0%, #1e293b 100%);
}

.tt-enterprise-container {
  max-width: var(--tt-content-max);
  margin: 0 auto;
  padding: 0 var(--tt-space-lg);
}

.tt-enterprise-card {
  background: var(--tt-brand-canvas-white);
  border: 1px solid var(--tt-brand-border);
  border-radius: var(--tt-radius-lg);
  padding: var(--tt-space-lg);
  box-shadow: var(--tt-shadow-sm);
  transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.tt-enterprise-card:hover {
  border-color: var(--tt-brand-border-strong);
  box-shadow: var(--tt-shadow-md);
  transform: translateY(-2px);
}

.tt-enterprise-card__title {
  font-size: var(--tt-font-h2-size);
  font-weight: 700;
  color: var(--tt-brand-ink);
  margin: 0 0 var(--tt-space-sm);
}

.tt-enterprise-card__desc {
  font-size: var(--tt-font-small-size);
  color: var(--tt-brand-muted);
  margin: 0;
  line-height: var(--tt-line-height-body);
}

.tt-enterprise-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--tt-space-sm);
  padding: 0.65rem 1.25rem;
  font-weight: 600;
  font-size: var(--tt-font-small-size);
  border-radius: var(--tt-radius-md);
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

.tt-enterprise-btn--primary {
  background: var(--tt-brand-orange);
  color: #fff;
}

.tt-enterprise-btn--primary:hover {
  background: var(--tt-brand-orange-bright);
  color: #fff;
}

.tt-enterprise-btn--secondary {
  background: transparent;
  color: var(--tt-brand-link);
  border: 1px solid var(--tt-brand-border-strong);
}

.tt-enterprise-btn--secondary:hover {
  background: rgba(233, 84, 32, 0.08);
  color: var(--tt-brand-link-hover);
}