/* ==============================
   TYPOGRAPHY.CSS
   Sito: Nicole Londino
   Ultimo aggiornamento: 2025-11-14
   Richiede: variables.css
   ============================== */

/* 🖋️ Base */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body {
  font-family: var(--font-primary, sans-serif); /* "Montserrat", sans-serif */
  color: var(--color-text); /* #1f1d26 */
  background: var(--color-bg); /* #f5f5f5 */
}

/* 🔗 Link */
a {
  color: inherit;
  text-decoration: none;
}

/* 🧩 Classi tipografiche (role-based) */
.title-display {
  font-size: var(--fs-display); /* 5rem */
}
.title-1 {
  font-size: var(--fs-h1); /* 2.25rem */
}
.title-2 {
  font-size: var(--fs-h2); /* 1.75rem */
}
.title-3 {
  font-size: var(--fs-h3); /* 1.25rem */
}

.title-3-2 {
  font-size: 1.25rem;
}

.title-4 {
  font-size: var(--fs-h4); /* 0.875rem */
}

.title-5 {
  font-size: var(--fs-h5); /* 0.75rem */
}
.body-1 {
  font-size: var(--fs-body); /* 1rem */
}

.body-2 {
  font-size: 1rem;
}

/* 🎛️ Utilities testo */
.bold {
  font-weight: var(--fw-bold); /* 700 */
}
.semibold {
  font-weight: var(--fw-semibold); /* 600 */
}
.medium {
  font-weight: var(--fw-medium); /* 500 */
}
.regular {
  font-weight: var(--fw-regular); /* 400 */
}

.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}
.text-left {
  text-align: left;
}

.lato {
  font-family: var(--font-secondary); /* "Lato", sans-serif */
}

/* ==============================
   COLOR UTILITIES
   ============================== */

/* 🎨 Testo */
.cl-primary {
  color: var(--color-primary); /* #f8b4c9 */
}
.cl-secondary {
  color: var(--color-secondary); /* #5d508b */
}
.cl-bg {
  color: var(--color-bg); /* #f5f5f5 */
}
.cl-dark {
  color: var(--color-text); /* #1f1d26 */
}
.cl-white {
  color: #fff;
}

/* 🎨 Background */
.bg-primary {
  background-color: var(--color-primary); /* #f8b4c9 */
  border-radius: 0 0.3125rem 0.3125rem 0;
}
.bg-secondary {
  background-color: var(--color-secondary); /* #5d508b */
  border-radius: 0.3125rem 0.3125rem 0 0;
}
.bg-light {
  background-color: var(--color-bg); /* #f5f5f5 */
}
.bg-dark {
  background-color: var(--color-text); /* #1f1d26 */
}
.bg-white {
  background-color: #fff;
}

/* 🎨 Gradienti */
.bg-gradient-primary {
  background: var(
    --gradient-primary
  ); /* linear-gradient(180deg, #d5c8ff 0%, #f8b4c9 100%) */
}
.bg-gradient-secondary {
  background: var(
    --gradient-secondary
  ); /* linear-gradient(270deg, #e89e47 0%, #817fd1 100%) */
}