/**
 * iKonyk Solutions — Base Styles
 * Global typography, links, and resets. Depends on tokens.css.
 */

body {
  font-family: var(--font-body);
  color: var(--color-neutral-950);
  background-color: var(--color-neutral-100);
  font-size: 1rem;
  line-height: 1.7;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  color: var(--color-neutral-950);
  line-height: 1.2;
  font-weight: 700;
}

h1 { font-size: clamp(2rem,    5vw,   3.25rem); }
h2 { font-size: clamp(1.5rem,  3.5vw, 2.25rem); }
h3 { font-size: clamp(1.25rem, 2.5vw, 1.625rem); }

p {
  margin-bottom: 1.25rem;
  max-width: 68ch;
}

a {
  color: var(--color-brand-500);
  text-decoration: none;
  transition: color 0.15s ease;
}

a:hover {
  color: var(--color-brand-700);
  text-decoration: underline;
}

/* ─── Utility classes ─── */
.ik-dark {
  background-color: var(--color-primary-900);
  color: var(--color-white);
}
.ik-dark h1,
.ik-dark h2,
.ik-dark h3 { color: var(--color-white); }
.ik-dark p  { color: var(--color-neutral-300); }

.text-accent { color: var(--color-accent-400); }
.text-brand  { color: var(--color-brand-300); }
.text-muted  { color: var(--color-neutral-500); }
.text-center { text-align: center; }
