@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600&family=Lora:ital,wght@0,400;1,400&display=swap');

.syn-t-section {
  padding: 96px 72px;
  background: #0d1c30;
  font-family: 'Outfit', sans-serif;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}
.syn-t-section *, .syn-t-section *::before, .syn-t-section *::after { box-sizing: border-box; }

/* background decoration */
.syn-t-bg-arc {
  position: absolute;
  top: -180px; right: -180px;
  width: 520px; height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(46,140,168,0.13) 0%, transparent 70%);
  pointer-events: none;
}
.syn-t-bg-arc2 {
  position: absolute;
  bottom: -120px; left: -120px;
  width: 380px; height: 380px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(72,180,208,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.syn-t-inner { max-width: 900px; margin: 0 auto; position: relative; }

/* header */
.syn-t-header { text-align: center; margin-bottom: 56px; }
.syn-t-overtitle {
  font-size: 11px; letter-spacing: 4px; text-transform: uppercase;
  color: #48b4d0; font-weight: 600; margin-bottom: 14px;
}
.syn-t-title {
  font-family: 'Lora', Georgia, serif;
  font-size: clamp(28px, 3vw, 42px);
  font-weight: 400; color: #f0f6fa;
  line-height: 1.2; margin: 0;
}
.syn-t-title em { font-style: italic; color: #48b4d0; }

/* carousel wrapper */
.syn-t-track-wrap {
  position: relative;
  min-height: 280px;
}

/* single slide */
.syn-t-slide {
  display: none;
  flex-direction: column;
  align-items: center;
  text-align: center;
  animation: synFadeUp 0.55s ease both;
}
.syn-t-slide.syn-t-active { display: flex; }

@keyframes synFadeUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* quote mark */
.syn-t-quote-mark {
  font-family: 'Lora', Georgia, serif;
  font-size: 80px; line-height: 0.6;
  color: #2e8ca8; opacity: 0.5;
  margin-bottom: 24px; user-select: none;
}

/* quote text */
.syn-t-text {
  font-family: 'Lora', Georgia, serif;
  font-size: clamp(16px, 2vw, 20px);
  font-style: italic;
  color: #c8dce8;
  line-height: 1.8;
  max-width: 720px;
  margin: 0 auto 32px;
}

/* stars */
.syn-t-stars { color: #f5c842; font-size: 18px; letter-spacing: 3px; margin-bottom: 28px; }

/* author */
.syn-t-author { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.syn-t-author-name {
  font-size: 15px; font-weight: 600; color: #f0f6fa; letter-spacing: 0.5px;
}
.syn-t-author-role {
  font-size: 12px; color: #6da8c0; letter-spacing: 1px; text-transform: uppercase;
}
.syn-t-divider {
  width: 32px; height: 2px;
  background: linear-gradient(90deg, #2e8ca8, #48b4d0);
  border-radius: 2px; margin: 10px auto 0;
}

/* controls */
.syn-t-controls {
  display: flex; align-items: center; justify-content: center;
  gap: 20px; margin-top: 48px;
}
.syn-t-arrow {
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid rgba(46,140,168,0.35);
  background: rgba(46,140,168,0.08);
  color: #48b4d0; font-size: 18px; line-height: 1;
  cursor: pointer; transition: all 0.25s;
  display: flex; align-items: center; justify-content: center;
}
.syn-t-arrow:hover {
  background: rgba(46,140,168,0.22);
  border-color: #48b4d0;
  transform: scale(1.08);
}
.syn-t-dots { display: flex; gap: 8px; }
.syn-t-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: rgba(72,180,208,0.25);
  border: none; cursor: pointer; transition: all 0.3s; padding: 0;
}
.syn-t-dot.syn-t-dot-on {
  background: #48b4d0;
  transform: scale(1.3);
}

@media (max-width: 768px) {
  .syn-t-section { padding: 64px 24px; }
  .syn-t-quote-mark { font-size: 60px; }
}