/* ==========================================================================
   Wistorix · Nền khối CTA
   Dùng ở: mọi trang có khối .cta-wrap ("Drive của bạn đang công khai những gì?")
   Thay nền wistorix-cta-bg.svg bằng ảnh thật, kèm lớp phủ màu thương hiệu
   để chữ trắng vẫn đọc được trên ảnh.
   Nạp sau aeline.webflow.shared.css nên ghi đè được nền gốc.
   ========================================================================== */

.cta-wrap{
  background-image:url(wistorix-cta-bg.webp) !important;
  background-position:62% 45% !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
}

/* Lớp phủ: đậm bên trái nơi có chữ, nhạt dần sang phải để lộ khuôn mặt.
   Màu lấy từ wistorix-tokens.css · --wx-indigo #021E6B và --wx-navy #041335 */
.cta-wrap .overlay{
  background-image:linear-gradient(90deg,
    rgba(2,30,107,.95) 0%,
    rgba(2,30,107,.88) 32%,
    rgba(4,19,53,.62) 60%,
    rgba(4,19,53,.34) 100%) !important;
}

/* Màn hẹp: chữ nằm trên toàn bộ bề ngang nên phủ theo chiều dọc */
@media (max-width:767px){
  .cta-wrap{background-position:58% 40% !important}
  .cta-wrap .overlay{
    background-image:linear-gradient(180deg,
      rgba(2,30,107,.90) 0%,
      rgba(2,30,107,.86) 55%,
      rgba(4,19,53,.80) 100%) !important;
  }
}

/* Khối CTA vừa khung nội dung (80rem) như các khối khác, không tràn sát mép màn hình.
   Lề hai bên khớp .padding-global của theme ở từng cỡ màn hình. */
.padding-global.is-cta{padding-left:3.25rem;padding-right:3.25rem;padding-bottom:3rem}
.cta-wrap{max-width:80rem;margin-left:auto;margin-right:auto}
@media screen and (max-width:991px){
  .padding-global.is-cta{padding-left:var(--_sizes---fixed--huge);padding-right:var(--_sizes---fixed--huge)}
}
@media screen and (max-width:767px){
  .padding-global.is-cta{padding-left:var(--_sizes---fixed--medium);padding-right:var(--_sizes---fixed--medium)}
}
