/* Index V121 - giao diện trắng, icon nền trắng, chuyển động mượt */
:root{
  --landing-secondary:#fff!important;
  --landing-ease:cubic-bezier(.22,.61,.36,1);
  --landing-ease-out:cubic-bezier(.16,1,.3,1);
  --landing-fast:180ms;
  --landing-normal:280ms;
  --landing-slow:520ms;
}

html{scroll-behavior:smooth}
body.landing-page{background:#fff!important}
body.landing-page *{-webkit-tap-highlight-color:transparent}

/* Nền trang chỉ dùng trắng, xám trung tính và màu chủ đạo. */
.landing-hero,
.landing-stats,
.landing-section--soft,
.landing-footer{background:#fff!important}

.landing-header{
  background:rgba(255,255,255,.94)!important;
  transition:box-shadow var(--landing-normal) var(--landing-ease),border-color var(--landing-normal) var(--landing-ease),background-color var(--landing-normal) var(--landing-ease)!important;
}
.landing-header.is-scrolled{background:rgba(255,255,255,.98)!important}

/* Toàn bộ nền icon cố định màu trắng. */
.landing-icon,
.landing-float-card>i,
.landing-benefit-grid article>span,
.landing-eyebrow i,
.landing-trust-line i,
.landing-step .landing-icon,
.landing-service-card .landing-icon,
.landing-stat .landing-icon{
  background:#fff!important;
  color:var(--landing-primary)!important;
  border-color:color-mix(in srgb,var(--landing-primary) 22%,#e6e9ef)!important;
  box-shadow:0 8px 22px rgba(17,24,39,.07)!important;
}

.landing-benefit-grid article>span{
  border-radius:13px!important;
}

/* Card sạch, rõ, ít màu phụ. */
.landing-service-card,
.landing-ad-card,
.landing-step,
.landing-stat,
.landing-benefit-grid article,
.landing-hero-card,
.landing-hero-card__bottom div,
.landing-float-card,
.landing-faq-item,
.landing-contact__card{
  transition:transform var(--landing-normal) var(--landing-ease-out),box-shadow var(--landing-normal) var(--landing-ease-out),border-color var(--landing-normal) var(--landing-ease),background-color var(--landing-normal) var(--landing-ease)!important;
}

.landing-service-card,
.landing-ad-card,
.landing-step,
.landing-stat,
.landing-hero-card,
.landing-hero-card__bottom div,
.landing-float-card{
  background:#fff!important;
}

.landing-service-card:hover,
.landing-ad-card:hover,
.landing-step:hover{
  transform:translateY(-4px)!important;
  border-color:color-mix(in srgb,var(--landing-primary) 24%,#e5e8ee)!important;
  box-shadow:0 20px 48px rgba(17,24,39,.09)!important;
}

.landing-stat:hover{
  background:#fff!important;
  transform:translateY(-2px);
}

.landing-hero-card:hover{
  transform:translateY(-3px);
  box-shadow:0 30px 80px rgba(17,24,39,.14)!important;
}

.landing-hero-card__image img{
  transition:transform var(--landing-slow) var(--landing-ease-out),filter var(--landing-normal) var(--landing-ease)!important;
}
.landing-hero-card:hover .landing-hero-card__image img{transform:scale(1.015)!important}

/* Nút mượt và rõ. */
.landing-btn,
.landing-contact-link,
.landing-text-link,
.landing-nav a,
.landing-menu-button{
  transition:transform var(--landing-fast) var(--landing-ease-out),box-shadow var(--landing-normal) var(--landing-ease-out),background-color var(--landing-fast) var(--landing-ease),border-color var(--landing-fast) var(--landing-ease),color var(--landing-fast) var(--landing-ease),opacity var(--landing-fast) var(--landing-ease)!important;
}
.landing-btn:active,
.landing-contact-link:active,
.landing-menu-button:active{transform:scale(.97)!important}
.landing-btn--outline,
.landing-btn--ghost{background:#fff!important}

/* Điều hướng có trạng thái đang xem. */
.landing-nav a.is-active{color:var(--landing-primary)!important}
.landing-nav a.is-active:after{transform:scaleX(1)!important}

/* Reveal mượt, không giật. */
[data-landing-reveal]{
  opacity:0;
  transform:translate3d(0,20px,0);
  transition:opacity var(--landing-slow) var(--landing-ease-out),transform var(--landing-slow) var(--landing-ease-out)!important;
  transition-delay:var(--landing-reveal-delay,0ms)!important;
  will-change:opacity,transform;
}
[data-landing-reveal].is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
  will-change:auto;
}

/* FAQ mở đóng mềm. */
.landing-faq-answer{
  transition:grid-template-rows 360ms var(--landing-ease-out),opacity 260ms var(--landing-ease)!important;
  opacity:.35;
}
.landing-faq-item.is-open .landing-faq-answer{opacity:1}
.landing-faq-item button:focus-visible,
.landing-btn:focus-visible,
.landing-nav a:focus-visible,
.landing-menu-button:focus-visible{
  outline:3px solid color-mix(in srgb,var(--landing-primary) 22%,transparent);
  outline-offset:3px;
}

/* Thanh tiến độ cuộn rất mảnh. */
.landing-scroll-progress{
  position:fixed;
  z-index:2000;
  top:0;
  left:0;
  width:100%;
  height:3px;
  pointer-events:none;
  transform:scaleX(0);
  transform-origin:left center;
  background:var(--landing-primary);
  transition:transform 90ms linear;
}

/* Lớp phản hồi khi bấm. */
.landing-is-pressed{transform:scale(.97)!important}

/* Không dùng màu phụ ở khối tối, icon vẫn trắng. */
.landing-section--dark .landing-benefit-grid article{
  background:rgba(255,255,255,.055)!important;
  border-color:rgba(255,255,255,.14)!important;
}
.landing-section--dark .landing-benefit-grid article:hover{
  background:rgba(255,255,255,.085)!important;
  transform:translateY(-3px);
}

/* Mobile: chuyển động vừa đủ, không nặng. */
@media(max-width:720px){
  .landing-service-card:hover,
  .landing-ad-card:hover,
  .landing-step:hover,
  .landing-stat:hover,
  .landing-hero-card:hover{transform:none!important}
  [data-landing-reveal]{transform:translate3d(0,12px,0)}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  [data-landing-reveal]{opacity:1!important;transform:none!important}
  .landing-scroll-progress{display:none}
}