/* cobomind.ai — brand tokens 1.0 | 2026-10-10
   The HEX palette approximates the approved generated raster logo.
   Avoid using bright cyan/electric blue as small text on white. */
:root {
  --cm-navy: #0B2030;
  --cm-navy-hover: #163B54;
  --cm-night: #071827;
  --cm-blue: #009DF1;
  --cm-cyan: #00C2D6;
  --cm-teal: #00B9B9;
  --cm-white: #FFFFFF;
  --cm-ice: #F7FAFC;
  --cm-slate: #526779;
  --cm-border: #DDE7ED;
  --cm-cyan-soft: #EAF8FC;

  --cm-bg: var(--cm-white);
  --cm-bg-alt: var(--cm-ice);
  --cm-bg-dark: var(--cm-night);
  --cm-text: var(--cm-navy);
  --cm-text-muted: var(--cm-slate);
  --cm-text-on-dark: var(--cm-white);
  --cm-primary: var(--cm-navy);
  --cm-primary-hover: var(--cm-navy-hover);
  --cm-focus: var(--cm-blue);
  --cm-gradient: linear-gradient(115deg, var(--cm-blue), var(--cm-cyan));

  --cm-font-heading: 'Manrope', 'Inter', system-ui, sans-serif;
  --cm-font-body: 'Inter', 'Manrope', system-ui, sans-serif;
  --cm-radius-button: 10px;
  --cm-radius-card: 16px;
  --cm-container: 1200px;
  --cm-section-pad: 96px;
  --cm-spacing-unit: 8px;
  --cm-transition: 180ms ease-out;
}

/* Suggested usage patterns; adapt the class names to your framework. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font: 400 16px/1.65 var(--cm-font-body); color: var(--cm-text); background: var(--cm-bg); }
h1, h2, h3, h4 { margin: 0; font-family: var(--cm-font-heading); letter-spacing: -0.035em; line-height: 1.12; }
h1 { font-size: clamp(2.75rem, 5vw, 5rem); font-weight: 800; }
h2 { font-size: clamp(2rem, 3.4vw, 3.25rem); font-weight: 750; }
h3 { font-size: clamp(1.25rem, 1.8vw, 1.6rem); font-weight: 700; }
p { margin: 0 0 1em; }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--cm-focus); outline-offset: 4px; }
.cm-container { width: min(100% - 64px, var(--cm-container)); margin-inline: auto; }
.cm-section { padding-block: var(--cm-section-pad); }
.cm-section--alt { background: var(--cm-bg-alt); }
.cm-section--dark { background: var(--cm-bg-dark); color: var(--cm-text-on-dark); }
.cm-muted { color: var(--cm-text-muted); }
.cm-gradient-accent { background: var(--cm-gradient); }
.cm-button { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:12px 22px; border:1px solid transparent; border-radius:var(--cm-radius-button); font-weight:700; text-decoration:none; cursor:pointer; transition: background-color var(--cm-transition), transform var(--cm-transition), border-color var(--cm-transition); }
.cm-button--primary { color:var(--cm-white); background:var(--cm-primary); }
.cm-button--primary:hover { background:var(--cm-primary-hover); transform:translateY(-1px); }
.cm-button--secondary { color:var(--cm-navy); background:transparent; border-color:var(--cm-border); }
.cm-button--secondary:hover { border-color:var(--cm-navy); }
.cm-button--dark-cta { color:var(--cm-navy); background:var(--cm-cyan); }
.cm-button--dark-cta:hover { background:#5DDEE8; }
.cm-card { padding:28px; border:1px solid var(--cm-border); border-radius:var(--cm-radius-card); background:var(--cm-white); }
.cm-eyebrow { font-size:0.75rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.cm-eyebrow--dark { color:var(--cm-cyan); }
@media(max-width:700px) {
 .cm-container { width: min(100% - 40px, var(--cm-container)); }
 .cm-section { padding-block:64px; }
}
@media(prefers-reduced-motion: reduce) {
 html { scroll-behavior:auto; }
 *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}