/**
 * Quantize Solutions - Global Stylesheet
 * Standardized typography, background grid, layout rules & mobile responsiveness
 */

/* Cross-Browser Normalization */
*, *::before, *::after {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html, body {
  width: 100%;
  overflow-x: hidden;
  font-family: 'Hanken Grotesk', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Precision Engineered Canvas Grid Background */
body {
  background-color: #f9f9f9 !important;
  background-image: 
    linear-gradient(to right, rgba(0, 38, 27, 0.04) 1px, transparent 1px), 
    linear-gradient(to bottom, rgba(0, 38, 27, 0.04) 1px, transparent 1px) !important;
  background-size: 40px 40px !important;
  background-attachment: fixed !important;
  background-position: 0 0 !important;
  color: #1a1c1c;
  margin: 0;
  padding: 0;
}

/* Header & Structural Overrides */
header, #mobile-menu, #hero-section, main {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

header {
  background-color: rgba(249, 249, 249, 0.92) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

main, section, article, footer {
  background: transparent !important;
  background-color: transparent !important;
}

/* Standardized Heading Scale */
h1, .font-display-lg {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.08 !important;
}

h2, .font-headline-lg {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.15 !important;
}

h3 {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.25 !important;
}

/* Tab Button Active State */
.tab-btn.active {
  border-bottom: 2px solid #00261b !important;
  color: #00261b !important;
  font-weight: 700 !important;
}

/* Sitemap Hierarchy Connectors */
.sitemap-node {
  border-left: 2px solid rgba(0, 38, 27, 0.15);
  padding-left: 20px;
  position: relative;
  transition: all 0.2s ease;
}

.sitemap-node:hover {
  border-left-color: #10b981;
}

.sitemap-node::before {
  content: '';
  position: absolute;
  top: 14px;
  left: 0;
  width: 14px;
  height: 2px;
  background-color: rgba(0, 38, 27, 0.15);
  transition: all 0.2s ease;
}

.sitemap-node:hover::before {
  background-color: #10b981;
  width: 18px;
}

/* Mobile Media Query Rules (< 768px) */
@media (max-width: 767px) {
  .px-margin-desktop {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  .py-section-gap {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .font-display-lg, h1 {
    font-size: 34px !important;
    line-height: 1.15 !important;
  }
  .font-headline-lg, h2 {
    font-size: 28px !important;
    line-height: 1.2 !important;
  }
  button, a {
    min-height: 44px;
  }
}