/* ===== TYPOGRAPHIE UNIFIED - Typography Standardization ===== */

:root {
  --font-family-primary: "Inter", sans-serif;
  --font-family-heading: "Outfit", sans-serif;
  --font-size-base: 1.6rem;
  --font-size-sm: 1.4rem;
  --font-size-lg: 1.8rem;
  --line-height-base: 1.8;
  --line-height-heading: 1.4;
  --letter-spacing-normal: 0px;
  --letter-spacing-wide: 0.5px;
}

/* ===== BASE TEXT STYLES ===== */

html {
  font-size: 10px;
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-family-primary);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  color: #333;
  background-color: #ffffff;
}

/* ===== ALL TEXT JUSTIFY ===== */

p, 
.paragraph,
.text-content,
article,
.article-content,
.description,
li {
  text-align: justify;
  line-height: var(--line-height-base);
  margin-bottom: 1.2rem;
}

/* ===== HEADINGS HIERARCHY ===== */

h1, 
h2, 
h3, 
h4, 
h5, 
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: var(--font-family-heading);
  line-height: var(--line-height-heading);
  margin-top: 1.5rem;
  margin-bottom: 1rem;
  font-weight: 700;
  color: #222;
}

/* H1 - Hero/Main Title */
h1,
.h1 {
  font-size: 3.6rem;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 1.5rem;
}

/* H2 - Section Titles */
h2,
.h2 {
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.2rem;
}

/* H3 - Subsection Titles */
h3,
.h3 {
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1rem;
}

/* H4 - Small Titles */
h4,
.h4 {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 0.8rem;
}

/* H5 - Small headings */
h5,
.h5 {
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 0.6rem;
}

/* H6 - Smallest headings */
h6,
.h6 {
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

/* ===== SPECIAL TEXT ELEMENTS ===== */

strong,
b {
  font-weight: 600;
}

em,
i {
  font-style: italic;
}

small,
.small-text {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-base);
}

large,
.large-text {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-base);
}

a {
  color: #2e7d32;
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: #1b5e20;
  text-decoration: underline;
}

/* ===== LISTS ===== */

ul,
ol {
  margin-left: 1.6rem;
  margin-bottom: 1.2rem;
}

ul li,
ol li {
  margin-bottom: 0.6rem;
  text-align: justify;
  line-height: var(--line-height-base);
}

/* ===== BLOCKQUOTE ===== */

blockquote {
  border-left: 4px solid #2e7d32;
  padding-left: 1.6rem;
  margin: 1.5rem 0;
  font-style: italic;
  color: #666;
  line-height: var(--line-height-base);
}

/* ===== CODE/PRE ===== */

code,
pre {
  font-family: "Courier New", monospace;
  font-size: 1.4rem;
  background-color: #f5f5f5;
  padding: 0.4rem 0.8rem;
  border-radius: 4px;
}

pre {
  padding: 1rem;
  overflow-x: auto;
  margin: 1rem 0;
}

/* ===== LABELS & SMALL TEXT ===== */

label,
.label {
  font-size: var(--font-size-base);
  font-weight: 500;
  display: inline-block;
  margin-bottom: 0.4rem;
}

/* ===== ACCESSIBILITY - Ensure readable text ===== */

body {
  color-scheme: light dark;
}

/* Ensure minimum contrast */
body {
  color: #333;
  background-color: white;
}

/* ===== RESPONSIVE ADJUSTMENTS ===== */

@media (max-width: 768px) {
  h1,
  .h1 {
    font-size: 2.4rem;
  }

  h2,
  .h2 {
    font-size: 2rem;
  }

  h3,
  .h3 {
    font-size: 1.6rem;
  }

  h4,
  .h4 {
    font-size: 1.4rem;
  }

  body,
  p {
    font-size: 1.5rem;
  }

  small,
  .small-text {
    font-size: 1.3rem;
  }
}

@media (max-width: 480px) {
  h1,
  .h1 {
    font-size: 1.8rem;
  }

  h2,
  .h2 {
    font-size: 1.5rem;
  }

  h3,
  .h3 {
    font-size: 1.3rem;
  }

  body,
  p {
    font-size: 1.4rem;
  }
}

/* Overrides for site components to ensure consistent readable sizes */
.tab-list p,
.tab-list li p,
.section-text,
.section-text p,
.article-card-php p,
.article-card-php .article-excerpt,
.card-content p,
.service-card .card-text,
.about-tab-panel p,
.page-header p,
.realisation p,
.card .card-content p,
#articleModal #modalDesc {
  font-size: 1.5rem !important;
  line-height: 1.8 !important;
}

#articleModal #modalMeta,
.article-card-php p[style*="color:#4caf50"],
.article-card-php .meta,
.stat-number + span,
.card .card-content .badge,
.card .card-content p[style],
.realisations .meta {
  font-size: 1.4rem !important;
}

/* Buttons and small interactive elements on public pages */
.btn,
.btn-link,
.btn-primary,
.btn-outline,
a[style*="padding"],
button[style*="padding"] {
  font-size: 1.5rem !important;
}

/* Ensure partners and small labels are readable */
.partners-list strong,
.partners-list span,
.partner-name {
  font-size: 1.15rem !important;
}

.partner-role,
.partner-location,
.card .partner-label {
  font-size: 1.1rem !important;
}

.partners-locations-title {
  font-size: 1.45rem !important;
}

.partners-locations-place,
.partners-locations-names {
  font-size: 1.25rem !important;
}
