/********** Clean Typography System - Inspired by Modern Professional Sites **********/

/* Import Inter font - clean, modern, professional */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

/* Base font settings */
:root {
  /* Font family */
  --font-family-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  
  /* Reduced font sizes - 20-30% smaller */
  --font-size-xs: 0.75rem;      /* 12px */
  --font-size-sm: 0.875rem;    /* 14px */
  --font-size-base: 1rem;      /* 16px */
  --font-size-lg: 1.125rem;    /* 18px */
  --font-size-xl: 1.25rem;     /* 20px */
  --font-size-2xl: 1.5rem;     /* 24px */
  --font-size-3xl: 1.875rem;   /* 30px */
  --font-size-4xl: 2.25rem;    /* 36px */
  --font-size-5xl: 3rem;       /* 48px */
  
  /* Line heights */
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  
  /* Font weights */
  --font-weight-light: 300;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
}

/* Apply Inter font globally */
body {
  font-family: var(--font-family-base) !important;
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  font-weight: var(--font-weight-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Reduced heading sizes */
h1, .h1 {
  font-size: var(--font-size-4xl) !important;  /* 36px instead of ~48-72px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-tight) !important;
  margin-bottom: 1rem !important;
}

h2, .h2 {
  font-size: var(--font-size-3xl) !important;  /* 30px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-tight) !important;
  margin-bottom: 0.875rem !important;
}

h3, .h3 {
  font-size: var(--font-size-2xl) !important;  /* 24px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-normal) !important;
  margin-bottom: 0.75rem !important;
}

h4, .h4 {
  font-size: var(--font-size-xl) !important;  /* 20px */
  font-weight: var(--font-weight-medium) !important;
  line-height: var(--line-height-normal) !important;
  margin-bottom: 0.5rem !important;
}

h5, .h5 {
  font-size: var(--font-size-lg) !important;  /* 18px */
  font-weight: var(--font-weight-medium) !important;
  line-height: var(--line-height-normal) !important;
  margin-bottom: 0.5rem !important;
}

h6, .h6 {
  font-size: var(--font-size-base) !important;  /* 16px */
  font-weight: var(--font-weight-medium) !important;
  line-height: var(--line-height-normal) !important;
  margin-bottom: 0.5rem !important;
}

/* Reduced display sizes */
.display-1 {
  font-size: var(--font-size-5xl) !important;  /* 48px instead of ~80px */
  font-weight: var(--font-weight-bold) !important;
  line-height: var(--line-height-tight) !important;
}

.display-2 {
  font-size: var(--font-size-4xl) !important;  /* 36px */
  font-weight: var(--font-weight-bold) !important;
  line-height: var(--line-height-tight) !important;
}

.display-3 {
  font-size: var(--font-size-3xl) !important;  /* 30px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-tight) !important;
}

.display-4 {
  font-size: var(--font-size-2xl) !important;  /* 24px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-normal) !important;
}

.display-5 {
  font-size: var(--font-size-xl) !important;  /* 20px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-normal) !important;
}

.display-6 {
  font-size: var(--font-size-2xl) !important;  /* 24px instead of ~36px */
  font-weight: var(--font-weight-semibold) !important;
  line-height: var(--line-height-tight) !important;
}

/* Reduced font size utilities */
.fs-1 {
  font-size: var(--font-size-4xl) !important;
}

.fs-2 {
  font-size: var(--font-size-3xl) !important;
}

.fs-3 {
  font-size: var(--font-size-2xl) !important;
}

.fs-4 {
  font-size: var(--font-size-xl) !important;
}

.fs-5 {
  font-size: var(--font-size-lg) !important;  /* 18px instead of ~20px */
}

.fs-6 {
  font-size: var(--font-size-base) !important;  /* 16px */
}

/* Small text */
small, .small {
  font-size: var(--font-size-sm) !important;
  line-height: var(--line-height-normal) !important;
}

/* Paragraph spacing */
p {
  font-size: var(--font-size-base) !important;
  line-height: var(--line-height-relaxed) !important;
  margin-bottom: 1rem !important;
}

/* Lead text */
.lead {
  font-size: var(--font-size-lg) !important;
  font-weight: var(--font-weight-normal) !important;
  line-height: var(--line-height-relaxed) !important;
}

/* Navigation links - reduced size */
.navbar .navbar-nav .nav-link {
  font-size: var(--font-size-base) !important;  /* 16px instead of 18px */
  font-weight: var(--font-weight-medium) !important;
}

/* Buttons - reduced padding and font size */
.btn {
  font-size: var(--font-size-base) !important;
  font-weight: var(--font-weight-medium) !important;
  padding: 0.625rem 1.25rem !important;  /* Reduced from default */
  line-height: var(--line-height-normal) !important;
}

.btn-lg {
  font-size: var(--font-size-lg) !important;
  padding: 0.75rem 1.5rem !important;
}

.btn-sm {
  font-size: var(--font-size-sm) !important;
  padding: 0.5rem 1rem !important;
}

/* Section titles */
.section-title {
  font-size: var(--font-size-sm) !important;
  font-weight: var(--font-weight-semibold) !important;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Carousel text */
.carousel-text h1 {
  font-size: var(--font-size-4xl) !important;  /* 36px */
  font-weight: var(--font-weight-bold) !important;
}

.carousel-text p {
  font-size: var(--font-size-lg) !important;  /* 18px */
}

/* Statistics numbers */
[data-toggle="counter-up"] {
  font-size: var(--font-size-4xl) !important;  /* 36px instead of ~48px */
  font-weight: var(--font-weight-bold) !important;
}

/* Clean spacing adjustments */
.mb-5 {
  margin-bottom: 2rem !important;  /* Reduced from 3rem */
}

.mb-4 {
  margin-bottom: 1.5rem !important;  /* Reduced from 1.5rem */
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.py-5 {
  padding-top: 2.5rem !important;  /* Reduced from 3rem */
  padding-bottom: 2.5rem !important;
}

/* Reduce excessive padding in carousel */
.carousel-text {
  padding: 0 !important;
}

/* Clean button spacing */
.btn {
  letter-spacing: 0.01em;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  h1, .h1, .display-1 {
    font-size: var(--font-size-3xl) !important;  /* 30px on mobile */
  }
  
  h2, .h2, .display-2 {
    font-size: var(--font-size-2xl) !important;  /* 24px on mobile */
  }
  
  .display-6 {
    font-size: var(--font-size-xl) !important;  /* 20px on mobile */
  }
  
  .carousel-text h1 {
    font-size: var(--font-size-3xl) !important;
  }
  
  .py-5 {
    padding-top: 2rem !important;
    padding-bottom: 2rem !important;
  }
}