/* Font Imports - All Google Fonts should be imported here */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comic+Relief:wght@400;700&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Mulish:ital,wght@0,200..1000;1,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comic+Relief:wght@400;700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Mulish:ital,wght@0,200..1000;1,200..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comic+Relief:wght@400;700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Quintessential&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comic+Relief:wght@400;700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&family=Mooli&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Quintessential&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&display=swap');



/* Font Variables - Edit these to change fonts across the entire site */
:root {
  /* Primary Fonts */
  --font-primary: 'Montserrat', sans-serif;     /* Base font for body text */
  --font-secondary: 'DM Serif Text', sans-serif;  /* Font for headings */
  --font-accent: 'Lora', Georgia, serif;        /* Font for special elements */
  --font-comic: 'Comic Relief', cursive;        /* Font for special elements */

  /* Font Weights */
  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  
  /* Font Sizes */
  --size-xs: 0.75rem;    /* 12px */
  --size-sm: 0.875rem;   /* 14px */
  --size-base: 1rem;     /* 16px */
  --size-md: 1.125rem;   /* 18px */
  --size-lg: 1.25rem;    /* 20px */
  --size-xl: 1.5rem;     /* 24px */
  --size-2xl: 1.75rem;   /* 28px */
  --size-3xl: 2rem;      /* 32px */
  --size-4xl: 2.5rem;    /* 40px */
  --size-5xl: 3rem;      /* 48px */
}

/* Base Font Settings */
body {
  font-family: var(--font-primary);
  font-weight: var(--weight-regular);
  font-size: var(--size-base);
  line-height: 1.5;
  color: #333;
}

/* Heading Classes */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-secondary);
  font-weight: var(--weight-semibold);
  line-height: 1.2;
  margin-bottom: 0.5em;
}

h1 {
  font-size: var(--size-4xl);
}

h2 {
  font-size: var(--size-3xl);
}

h3 {
  font-size: var(--size-2xl);
}

h4 {
  font-size: var(--size-xl);
}

h5 {
  font-size: var(--size-lg);
}

h6 {
  font-size: var(--size-md);
}

/* Utility Font Classes */
.font-primary {
  font-family: var(--font-primary)    
  
}

.font-secondary {
  font-family: var(--font-secondary)  
}

.font-accent {
  font-family: var(--font-accent)   
}

.font-light {
  font-weight: var(--weight-light)  
}

.font-regular {
  font-weight: var(--weight-regular) 
}

.font-medium {
  font-weight: var(--weight-medium) 
}

.font-semibold {
  font-weight: var(--weight-semibold) 
}

.font-bold {
  font-weight: var(--weight-bold) 
}

/* Section Title Classes - Use these instead of legacy classes */
.section-heading {
  font-family: var(--font-secondary);
  font-weight: var(--weight-semibold);
  font-size: 30px;
  color: #353535;
  letter-spacing: 0.05px;
  text-shadow: none;
}

.service-section-subtitle.section-heading {
  font-family: var(--font-secondary) !important;
  font-size: 30px;
}

/* Gallery Section Headings */
.gallery-section-title {
  color: #f0b429;
  font-size: 1.75rem;
  font-family: var(--font-primary);
  font-weight: var(--weight-medium);
}

.gallery-section-heading {
  font-family: var(--font-secondary) !important;
  font-size: 2.5rem;
  font-weight: var(--weight-semibold);
}

/* Responsive Typography */
@media (max-width: 768px) {
  :root {
    --size-4xl: 2.25rem;  /* 36px */
    --size-3xl: 1.75rem;  /* 28px */
    --size-2xl: 1.5rem;   /* 24px */
  }
}

@media (max-width: 576px) {
  :root {
    --size-4xl: 2rem;     /* 32px */
    --size-3xl: 1.5rem;   /* 24px */
    --size-2xl: 1.25rem;  /* 20px */
  }
}