@font-face {
  font-family: 'Inter';
  src: url('../fonts/InterVariable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

body {
  font-family: 'Inter', Arial, sans-serif;
}

/* ============================================
   MEDEA - GLOBAL TYPOGRAPHY
   ============================================ */
:root {
  /* Colors secondary:52657d */
  --md-text-primary: #102b55;
  --md-text-secondary: #647078;
  --md-text-muted: #76859a;
  --md-accent: #12bfc3;

  /* Font sizes */
  --md-font-xs: 12px;
  --md-font-sm: 13px;
  --md-font-base: 14px;
  --md-font-md: 16px;
  --md-font-lg: 18px;
  --md-font-xl: 22px;
  --md-font-2xl: 28px;

  /* Line heights */
  --md-line-normal: 1.5;
  --md-line-relaxed: 1.65;
}

/* --------------------------------------------
   PAGE HEADER
   -------------------------------------------- */

.md-page-header {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
  margin-bottom:20px;
}

.md-page-title {
  font-family: inherit;
  font-size: var(--md-font-2xl);
  font-weight: 700;
  line-height: 1.15;//1.25
  color: var(--md-text-primary);
  margin: 0; //0 0 10px
}

.md-page-subtitle {
  font-size: var(--md-font-base);
  font-weight: 400;
  line-height: var(--md-line-relaxed);
  color: var(--md-text-secondary);
  margin: 7px; //0 0 24px
  max-width: 900px;
}

.md-header-project {
 text-align:right;
 font-size:13px;
 color:#6d777d;
}

.md-header-project strong {
 display:block;
 color:#263238;
 font-size:15px;
}

/* --------------------------------------------
   SECTION TITLES
   -------------------------------------------- */

.md-section-title {
  font-size: var(--md-font-lg);
  font-weight: 600;
  line-height: 1.4;
  color: var(--md-text-primary);
  margin: 0 0 16px;
}

/* --------------------------------------------
   CARD TITLES
   -------------------------------------------- */

.md-card-title {
  font-size: var(--md-font-md);
  font-weight: 600;
  line-height: 1.4;
  color: var(--md-text-primary);
  margin: 0 0 12px;
}

/* --------------------------------------------
   BODY / LABELS / HELPERS
   -------------------------------------------- */

.md-body-text {
  font-size: var(--md-font-base);
  line-height: var(--md-line-normal);
  color: var(--md-text-secondary);
}

.md-field-label {
  font-size: var(--md-font-sm);
  font-weight: 600;
  color: var(--md-text-primary);
}

.md-helper-text {
  font-size: var(--md-font-xs);
  line-height: 1.5;
  color: var(--md-text-muted);
}

/* --------------------------------------------
   TEXT UTILITIES
   -------------------------------------------- */

.md-text-muted {
  color: var(--md-text-muted);
}

.md-text-accent {
  color: var(--md-accent);
}

.md-text-semibold {
  font-weight: 600;
}

/* --------------------------------------------
   RESPONSIVE
   -------------------------------------------- */

@media (max-width: 768px) {
  .md-page-title {
    font-size: 22px;
  }

  .md-page-subtitle {
    font-size: 13px;
  }

  .md-section-title {
    font-size: 17px;
  }
}