/* Instrutor */
.instructor {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: clamp(2rem, 5vw, 4rem);
  align-items: center;
}

.instructor__photo {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--r-feature);
  background: linear-gradient(160deg, var(--aco), var(--ferro) 60%, var(--noite));
  box-shadow: var(--depth-card);
  font-size: clamp(4rem, 9vw, 7rem);
  font-weight: 850;
  font-stretch: 125%;
  letter-spacing: 0;
  color: var(--aco-claro);
}

.instructor__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 70% 30%;
}

/* A foto é de dia e a página é preta: a base escurece para assentar no fundo */
.instructor__photo:has(img)::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 55%, var(--foto-base));
  box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08);
  border-radius: inherit;
  pointer-events: none;
}

.instructor__text {
  display: grid;
  gap: 1rem;
  max-width: 38rem;
}

.instructor__text h2 {
  font-size: var(--text-xl);
  color: var(--nevoa);
  font-weight: 600;
  font-stretch: 110%;
}

.instructor__name {
  font-size: var(--text-2xl);
  font-weight: 850;
  font-stretch: 122%;
  letter-spacing: -0.04em;
  line-height: 1;
}

.instructor__text p:not(.instructor__name) {
  color: var(--nevoa);
}

/* Perguntas */
.faq {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
  gap: 2rem clamp(2rem, 5vw, 4rem);
}

.faq__list {
  border-top: 1px solid var(--aco);
}

.faq__item {
  border-bottom: 1px solid var(--aco);
}

.faq__item summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.35rem 0;
  font-size: var(--text-lg);
  font-weight: 600;
  font-stretch: 108%;
  cursor: pointer;
  list-style: none;
}

.faq__item summary::-webkit-details-marker {
  display: none;
}

.faq__item summary::after {
  content: '';
  flex: none;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background: var(--aco) center / 0.75rem no-repeat
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' stroke='%23ececee' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 3v10M3 8h10'/%3E%3C/svg%3E");
  transition: transform 220ms var(--ease-out);
}

.faq__item[open] summary::after {
  transform: rotate(45deg);
}

.faq__item p {
  max-width: 40rem;
  padding-bottom: 1.5rem;
  color: var(--nevoa);
}

/* CTA final */
.final {
  display: grid;
  justify-items: center;
  gap: 1.25rem;
  text-align: center;
}

.final h2 {
  font-size: var(--text-hero);
  font-stretch: 125%;
  letter-spacing: -0.055em;
  line-height: 0.95;
  max-width: 14ch;
}

.final p {
  max-width: 32rem;
  color: var(--nevoa);
  font-size: var(--text-lg);
}

.final .btn {
  margin-top: 1rem;
}

@media (max-width: 960px) {
  .instructor,
  .faq {
    grid-template-columns: minmax(0, 1fr);
  }

  .instructor__photo {
    max-width: 18rem;
  }
}