/* Responsive Font Fixes for 11ty Website */

/* ===================================
   RESPONSIVE FONT SIZING
   =================================== */

/* Base font sizes with fluid scaling */
html {
  font-size: 16px;
}

/* Responsive heading sizes using clamp() for fluid typography */
h1, .sqsrte-large h1 {
  font-size: clamp(2rem, 5vw + 1rem, 4.5rem);
  line-height: 1.2;
}

h2, .sqsrte-large h2 {
  font-size: clamp(1.75rem, 4vw + 0.5rem, 3.5rem);
  line-height: 1.3;
}

h3 {
  font-size: clamp(1.25rem, 2.5vw + 0.5rem, 2rem);
  line-height: 1.4;
}

h4 {
  font-size: clamp(1.125rem, 2vw + 0.25rem, 1.5rem);
  line-height: 1.4;
}

/* Scaled text containers (like the homepage text) */
.sqsrte-scaled-text-container {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sqsrte-scaled-text {
  font-size: clamp(1.5rem, 8vw, 6rem);
  line-height: 1.1;
  white-space: normal;
  word-wrap: break-word;
}

/* Responsive body text */
body {
  font-size: clamp(14px, 1.5vw, 18px);
  line-height: 1.6;
}

p {
  font-size: clamp(14px, 1.2vw, 18px);
}

/* Small text responsive sizing */
.sqsrte-small,
small {
  font-size: clamp(11px, 1vw, 14px);
}

/* Mobile-specific font adjustments */
@media (max-width: 767px) {
  /* Ensure minimum readable sizes on mobile */
  body {
    font-size: 16px; /* Prevent mobile zoom on form inputs */
  }

  h1, .sqsrte-large h1 {
    font-size: clamp(2rem, 10vw, 3rem);
  }

  h2, .sqsrte-large h2 {
    font-size: clamp(1.5rem, 8vw, 2.5rem);
  }

  h3 {
    font-size: clamp(1.25rem, 6vw, 2rem);
  }

  /* Navigation text */
  .header-nav-item,
  .header-menu-nav-item {
    font-size: clamp(16px, 4vw, 20px);
  }

  /* Scale homepage hero text appropriately */
  .sqsrte-scaled-text {
    font-size: clamp(2rem, 12vw, 4rem);
  }
}

/* Tablet-specific adjustments */
@media (min-width: 768px) and (max-width: 1024px) {
  h1, .sqsrte-large h1 {
    font-size: clamp(2.5rem, 6vw, 4rem);
  }

  h2, .sqsrte-large h2 {
    font-size: clamp(2rem, 5vw, 3rem);
  }

  .sqsrte-scaled-text {
    font-size: clamp(2.5rem, 8vw, 5rem);
  }
}

/* Large desktop */
@media (min-width: 1920px) {
  /* Cap maximum sizes for very large screens */
  h1, .sqsrte-large h1 {
    font-size: 4.5rem;
  }

  h2, .sqsrte-large h2 {
    font-size: 3.5rem;
  }

  body {
    font-size: 18px;
  }
}

/* Ensure text remains readable at all screen sizes */
@media (max-width: 480px) {
  /* Extra small devices */
  h1, .sqsrte-large h1 {
    font-size: 2rem;
    margin-bottom: 1rem;
  }

  h2, .sqsrte-large h2 {
    font-size: 1.5rem;
    margin-bottom: 0.875rem;
  }

  h3 {
    font-size: 1.25rem;
    margin-bottom: 0.75rem;
  }
}

/* Fix for HTML blocks with scaled text */
.sqs-block-html .sqsrte-scaled-text-container {
  padding: 1rem 0;
}

/* Accessibility: ensure text can be resized */
* {
  max-width: 100%;
}

img {
  height: auto;
}

/* ===================================
   HEADER OVERLAP FIX
   =================================== */

/* Add padding to first page section on mobile to prevent header overlap */
@media (max-width: 767px) {
  .page-section:first-of-type {
    padding-top: 152px !important;
  }
}