/* ===== FAQ Section ===== */
.wd-faq-section {
  padding: var(--wd-section-padding);
  background-color: var(--wd-bg-light);
}

.wd-faq-section h2 {
  text-align: center;
  margin-bottom: 2.5rem;
}

.wd-faq-content {
  max-width: var(--wd-container-max);
  margin: 0 auto;
  padding: 0 1rem;
  display: flex;
  gap: 2rem;
  align-items: flex-start;
}

/* FAQ Accordion */
.wd-faq-list {
  flex: 1;
}

.wd-faq-item {
  border-bottom: 1px solid var(--wd-border-color);
}

.wd-faq-item:first-child {
  border-top: 1px solid var(--wd-border-color);
}

.wd-faq-question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 1.125rem 0;
  cursor: pointer;
  font-weight: 600;
  font-size: 1rem;
  color: var(--wd-heading-color);
  background: none;
  border: none;
  font-family: var(--wd-font-primary);
  text-align: left;
  gap: 1rem;
  transition: var(--wd-transition-fast);
}

.wd-faq-question:hover {
  color: var(--wd-primary);
}

.wd-faq-icon {
  font-size: 1.25rem;
  color: var(--wd-primary);
  transition: transform 0.3s ease;
  flex-shrink: 0;
  font-weight: 300;
  line-height: 1;
}

.wd-faq-item.active .wd-faq-icon {
  transform: rotate(45deg);
}

.wd-faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s ease, padding 0.35s ease;
  padding: 0;
}

.wd-faq-item.active .wd-faq-answer {
  max-height: 500px;
  padding-bottom: 1.125rem;
}

.wd-faq-answer p {
  color: var(--wd-body-color);
  line-height: 1.7;
  font-size: 0.9375rem;
  margin: 0;
}

/* View All FAQs button */
.wd-faq-view-all {
  margin-top: 1.5rem;
  text-align: center;
}

.wd-faq-view-all a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.5rem;
  border: 1px solid var(--wd-border-color);
  border-radius: var(--wd-btn-radius);
  color: var(--wd-body-color-dark);
  font-weight: 600;
  font-size: var(--wd-font-size-sm);
  text-decoration: none;
  transition: var(--wd-transition);
}

.wd-faq-view-all a:hover {
  border-color: var(--wd-primary);
  color: var(--wd-primary);
  text-decoration: none;
}

/* ===== Contact Widget (right side) ===== */
.wd-contact-widget {
  width: 350px;
  flex-shrink: 0;
  position: sticky;
  top: calc(var(--wd-header-height) + 1rem);
}

.wd-contact-widget-inner {
  background-color: var(--wd-bg-white);
  border-radius: var(--wd-card-radius);
  box-shadow: var(--wd-shadow-sm);
  padding: 2rem;
  text-align: center;
}

.wd-contact-widget h3 {
  font-size: 1.25rem;
  margin-bottom: 0.5rem;
  color: var(--wd-heading-color);
}

/* Team avatars */
.wd-contact-avatars {
  display: flex;
  justify-content: center;
  margin-bottom: 0.75rem;
}

.wd-contact-avatars img {
  width: 40px;
  height: 40px;
  border-radius: var(--wd-radius-circle);
  border: 2px solid var(--wd-bg-white);
  margin-left: -8px;
  object-fit: cover;
}

.wd-contact-avatars img:first-child {
  margin-left: 0;
}

/* Response time */
.wd-contact-response {
  font-size: var(--wd-font-size-xs);
  color: var(--wd-body-color);
  margin-bottom: 0.5rem;
}

.wd-contact-response-time {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  font-size: var(--wd-font-size-xs);
  color: var(--wd-body-color);
  margin-bottom: 1.25rem;
}

.wd-contact-response-time svg {
  width: 14px;
  height: 14px;
}

/* Contact description */
.wd-contact-description {
  font-size: var(--wd-font-size-sm);
  color: var(--wd-body-color);
  margin-bottom: 1.25rem;
}

.wd-contact-separator {
  font-size: var(--wd-font-size-sm);
  color: var(--wd-body-color-dark);
  margin: 1rem 0;
  font-weight: 400;
}

/* Contact buttons */
.wd-contact-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.75rem;
  border-radius: var(--wd-btn-radius);
  color: var(--wd-text-white);
  font-weight: 600;
  text-align: center;
  margin-bottom: 0.5rem;
  border: none;
  cursor: pointer;
  font-size: 0.9375rem;
  font-family: var(--wd-font-primary);
  text-decoration: none;
  transition: var(--wd-transition);
}

.wd-contact-btn:hover {
  opacity: 0.9;
  color: var(--wd-text-white);
  text-decoration: none;
}

.wd-contact-btn svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
}

.wd-contact-btn-faq { background-color: var(--wd-primary); }
.wd-contact-btn-phone { background-color: var(--wd-accent); }
.wd-contact-btn-line { background-color: var(--wd-line-color); }
.wd-contact-btn-messenger { background-color: var(--wd-messenger-color); }
.wd-contact-btn-whatsapp { background-color: var(--wd-whatsapp-color); }
.wd-contact-btn-telegram { background-color: var(--wd-telegram-color); }
.wd-contact-btn-email { background-color: var(--wd-email-color); }