:root{
  --brand-teal: var(--vtm-teal, #94e3db);
  --text: #0f172a;
  --muted: #64748b;
  --card: #ffffff;
  --border: #e5e7eb;
  --radius: 16px;
}

/* Banner */
.vtm-faq__banner{
  background: var(--brand-teal);
  text-align: center;
  padding: 32px 20px;
}
.vtm-faq__banner h1{
  margin: 0 0 6px;
  font-size: clamp(28px, 3.8vw, 42px);
  line-height: 1.1;
}
.vtm-faq__banner p{
  margin: 0; color: #0b3d3b; font-weight: 600;
}

/* Container */
.vtm-faq__container{
  max-width: 800px;
  margin: 28px auto 64px;
  padding: 0 20px;
}

/* Items */
.vtm-faq__list{ display: grid; gap: 14px; }

.vtm-faq__item{
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.vtm-faq__q{
  list-style: none;
  cursor: pointer;
  display: flex; align-items: center; justify-content: space-between;
  gap: 14px;
  padding: 16px 18px;
  font-weight: 700;
  color: var(--text);
}
.vtm-faq__q::-webkit-details-marker{ display: none; }

/* Tiny chevron with CSS */
.vtm-faq__q::after{
  content: '';
  width: 10px; height: 10px;
  border-right: 2px solid var(--muted);
  border-bottom: 2px solid var(--muted);
  transform: rotate(45deg);
  transition: transform .2s ease;
}
.vtm-faq__item[open] .vtm-faq__q::after{
  transform: rotate(-135deg);
  border-color: var(--text);
}

.vtm-faq__a{
  padding: 0 18px 16px;
  color: var(--text);
  line-height: 1.7;
}
.vtm-faq__a p{ margin: 0; }
.vtm-faq__a a{ color: inherit; text-decoration: underline; }
.vtm-faq__a a:hover{ opacity: .8; }

/* Responsive */
@media (max-width: 760px){
  .vtm-faq__container{ margin-bottom: 56px; }
  .vtm-faq__q{ padding: 15px 16px; }
  .vtm-faq__a{ padding: 0 16px 14px; }
}