/*--- functions/styles/base.css ---*/

/* Reset and global styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  margin: 0;
  padding: 0;
  min-height: 100vh;
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--cc-tertiary-text);
  background-color: var(--cc-tertiary);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:root {
  --font-size-sm: 0.9375rem; /* 15px */
  --font-size-base: 1rem;    /* 16px */
  --font-size-md: 1.125rem;  /* 18px */
  --font-size-lg: 1.375rem;  /* 22px */
  --font-size-xl: 1.75rem;   /* 28px */
  --font-size-xxl: 2.25rem;  /* 36px */
  --heading-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: var(--heading-weight);
  color: var(--cc-secondary);
  line-height: 1.25;
  margin-bottom: 0.75rem;
}

h1 { font-size: var(--font-size-xxl); }
h2 { font-size: var(--font-size-xl); }
h3 { font-size: var(--font-size-lg); }
h4 { font-size: 1.25rem; }
h5 { font-size: var(--font-size-base); }
h6 { font-size: var(--font-size-sm); letter-spacing: 0.04em; text-transform: uppercase; }

p, li {
  font-size: var(--font-size-base);
  line-height: 1.65;
  margin-bottom: 1rem;
}

a {
  color: var(--cc-accent);
  text-decoration: none;
  transition: color 0.2s ease;
}

a:hover,
a:focus-visible {
  color: #086f7f;
  text-decoration: underline;
  outline: none;
}

button,
.dashboard-btn {
  font-family: inherit;
  font-size: var(--font-size-base);
}

@media (max-width: 1024px) {
  body {
    font-size: 15px;
  }
  h1 { font-size: 2rem; }
  h2 { font-size: 1.6rem; }
  h3 { font-size: 1.35rem; }
}

@media (max-width: 640px) {
  body {
    font-size: 14.5px;
  }
  h1 { font-size: 1.8rem; }
  h2 { font-size: 1.45rem; }
  h3 { font-size: 1.25rem; }
}