/* Support — two-column FAQ + contact card. */

.support-page { padding-block: clamp(130px, 14vw, 170px) clamp(56px, 8vw, 110px); }
.support-page__head {
  text-align: center;
  max-width: 60ch;
  margin-inline: auto;
  margin-block-end: clamp(48px, 6vw, 80px);
}
.support-page__head p { color: var(--text-2); margin-block-start: var(--sp-3); }

.support-grid {
  display: grid;
  grid-template-columns: 1.4fr 0.6fr;
  gap: clamp(32px, 5vw, 56px);
  align-items: start;
}
.support-section h2 { font-size: 1.1rem; color: var(--text-1); margin-block-end: var(--sp-4); }

.faq-list { display: flex; flex-direction: column; gap: 12px; }
.faq-item {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: border-color var(--t-base) var(--ease-out);
}
.faq-item[open] { border-color: rgba(19, 181, 243, 0.3); }
.faq-q {
  list-style: none;
  cursor: pointer;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-3);
  font-size: 1rem;
  font-weight: 700;
  color: var(--text-1);
}
.faq-q::-webkit-details-marker { display: none; }
.faq-chevron {
  color: var(--text-3);
  transition: transform var(--t-base) var(--ease-out),
              color var(--t-base) var(--ease-out);
  flex-shrink: 0;
}
.faq-item[open] .faq-chevron { transform: rotate(180deg); color: var(--brand); }
.faq-a { padding: 0 20px 18px; color: var(--text-2); font-size: 0.93rem; line-height: 1.7; }

.support-aside { display: flex; flex-direction: column; gap: 14px; }
.support-card {
  padding: var(--sp-5);
  border-radius: var(--r-lg);
  background: var(--surface);
  border: 1px solid var(--line);
}
.support-card__title {
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--text-4);
  font-weight: 700;
  margin-block-end: var(--sp-3);
}
[lang="ar"] .support-card__title { text-transform: none; letter-spacing: 0.02em; }
.support-card__row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-block-start: 1px solid var(--line);
  font-size: 0.95rem;
}
.support-card__row:first-of-type { border-block-start: 0; }
.support-card__row a { color: var(--brand); direction: ltr; unicode-bidi: isolate; }
.support-card__hours { color: var(--text-2); font-size: 0.92rem; line-height: 1.55; }
