.qa-about-section {
  --qa-gold: #C89B3C;
  --qa-gold-dark: #A67C22;
  --qa-teal: #15584A;
  --qa-teal-soft: #e8f0ee;
  --qa-body: #5a6663;
  --qa-white: #ffffff;

  box-sizing: border-box !important;
  width: 100% !important;
  background: transparent !important;
  padding: 70px 24px !important;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  overflow: hidden !important;
}

.qa-about-section * {
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 !important;
}

.qa-about-wrap {
  max-width: 1180px !important;
  margin: 0 auto !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 60px !important;
  align-items: center !important;
}

/* ---------- Image stack ---------- */
.qa-about-media {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  max-width: 520px !important;
}

.qa-about-img-back,
.qa-about-img-front {
  position: absolute !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  box-shadow: 0 20px 45px rgba(21, 88, 74, 0.18) !important;
  opacity: 0 !important;
  will-change: transform, opacity !important;
}

.qa-about-img-back {
  top: 0 !important;
  left: 0 !important;
  width: 74% !important;
  height: 78% !important;
  transform: translateY(24px) !important;
  transition: opacity 0.8s ease, transform 0.8s ease !important;
}

.qa-about-img-front {
  right: 0 !important;
  bottom: 0 !important;
  width: 62% !important;
  height: 62% !important;
  border: 6px solid var(--qa-white) !important;
  transform: translateY(40px) !important;
  transition: opacity 0.8s ease 0.18s, transform 0.8s ease 0.18s !important;
}

.qa-about-img-back svg,
.qa-about-img-front svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

.qa-about-media.qa-in-view .qa-about-img-back,
.qa-about-media.qa-in-view .qa-about-img-front {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.qa-about-media.qa-in-view .qa-about-img-back {
  animation: qaFloat 6s ease-in-out 0.8s infinite !important;
}

.qa-about-media.qa-in-view .qa-about-img-front {
  animation: qaFloat 5s ease-in-out 0.6s infinite !important;
}

@keyframes qaFloat {

  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

/* gold accent ring behind stack */
.qa-about-media::before {
  content: "" !important;
  position: absolute !important;
  top: -18px !important;
  left: -18px !important;
  width: 90px !important;
  height: 90px !important;
  border: 2px solid var(--qa-gold) !important;
  border-radius: 50% !important;
  opacity: 0 !important;
  transform: scale(0.6) !important;
  transition: opacity 0.7s ease 0.5s, transform 0.7s ease 0.5s !important;
}

.qa-about-media.qa-in-view::before {
  opacity: 0.55 !important;
  transform: scale(1) !important;
}

/* ---------- Text side ---------- */
.qa-about-text {
  opacity: 0 !important;
  transform: translateY(18px) !important;
  transition: opacity 0.7s ease, transform 0.7s ease !important;
}

.qa-about-text.qa-in-view {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

.qa-about-eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: 'Sora', 'Inter', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--qa-gold-dark) !important;
  margin-bottom: 18px !important;
}

.qa-about-eyebrow::before {
  content: "" !important;
  width: 26px !important;
  height: 2px !important;
  background: var(--qa-gold) !important;
}

.qa-about-title {
  font-family: 'Sora', 'Inter', sans-serif !important;
  font-weight: 700 !important;
  font-size: clamp(30px, 3.4vw, 44px) !important;
  line-height: 1.2 !important;
  color: #020101 !important;
  margin-bottom: 22px !important;
}

.qa-about-para {
  font-size: 15.5px !important;
  line-height: 1.8 !important;
  color: #2D3748 !important;
  max-width: 58ch !important;
  margin-bottom: 18px !important;
}

.qa-about-para:last-child {
  margin-bottom: 0 !important;
}

.qa-about-para strong {
  color: var(--qa-teal) !important;
  font-weight: 700 !important;
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .qa-about-wrap {
    grid-template-columns: 1fr !important;
    gap: 48px !important;
  }

  .qa-about-media {
    max-width: 420px !important;
    margin: 0 auto !important;
  }
}

@media (max-width: 480px) {
  .qa-about-section {
    padding: 48px 16px !important;
  }

  .qa-about-title {
    font-size: 26px !important;
  }

  .qa-about-para {
    font-size: 14.5px !important;
  }

  .qa-about-media {
    max-width: 320px !important;
  }
}