/* =============================================
   HERYERPARKOUR — CTA Section
   "İLK DERS BİZDEN." + ghost text + 2 buton
   ============================================= */

.cta-section {
  background: var(--bg-dark);
  padding: 120px 0 40px;
  position: relative;
  overflow: hidden;
  text-align: center;
}

/* Ghost watermark */
.cta-section::before {
  content: 'ENGEL AŞMAK';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-5deg);
  font-family: var(--ff-display);
  font-size: clamp(60px, 12vw, 180px);
  -webkit-text-stroke: 1px rgba(255, 255, 255, 0.04);
  -webkit-text-fill-color: transparent;
  white-space: nowrap;
  pointer-events: none;
  z-index: 0;
}
html[lang="en"] .cta-section::before {
  content: 'BREAK BARRIERS';
}

.cta-content { position: relative; z-index: 1; }

.cta-title {
  justify-content: center;
}

.cta-title .letter {
  color: white !important;
  -webkit-text-fill-color: white !important;
  transition: color 0.2s, -webkit-text-fill-color 0.2s;
}

.cta-title .letter:hover {
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
}

.cta-title .letter.accent-letter {
  color: var(--accent) !important;
  -webkit-text-fill-color: var(--accent) !important;
  transition: color 0.2s, -webkit-text-fill-color 0.2s;
}

.cta-title .letter.accent-letter:hover {
  color: white !important;
  -webkit-text-fill-color: white !important;
}

.cta-desc {
  color: var(--text-on-dark-muted);
  font-size: var(--font-body-lg);
  font-weight: 500;
  max-width: 480px;
  margin: 16px auto 36px;
}

.cta-btns {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

/* Address sticker — left side of CTA */
.cta-sticker {
  position: absolute;
  top: 68%;
  left: 40px;
  transform: translateY(-50%);
  z-index: 2;
  text-align: left;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px) {
  .cta-sticker { display: none; }
  .cta-section { padding: 80px 0 32px; }
}

@media (max-width: 768px) {
  .cta-section { padding: 64px 0 24px; }
  .cta-btns { flex-direction: column; align-items: center; }
}
