/* Uzair Digital shared FAQ styling */
#relevant-faq,
section#faq,
.faq-section {
  background: #FFFFFF !important;
  font-family: "Manrope", "Inter", sans-serif !important;
  padding: clamp(64px, 8vw, 96px) 0 !important;
}

#relevant-faq > div,
section#faq > div,
.faq-section > div {
  max-width: 860px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

#relevant-faq .text-center,
section#faq .text-center,
section#faq .section-title,
.faq-section .section-title,
.faq-section .section-head {
  max-width: 640px !important;
  margin: 0 auto 46px !important;
  text-align: center !important;
}

#relevant-faq .chip,
section#faq .chip,
section#faq .eyebrow,
section#faq .section-label,
.faq-section .chip,
.faq-section .eyebrow,
.faq-section .section-label,
#relevant-faq .booking-eyebrow,
section#faq .booking-eyebrow,
.faq-section .booking-eyebrow,
#relevant-faq .contact-kicker,
section#faq .contact-kicker,
.faq-section .contact-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: auto !important;
  margin: 0 0 18px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #FFB400 !important;
  font-family: "Manrope", "Inter", sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

#relevant-faq .chip::before,
section#faq .chip::before,
section#faq .eyebrow::before,
section#faq .section-label::before,
.faq-section .chip::before,
.faq-section .eyebrow::before,
.faq-section .section-label::before,
#relevant-faq .booking-eyebrow::before,
section#faq .booking-eyebrow::before,
.faq-section .booking-eyebrow::before,
#relevant-faq .contact-kicker::before,
section#faq .contact-kicker::before,
.faq-section .contact-kicker::before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 1px;
  border-radius: 999px;
  background: #FFB400;
  box-shadow: none !important;
}

#relevant-faq .chip .dot,
section#faq .eyebrow .dot,
.faq-section .eyebrow .dot {
  display: none !important;
}

#relevant-faq h2,
section#faq h2,
.faq-section h2 {
  margin: 0 !important;
  color: #111111 !important;
  font-family: "Manrope", "Inter", sans-serif !important;
  font-size: clamp(42px, 5.5vw, 62px) !important;
  font-weight: 900 !important;
  line-height: 0.96 !important;
  letter-spacing: -0.035em !important;
}

#relevant-faq h2 span,
section#faq h2 span,
.faq-section h2 span,
#relevant-faq .text-primary,
section#faq .text-primary,
.faq-section .text-primary {
  color: #FFB400 !important;
  display: block !important;
}

#relevant-faq .text-center > p,
#relevant-faq .faq-intro,
section#faq .text-center > p,
section#faq .section-title > p,
.faq-section .section-title > p,
.faq-section .section-head > p {
  display: none !important;
}

#relevant-faq .grid,
#relevant-faq .space-y-4,
section#faq .grid,
section#faq .faq,
.faq-section .grid,
.faq-section .faq {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
}

#relevant-faq .faq-item,
#relevant-faq details,
section#faq .faq-item,
section#faq details,
.faq-section .faq-item,
.faq-section details,
#relevant-faq .faq-card,
section#faq .faq-card,
.faq-section .faq-card {
  width: 100% !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 1px solid #E7E7E7 !important;
  border-radius: 16px !important;
  background: #FFFFFF !important;
  box-shadow: 0 14px 34px rgba(17, 17, 17, 0.045) !important;
  transform: none !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease !important;
}

#relevant-faq details[open],
section#faq details[open],
.faq-section details[open],
#relevant-faq .faq-card[open],
section#faq .faq-card[open],
.faq-section .faq-card[open],
section#faq .faq-item.active,
.faq-section .faq-item.open {
  border-color: rgba(255, 180, 0, 0.32) !important;
  background: #FFFFFF !important;
  box-shadow: 0 18px 42px rgba(17, 17, 17, 0.06) !important;
}

#relevant-faq .faq-item:hover,
#relevant-faq details:hover,
section#faq .faq-item:hover,
section#faq details:hover,
.faq-section .faq-item:hover,
.faq-section details:hover,
#relevant-faq .faq-card:hover,
section#faq .faq-card:hover,
.faq-section .faq-card:hover {
  border-color: rgba(255, 180, 0, 0.55) !important;
  box-shadow: 0 18px 42px rgba(17, 17, 17, 0.065) !important;
}

