/* =========================================================
   GPC — COMPETITION FAQ TAB
   Let Blocksy/WooCommerce control the tab content width
   ========================================================= */

.gpc-competition-faq {
  box-sizing: border-box;
}


/* =========================================================
   INTRO
   ========================================================= */

.gpc-faq-intro {
  margin-bottom: 22px;
}

.gpc-faq-intro h2 {
  margin: 0 0 8px;

  color: #fff;
  font-size: 24px;
  font-weight: 800;
  line-height: 1.2;
}

.gpc-faq-intro p {
  margin: 0;

  max-width: 760px;

  color: rgba(255, 255, 255, .68);
  font-size: 14px;
  line-height: 1.6;
}


/* =========================================================
   FAQ LIST
   Uses the full width provided by Blocksy's constrained tab
   ========================================================= */

.gpc-faq-list {
  display: grid;
  gap: 10px;

  width: 100%;
  max-width: none;
}


/* =========================================================
   INDIVIDUAL ACCORDION
   ========================================================= */

.gpc-faq-item {
  width: 100%;
  margin: 0;

  background: rgba(18, 18, 18, .72);

  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 12px;

  overflow: hidden;

  transition:
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease;
}

.gpc-faq-item:hover {
  border-color: rgba(255, 176, 0, .28);
}

.gpc-faq-item[open] {
  border-color: rgba(255, 176, 0, .38);

  box-shadow:
    0 8px 28px rgba(0, 0, 0, .18);
}


/* =========================================================
   QUESTION ROW
   ========================================================= */

.gpc-faq-item summary {
  display: flex;

  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding: 17px 18px;

  cursor: pointer;

  list-style: none;

  color: #fff;

  font-size: 15px;
  font-weight: 800;
  line-height: 1.35;

  user-select: none;
}

.gpc-faq-item summary::-webkit-details-marker {
  display: none;
}

.gpc-faq-question {
  flex: 1;
  min-width: 0;
}


/* =========================================================
   PLUS ICON
   ========================================================= */

.gpc-faq-plus {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  flex: 0 0 28px;

  width: 28px;
  height: 28px;

  border-radius: 999px;

  border: 1px solid rgba(255, 176, 0, .35);

  color: #FFB000;

  font-size: 19px;
  font-weight: 500;
  line-height: 1;

  transition:
    transform .18s ease,
    background .18s ease;
}

.gpc-faq-item[open] .gpc-faq-plus {
  transform: rotate(45deg);

  background: rgba(255, 176, 0, .08);
}


/* =========================================================
   ANSWER
   ========================================================= */

.gpc-faq-answer {
  padding:
    0 18px
    18px;
}

.gpc-faq-answer p {
  margin: 0;

  max-width: 780px;

  color: rgba(255, 255, 255, .72);

  font-size: 14px;
  line-height: 1.65;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

  .gpc-faq-intro {
    margin-bottom: 18px;
  }

  .gpc-faq-intro h2 {
    font-size: 21px;
  }

  .gpc-faq-intro p {
    font-size: 13px;
  }

  .gpc-faq-item summary {
    padding: 15px;

    gap: 14px;

    font-size: 14px;
  }

  .gpc-faq-answer {
    padding:
      0 15px
      15px;
  }

  .gpc-faq-answer p {
    font-size: 13px;
  }
}