/* ===== CTA — hiệu ứng nâng cấp (aurora, nút bóng chạy, hiện dần khi cuộn) ===== */
.tg-cta__box {
  background:
    radial-gradient(60% 90% at 15% 85%, rgba(90,170,42,.42), transparent 62%),
    radial-gradient(50% 80% at 88% 10%, rgba(226,196,122,.22), transparent 60%),
    linear-gradient(145deg, #1a7060, #0d4a3b 70%);
  background-size: 140% 140%, 130% 130%, 100% 100%;
  background-position: 0% 100%, 100% 0%, 0 0;
  animation: tgCtaAurora 16s ease-in-out infinite alternate;
  box-shadow: 0 24px 60px rgba(13,74,59,.28), inset 0 1px 0 rgba(255,255,255,.12);
  border-radius: 24px;
  isolation: isolate;
}
@keyframes tgCtaAurora {
  from { background-position: 0% 100%, 100% 0%, 0 0; }
  to   { background-position: 60% 40%, 40% 70%, 0 0; }
}
.tg-cta__box::after {
  display: block; content: '';
  position: absolute; right: -90px; top: -90px; width: 320px; height: 320px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, rgba(255,255,255,.22), rgba(255,255,255,0) 65%);
  filter: blur(4px); opacity: .6; pointer-events: none; z-index: 0;
  animation: tgCtaFloat 9s ease-in-out infinite alternate;
}
@keyframes tgCtaFloat { from { transform: translate(0, 0) scale(1); } to { transform: translate(-26px, 22px) scale(1.12); } }
.tg-cta__content, .tg-cta__action { position: relative; z-index: 1; }

.tg-cta__title em {
  background: linear-gradient(90deg, #f3dc9f, #e2c47a 45%, #fff2c4 60%, #e2c47a);
  background-size: 220% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: tgCtaShimmer 5s linear infinite;
}
@keyframes tgCtaShimmer { from { background-position: 200% 0; } to { background-position: -20% 0; } }
.tg-cta__desc { color: rgba(255,255,255,.8); font-size: 15px; }

/* Nút chính: vàng gradient, vệt sáng quét khi rê chuột, mũi tên nhích, vòng sóng nhắc chú ý */
.tg-btn-cta {
  position: relative; overflow: hidden;
  background: linear-gradient(135deg, #e2c47a, #c9a84c);
  border-color: transparent;
  box-shadow: 0 10px 24px rgba(201,168,76,.35);
  transition: transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s, filter .25s;
}
.tg-btn-cta::after {
  content: ''; position: absolute; top: 0; left: -80%; width: 55%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.65), transparent);
  transform: skewX(-20deg); transition: left .6s ease; pointer-events: none;
}
.tg-btn-cta:hover { background: linear-gradient(135deg, #f0d791, #d6b45a); transform: translateY(-3px); box-shadow: 0 16px 32px rgba(201,168,76,.45); }
.tg-btn-cta:hover::after { left: 130%; }
.tg-btn-cta:active { transform: translateY(0) scale(.98); box-shadow: 0 6px 14px rgba(201,168,76,.35); }
.tg-btn-cta span[aria-hidden] { display: inline-block; transition: transform .25s; }
.tg-btn-cta:hover span[aria-hidden] { transform: translateX(5px); }
.tg-cta__btns .tg-btn-cta:not(.tg-btn-cta--outline) { animation: tgCtaPulse 3.2s ease-out infinite; }
@keyframes tgCtaPulse {
  0%   { box-shadow: 0 10px 24px rgba(201,168,76,.35), 0 0 0 0 rgba(226,196,122,.55); }
  70%  { box-shadow: 0 10px 24px rgba(201,168,76,.35), 0 0 0 16px rgba(226,196,122,0); }
  100% { box-shadow: 0 10px 24px rgba(201,168,76,.35), 0 0 0 0 rgba(226,196,122,0); }
}
.tg-btn-cta--outline {
  background: rgba(255,255,255,.08); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: 1.5px solid rgba(255,255,255,.45); box-shadow: none; color: #fff;
}
.tg-btn-cta--outline::after { display: none; }
.tg-btn-cta--outline:hover { background: rgba(255,255,255,.18); border-color: #fff; box-shadow: 0 12px 26px rgba(0,0,0,.18); }
.tg-btn-cta:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }

/* CTA nhỏ ở thanh bên */
.tg-btn-cta--sm { position: relative; overflow: hidden; background: linear-gradient(135deg, #e2c47a, #c9a84c); color: var(--tg-charcoal); box-shadow: 0 8px 18px rgba(201,168,76,.3); }
.tg-btn-cta--sm:hover { background: linear-gradient(135deg, #f0d791, #d6b45a); color: var(--tg-charcoal); }
.tg-sidebar-cta .tg-btn-cta--sm { color: var(--tg-charcoal); }
.tg-single--v2 .tg-sidebar-cta { position: relative; overflow: hidden; transition: transform .3s, box-shadow .3s; }
.tg-single--v2 .tg-sidebar-cta::before {
  content: ''; position: absolute; inset: -40% -30% auto auto; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(226,196,122,.35), transparent 65%); animation: tgCtaFloat 8s ease-in-out infinite alternate; pointer-events: none;
}
.tg-single--v2 .tg-sidebar-cta > * { position: relative; }
.tg-single--v2 .tg-sidebar-cta:hover { transform: translateY(-3px); box-shadow: 0 18px 40px rgba(13,74,59,.3); }

/* Thẻ liên hệ cuối bài */
.tg-single--v2 .tg-article-contact { position: relative; overflow: hidden; transition: transform .3s, box-shadow .3s; }
.tg-single--v2 .tg-article-contact::before {
  content: ''; position: absolute; right: -60px; top: -60px; width: 220px; height: 220px; border-radius: 50%;
  background: radial-gradient(circle, rgba(226,196,122,.3), transparent 65%); animation: tgCtaFloat 9s ease-in-out infinite alternate; pointer-events: none;
}
.tg-single--v2 .tg-article-contact > * { position: relative; }
.tg-single--v2 .tg-article-contact:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(13,74,59,.3); }
.tg-single--v2 .tg-article-contact__grid a { transition: color .2s, text-decoration-color .2s; }

/* Hiện dần khi cuộn tới (trình duyệt hỗ trợ scroll-driven animation) */
@keyframes tgCtaReveal { from { opacity: 0; transform: translateY(34px) scale(.98); } to { opacity: 1; transform: none; } }
@supports (animation-timeline: view()) {
  .tg-cta__box {
    animation: tgCtaAurora 16s ease-in-out infinite alternate, tgCtaReveal linear both;
    animation-timeline: auto, view();
    animation-range: normal, entry 0% entry 55%;
  }
  .tg-single--v2 .tg-article-contact { animation: tgCtaReveal linear both; animation-timeline: view(); animation-range: entry 0% entry 55%; }
}

@media (max-width: 768px) {
  .tg-cta__box { border-radius: 20px; }
  .tg-cta__btns .tg-btn-cta:not(.tg-btn-cta--outline) { animation-duration: 3.6s; }
}
@media (prefers-reduced-motion: reduce) {
  .tg-cta__box, .tg-cta__box::after, .tg-cta__title em, .tg-btn-cta, .tg-cta__btns .tg-btn-cta,
  .tg-single--v2 .tg-sidebar-cta::before, .tg-single--v2 .tg-article-contact, .tg-single--v2 .tg-article-contact::before { animation: none !important; transition: none !important; }
  .tg-btn-cta::after { display: none; }
}
