/* =====================================================
   LOVIN JOBS — Ενιαία Τυπογραφία v1
   -----------------------------------------------------
   Πηγή αναφοράς: index.html (το master reference)
   Μία αλλαγή εδώ → αλλάζουν ΟΛΕΣ οι σελίδες μαζί.
   ===================================================== */

:root {
  /* Οικογένεια γραμματοσειράς */
  --font-sans: 'DM Sans', system-ui, -apple-system, sans-serif;

  /* Βάρη */
  --fw-light: 300;     /* μεγάλοι τίτλοι (hero, section titles) */
  --fw-regular: 400;   /* παράγραφοι, κανονικό κείμενο */
  --fw-medium: 500;    /* badges, labels, small caps */
  --fw-semibold: 600;  /* κουμπιά, έντονα */
  --fw-bold: 700;      /* πολύ έντονα (σπάνια) */

  /* Μεγέθη (mobile → desktop με clamp) */
  --fs-hero-title: clamp(32px, 4.5vw, 56px);    /* hero tagline */
  --fs-hero-sub: clamp(16px, 2vw, 20px);        /* hero subtitle */
  --fs-section-title: clamp(28px, 3.5vw, 52px); /* τίτλοι sections */
  --fs-page-title: clamp(22px, 2.8vw, 32px);    /* τίτλοι dashboards */
  --fs-card-title: clamp(16px, 1.6vw, 18px);    /* τίτλοι καρτών */
  --fs-body: 16px;                              /* κανονικό κείμενο */
  --fs-small: 14px;                             /* μικρό κείμενο */
  --fs-tiny: 12px;                              /* badges */
  --fs-label: 11px;                             /* καπέλα sections */

  /* Letter-spacing */
  --ls-tight: -1px;
  --ls-normal: 0;
  --ls-wide: 1px;
  --ls-wider: 2px;
  --ls-widest: 3px;

  /* Line-height */
  --lh-tight: 1.1;
  --lh-normal: 1.5;
  --lh-loose: 1.7;
}

/* =====================================================
   Utility κλάσεις — χρήση παντού
   ===================================================== */

.t-hero-title {
  font-family: var(--font-sans);
  font-size: var(--fs-hero-title);
  font-weight: var(--fw-light);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
}

.t-hero-sub {
  font-family: var(--font-sans);
  font-size: var(--fs-hero-sub);
  font-weight: var(--fw-light);
  line-height: var(--lh-normal);
}

.t-section-title {
  font-family: var(--font-sans);
  font-size: var(--fs-section-title);
  font-weight: var(--fw-light);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight);
}

.t-page-title {
  font-family: var(--font-sans);
  font-size: var(--fs-page-title);
  font-weight: var(--fw-light);
  line-height: var(--lh-tight);
}

.t-card-title {
  font-family: var(--font-sans);
  font-size: var(--fs-card-title);
  font-weight: var(--fw-semibold);
  line-height: var(--lh-tight);
}

.t-body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: var(--fw-regular);
  line-height: var(--lh-normal);
}

.t-small {
  font-family: var(--font-sans);
  font-size: var(--fs-small);
  font-weight: var(--fw-regular);
  line-height: var(--lh-normal);
}

.t-badge {
  font-family: var(--font-sans);
  font-size: var(--fs-tiny);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-widest);
  text-transform: uppercase;
  line-height: 1;
}

.t-label {
  font-family: var(--font-sans);
  font-size: var(--fs-label);
  font-weight: var(--fw-medium);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  line-height: 1;
}

.t-button {
  font-family: var(--font-sans);
  font-size: var(--fs-small);
  font-weight: var(--fw-semibold);
  letter-spacing: var(--ls-normal);
  line-height: 1;
}
