* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.faq-page-container {
  max-width: 850px !important;
  margin: 2rem auto !important;
  padding: 0 1rem !important;
}

.faq-page-header {
  background-color: #27548A;
  background: linear-gradient(135deg, #27548A 10%, #4A7BA7 100%);
  color: white !important;
  text-align: center !important;
  padding: 1.5rem 1rem !important;
}

.faq-page-header h1 {
  font-family: var(--font-display) !important;
  font-size: var(--font-size-h1) !important;
  font-weight: var(--font-weight-extrabold) !important;
  margin-bottom: 0.75rem !important;
  color: white !important;
}

.faq-page-header p {
  font-family: var(--font-primary) !important;
  font-size: var(--font-size-large) !important;
  line-height: 1.4 !important;
  color: white !important;
  margin: 0 !important;
}

.faq-section-wrapper {
  background-color: #f9fafc !important;
  padding: 3rem 0 !important;
}

.faq-category-header {
  font-family: var(--font-display) !important;
  font-weight: var(--font-weight-bold) !important;
  font-size: var(--font-size-h4) !important;
  color: #EFBF04 !important;
  margin-bottom: 1.5rem !important;
  padding-top: 3rem !important;
  padding-left: 0.5rem !important;
  letter-spacing: 0.05em !important;
}

.faq-category-header:first-child {
  padding-top: 0 !important;
}

.faq-category-header h2 {
  font-family: var(--font-display) !important;
  font-weight: var(--font-weight-bold) !important;
  font-size: var(--font-size-h4) !important;
  color: #EFBF04 !important;
  margin: 0 !important;
}

.faq-item-card {
  margin-bottom: 1rem !important;
  background: white !important;
  border-radius: 12px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
  overflow: hidden !important;
}

.faq-question-btn {
  width: 100% !important;
  background: white !important;
  border: none !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 1rem 1.5rem !important;
  font-family: var(--font-primary) !important;
  font-size: var(--font-size-h5) !important;
  font-weight: var(--font-weight-medium) !important;
  text-align: left !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  transition: background-color 0.2s ease !important;
  color: #333 !important;
  outline: none !important;
}

.faq-question-btn:hover {
  background-color: #f5f5f5 !important;
}

.faq-question-btn:focus {
  outline: 2px solid #27548A !important;
  outline-offset: 2px !important;
}

.faq-toggle-icon {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  user-select: none !important;
  color: #27548A !important;
  transition: transform 0.2s ease !important;
}

.faq-answer-content {
  max-height: 0 !important;
  overflow: hidden !important;
  background: white !important;
  border-radius: 0 0 12px 12px !important;
  padding: 0 1.5rem !important;
  font-family: var(--font-primary) !important;
  font-size: var(--font-size-base) !important;
  line-height: var(--line-height-relaxed) !important;
  color: #333 !important;
  transition: max-height 0.3s ease, padding 0.3s ease !important;
}

.faq-answer-content.faq-answer-active {
  max-height: 200px !important;
  padding: 1rem 1.5rem !important;
}

.faq-answer-content p {
  margin: 0 !important;
  color: #333 !important;
  font-size: var(--font-size-base) !important;
  line-height: 1.5 !important;
}

.faq-w-full {
  width: 100% !important;
}

.faq-text-left {
  text-align: left !important;
}

.faq-flex {
  display: flex !important;
}

.faq-flex--between {
  justify-content: space-between !important;
}

body {
  margin: 0 !important;
  padding: 0 !important;
}

html, body {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 100vh !important;
}

.footer {
  margin-bottom: 0 !important;
}

.cta-section {
  margin-bottom: 0 !important;
}

@media (max-width: 768px) {
  .faq-page-header h1 {
    font-size: 2.5rem !important;
  }
  
  .faq-page-header p {
    font-size: 1.2rem !important;
  }
  
  .faq-page-container {
    padding: 0 0.5rem !important;
  }
  
  .faq-question-btn {
    font-size: 1.1rem !important;
    padding: 0.8rem 1rem !important;
  }
  
  .faq-answer-content {
    padding: 0 1rem !important;
  }
  
  .faq-answer-content.faq-answer-active {
    padding: 0.8rem 1rem !important;
  }
}

@media (max-width: 480px) {
  .faq-page-header {
    padding: 2rem 1rem !important;
  }
  
  .faq-page-header h1 {
    font-size: var(--font-size-h2) !important;
  }
  
  .faq-page-header p {
    font-size: var(--font-size-base) !important;
  }
  
  .faq-category-header {
    font-size: 1.3rem !important;
    padding-top: 2rem !important;
  }
}