#relevant-faq summary,
section#faq summary,
.faq-section summary,
#relevant-faq .faq-card summary,
section#faq .faq-card summary,
.faq-section .faq-card summary,
#relevant-faq .faq-question,
section#faq .faq-question,
.faq-section .faq-question,
#relevant-faq .faq-q,
section#faq .faq-q,
.faq-section .faq-q {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 0 22px !important;
  border: 0 !important;
  background: transparent !important;
  color: #111111 !important;
  cursor: pointer !important;
  font-family: "Manrope", "Inter", sans-serif !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
  list-style: none !important;
  text-align: left !important;
}

#relevant-faq summary::-webkit-details-marker,
section#faq summary::-webkit-details-marker,
.faq-section summary::-webkit-details-marker,
.faq-card summary::-webkit-details-marker {
  display: none !important;
}

#relevant-faq details > p,
section#faq details > p,
.faq-section details > p,
#relevant-faq .faq-card > p,
section#faq .faq-card > p,
.faq-section .faq-card > p,
#relevant-faq .faq-answer,
section#faq .faq-answer,
.faq-section .faq-answer,
#relevant-faq .faq-a,
section#faq .faq-a,
.faq-section .faq-a {
  margin: 0 !important;
  padding: 0 22px 24px !important;
  color: #555555 !important;
  font-family: "Manrope", "Inter", sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.7 !important;
}

#relevant-faq summary i,
section#faq summary i,
.faq-section summary i,
#relevant-faq .faq-icon,
section#faq .faq-icon,
.faq-section .faq-icon,
#relevant-faq .faq-q span,
section#faq .faq-q span,
.faq-section .faq-q span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 28px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #FFB400 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  transform: none !important;
  transition: background 0.2s ease, transform 0.2s ease !important;
}

#relevant-faq summary i::before,
section#faq summary i::before,
.faq-section summary i::before,
#relevant-faq .faq-icon i::before,
section#faq .faq-icon i::before,
.faq-section .faq-icon i::before,
#relevant-faq .faq-q span::before,
section#faq .faq-q span::before,
.faq-section .faq-q span::before {
  content: "" !important;
  display: block !important;
  width: 8px !important;
  height: 8px !important;
  border-right: 2px solid currentColor !important;
  border-bottom: 2px solid currentColor !important;
  transform: translateY(-2px) rotate(45deg) !important;
}

#relevant-faq details[open] summary i::before,
section#faq details[open] summary i::before,
.faq-section details[open] summary i::before,
section#faq .faq-item.active .faq-icon i::before,
.faq-section .faq-item.open .faq-q span::before {
  transform: translateY(2px) rotate(225deg) !important;
}

#relevant-faq .faq-q span,
section#faq .faq-q span,
.faq-section .faq-q span,
#relevant-faq .faq-icon i,
section#faq .faq-icon i,
.faq-section .faq-icon i {
  font-size: 0 !important;
}

#relevant-faq details[open] summary i,
section#faq details[open] summary i,
.faq-section details[open] summary i,
#relevant-faq .faq-card[open] summary i,
section#faq .faq-card[open] summary i,
.faq-section .faq-card[open] summary i,
section#faq .faq-item.active .faq-icon,
.faq-section .faq-item.open .faq-q span {
  background: transparent !important;
  color: #FFB400 !important;
}

@media (max-width: 640px) {
  #relevant-faq,
  section#faq,
  .faq-section {
    padding: 56px 0 !important;
  }

  #relevant-faq > div,
  section#faq > div,
  .faq-section > div {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  #relevant-faq h2,
  section#faq h2,
  .faq-section h2 {
    font-size: 38px !important;
    line-height: 1 !important;
  }

  #relevant-faq summary,
  section#faq summary,
  .faq-section summary,
  #relevant-faq .faq-card summary,
  section#faq .faq-card summary,
  .faq-section .faq-card summary,
  #relevant-faq .faq-question,
  section#faq .faq-question,
  .faq-section .faq-question,
  #relevant-faq .faq-q,
  section#faq .faq-q,
  .faq-section .faq-q {
    min-height: 66px !important;
    padding: 0 16px !important;
    font-size: 14.5px !important;
  }

  #relevant-faq details > p,
  section#faq details > p,
  .faq-section details > p,
  #relevant-faq .faq-card > p,
  section#faq .faq-card > p,
  .faq-section .faq-card > p,
  #relevant-faq .faq-answer,
  section#faq .faq-answer,
  .faq-section .faq-answer,
  #relevant-faq .faq-a,
  section#faq .faq-a,
  .faq-section .faq-a {
    padding: 0 16px 18px !important;
    font-size: 14px !important;
  }
}