/* ===== ai_modelling.css ===== */

/* Palette gợi ý theo vàng/nâu hiện có */
:root{
  --cc-gold:#e9b23a;
  --cc-gold-2:#f2cf69;
  --cc-brown:#8a5b2b;
  --cc-ink:#222;
  --cc-muted:#666;
  --cc-bg:#fffdf6;
}

/* Simple animations */
@keyframes riseFade {
  0% { opacity:0; transform: translateY(14px); }
  100% { opacity:1; transform: translateY(0); }
}
@keyframes slideRightFade {
  0% { opacity:0; transform: translateX(-20px); }
  100% { opacity:1; transform: translateX(0); }
}


/* Base tweaks */
.text-part .theme-title h1{ letter-spacing:.2px; }
.theme-subtitle-1{ color:var(--cc-brown); font-weight:600; margin-top:6px; }
.theme-sub-title{ margin-top:10px; color:var(--cc-muted); }

/* Buttons */
.btn-contact,
.theme-2,
.insight-1,
.call-to-action-btn{
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  will-change: transform;
}
.btn-contact:hover,
.insight-1:hover,
.call-to-action-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,.12);
}
.theme-2:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,.1);
}

/* Category tabs */
.category-lists-slider .category-button{
  transition: background .2s ease, color .2s ease, transform .15s ease;
  border-radius:999px;
  padding:8px 14px;
}
.category-lists-slider .category-button:hover{
  transform: translateY(-1px);
  background: var(--cc-bg);
}
.category-lists-slider .category-button.active{
  background: linear-gradient(90deg,var(--cc-gold),var(--cc-gold-2));
  color:#fff;
}

/* Service cards/images */
.img-ser{
  filter: drop-shadow(0 6px 16px rgba(0,0,0,.08));
  transition: transform .25s ease, filter .25s ease;
}
#ser-img:hover .img-ser{
  transform: translateY(-3px) scale(1.01);
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.12));
}

/* Value circles */
.value-measure .item .cir-text{ color:var(--cc-muted); }
.value-measure .item .circle-1,
.value-measure .item .circle-2,
.value-measure .item .circle-3{
  transition: transform .25s ease, box-shadow .25s ease;
}
.value-measure .item:hover .circle-1,
.value-measure .item:hover .circle-2,
.value-measure .item:hover .circle-3{
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(0,0,0,.12);
}

/* ===== Animations (CSS-only) ===== */
/* Scroll-trigger base */
.animate-up, .animate-right { opacity:0; }
.animate-up, .animate-right { will-change: transform, opacity; }

/* When in view, play animation */
.animate-up.in-view { animation: riseFade .6s ease forwards; }
.animate-right.in-view { animation: slideRightFade .6s ease forwards; }

/* Optional stagger by section */
.theme .animate-up.in-view { animation-delay:.05s; }
.theme .animate-right.in-view { animation-delay:.15s; }
.service .animate-up.in-view { animation-delay:.1s; }
.area .animate-up.in-view { animation-delay:.1s; }
.value .animate-up.in-view { animation-delay:.1s; }
.call-to-action .animate-up.in-view { animation-delay:.05s; }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .animate-up, .animate-right { opacity:1 !important; animation: none !important; }
}

/* Images subtle entrance */
.data-img img, .insight-img img { opacity:0; transform: translateY(10px); }
.data-img.animate-right.in-view img,
.data-img.animate-up.in-view img,
.insight-img.animate-right.in-view img,
.insight-img.animate-up.in-view img {
  animation: riseFade .7s ease .2s forwards;
}

/* Utility spacing for groups */
.btn-group-gap{ margin-top:14px; }

/* Responsive polish */
@media (max-width: 991px){
  .data-img{text-align:center;margin-top:18px;}
  .category-lists-slider .category-button{ margin:6px 6px; }
}

/* Optional: underline link style inside copy */
.theme-sub-title a, .ser-text a{
  color: var(--cc-brown); text-decoration: underline; text-underline-offset:3px;
}
.theme-sub-title a:hover, .ser-text a:hover{ color:#a97234; }

/* --- Compatibility with Animate.css class names (no external file needed) --- */
.animated { animation-duration: 1s; animation-fill-mode: both; }
.fadeInUp { animation-name: riseFade; }
.fadeInRight { animation-name: slideRightFade; }