/* ISOFT Corporate Website V2.8 — Home interaction & contrast refinement
   Reference: the established interaction language already used on the Triển khai page.
   Scope: Home only. No information architecture changes. */

body.home-v28{
  --h28-navy:#07366f;
  --h28-blue:#0b63ce;
  --h28-blue-2:#1683ee;
  --h28-cyan:#28a9ee;
  --h28-green:#14a879;
  --h28-orange:#f29b21;
  --h28-violet:#7458e8;
  --h28-red:#ef4050;
  --h28-ink:#173f63;
  --h28-muted:#45647f;
  --h28-line:#cfe0ec;
  --h28-shadow:0 17px 38px rgba(14,68,120,.095);
}

/* ---------- Buttons: always separate from the surface behind them ---------- */
body.home-v28.redesign-v26 .v26-btn{
  border-color:#8dbce0;
  background:linear-gradient(180deg,#f8fcff,#edf7ff);
  color:#074782;
  box-shadow:0 5px 14px rgba(12,77,139,.075);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease;
}
body.home-v28.redesign-v26 .v26-btn:hover,
body.home-v28.redesign-v26 .v26-btn:focus-visible{
  transform:translateY(-3px);
  border-color:#0b63ce;
  background:linear-gradient(135deg,#0b5fc6,#1484ea);
  color:#fff;
  box-shadow:0 13px 26px rgba(11,99,206,.22);
}
body.home-v28.redesign-v26 .v26-btn.v26-btn--primary{
  border-color:#0b63ce;
  background:linear-gradient(135deg,#084eaa 0%,#0d70dd 58%,#1692ec 100%);
  color:#fff;
  box-shadow:0 12px 26px rgba(11,99,206,.24),inset 0 1px rgba(255,255,255,.18);
}
body.home-v28.redesign-v26 .v26-btn.v26-btn--primary:hover,
body.home-v28.redesign-v26 .v26-btn.v26-btn--primary:focus-visible{
  border-color:#0754bd;
  background:linear-gradient(135deg,#063f91 0%,#0b62c8 52%,#1487df 100%);
  box-shadow:0 16px 32px rgba(8,79,167,.29),inset 0 1px rgba(255,255,255,.2);
}
body.home-v28.redesign-v26 .v26-btn:focus-visible{
  outline:3px solid rgba(40,169,238,.28);
  outline-offset:3px;
}

/* ---------- Hero dashboard: active control-center feel ---------- */
body.home-v28.redesign-v26 .v26-board{
  transition:transform .34s ease,box-shadow .34s ease,border-color .34s ease;
}
body.home-v28.redesign-v26 .v26-board:hover{
  transform:translateY(-5px);
  border-color:#acd0e8;
  box-shadow:0 31px 72px rgba(15,60,105,.15);
}
body.home-v28.redesign-v26 .v26-board-head b{color:#083c75}
body.home-v28.redesign-v26 .v26-board-head span{font-weight:800}
body.home-v28.redesign-v26 .v26-kpi{
  position:relative;
  overflow:hidden;
  border-color:#dbe7f0;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;
}
body.home-v28.redesign-v26 .v26-kpi:after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:2px;
  background:linear-gradient(90deg,#0b63ce,#28a9ee);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .26s ease;
}
body.home-v28.redesign-v26 .v26-kpi:hover{
  transform:translateY(-3px);
  border-color:#b8d8eb;
  background:#fff;
  box-shadow:0 10px 22px rgba(16,75,128,.075);
}
body.home-v28.redesign-v26 .v26-kpi:hover:after{transform:scaleX(1)}
body.home-v28.redesign-v26 .v26-kpi strong{color:#0754ad}
body.home-v28.redesign-v26 .v26-kpi span{color:#55718b}
body.home-v28.redesign-v26 .v26-chart{
  background:linear-gradient(180deg,#fbfdff,#f6fbff);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
body.home-v28.redesign-v26 .v26-chart:hover{
  transform:translateY(-3px);
  border-color:#b8d8eb;
  box-shadow:0 10px 22px rgba(16,75,128,.07);
}
body.home-v28.redesign-v26 .v26-chart label{color:#345b7e;font-weight:800}
body.home-v28.redesign-v26 .v26-bars i{
  transform-origin:bottom;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),filter .3s ease;
}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(1){transform:scaleY(1.08)}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(2){transform:scaleY(1.13)}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(3){transform:scaleY(1.09)}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(4){transform:scaleY(1.15)}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(5){transform:scaleY(1.1)}
body.home-v28.redesign-v26 .v26-board:hover .v26-bars i:nth-child(6){transform:scaleY(1.16);filter:brightness(1.06)}
body.home-v28.redesign-v26 .v26-ai-box{
  border-color:#ddd7f4;
  background:linear-gradient(145deg,#fcfbff,#f5f5ff);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
body.home-v28.redesign-v26 .v26-ai-box:hover{
  transform:translateY(-3px);
  border-color:#bfb1ee;
  box-shadow:0 11px 24px rgba(91,70,186,.105);
}
body.home-v28.redesign-v26 .v26-ai-copy{color:#4c6481}

/* ---------- Shared interactive card language — aligned with Triển khai ---------- */
body.home-v28.redesign-v26 .v26-layer,
body.home-v28.redesign-v26 .v26-cap,
body.home-v28.redesign-v26 .v26-stage-card,
body.home-v28.redesign-v26 .v26-logo-card{
  transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s ease,border-color .26s ease,background .26s ease;
}

/* Four operating layers */
body.home-v28.redesign-v26 .v26-layer{--h28-accent:#0b63ce;--h28-soft:rgba(11,99,206,.09);border:1px solid #d7e6f1;box-shadow:0 6px 18px rgba(18,67,111,.045)}
body.home-v28.redesign-v26 .v26-layer--process{--h28-accent:#14a879;--h28-soft:rgba(20,168,121,.09)}
body.home-v28.redesign-v26 .v26-layer--data{--h28-accent:#22a7db;--h28-soft:rgba(34,167,219,.09)}
body.home-v28.redesign-v26 .v26-layer--ai{--h28-accent:#7458e8;--h28-soft:rgba(116,88,232,.095)}
body.home-v28.redesign-v26 .v26-layer:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:3px;
  background:var(--h28-accent);
  transform:scaleX(.34);
  transform-origin:left;
  transition:transform .28s ease;
}
body.home-v28.redesign-v26 .v26-layer:hover{
  transform:translateY(-6px);
  border-color:color-mix(in srgb,var(--h28-accent) 34%, #d7e6f1);
  background:linear-gradient(145deg,#fff 0%,color-mix(in srgb,var(--h28-soft) 52%,#fff) 100%);
  box-shadow:0 18px 38px rgba(14,68,120,.105);
}
body.home-v28.redesign-v26 .v26-layer:hover:before{transform:scaleX(1)}
body.home-v28.redesign-v26 .v26-layer .v26-icon{transition:transform .24s ease,box-shadow .24s ease}
body.home-v28.redesign-v26 .v26-layer:hover .v26-icon{transform:translateY(-3px);box-shadow:0 8px 18px var(--h28-soft)}
body.home-v28.redesign-v26 .v26-layer h3{color:#073b74}
body.home-v28.redesign-v26 .v26-layer p{color:#496985}

/* Six core capabilities */
body.home-v28.redesign-v26 .v26-cap{
  border-color:#d8e6f0;
  background:linear-gradient(180deg,#fff,#fbfdff);
  box-shadow:0 6px 18px rgba(18,67,111,.035);
}
body.home-v28.redesign-v26 .v26-cap:after{
  content:"";
  position:absolute;
  width:150px;height:150px;border-radius:50%;
  right:-85px;bottom:-95px;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent,#0b63ce) 14%, transparent),transparent 68%);
  opacity:0;
  transition:opacity .28s ease,transform .34s ease;
  pointer-events:none;
}
body.home-v28.redesign-v26 .v26-cap:hover{
  transform:translateY(-6px);
  border-color:color-mix(in srgb,var(--accent,#0b63ce) 30%,#d8e6f0);
  background:#fff;
  box-shadow:0 18px 40px rgba(14,68,120,.10);
}
body.home-v28.redesign-v26 .v26-cap:hover:after{opacity:1;transform:scale(1.12)}
body.home-v28.redesign-v26 .v26-cap .v26-icon{transition:transform .24s ease,box-shadow .24s ease}
body.home-v28.redesign-v26 .v26-cap:hover .v26-icon{transform:translateY(-3px);box-shadow:0 8px 18px rgba(13,102,220,.09)}
body.home-v28.redesign-v26 .v26-cap h3{color:#073b74}
body.home-v28.redesign-v26 .v26-cap p{color:#45647f}
body.home-v28.redesign-v26 .v26-cap small{color:#5f7891;font-weight:900}

/* Construction lifecycle — restore distinct cards and interaction like Triển khai */
body.home-v28.redesign-v26 .v26-journey{gap:13px}
body.home-v28.redesign-v26 .v26-stage{padding:4px 0 0}
body.home-v28.redesign-v26 .v26-stage-no{
  position:relative;
  z-index:2;
  width:48px;height:48px;
  margin:0 0 -11px 15px;
  border-radius:14px;
  box-shadow:0 0 0 6px #f2f8fd,0 8px 18px color-mix(in srgb,var(--accent) 22%,transparent);
  transition:transform .25s ease,box-shadow .25s ease;
}
body.home-v28.redesign-v26 .v26-stage-card{
  position:relative;
  min-height:174px;
  padding:29px 17px 18px;
  border:1px solid #d6e5f0;
  border-radius:17px;
  background:linear-gradient(180deg,#fff,#f9fcff);
  box-shadow:0 7px 20px rgba(18,67,111,.045);
  overflow:hidden;
}
body.home-v28.redesign-v26 .v26-stage-card:before{
  content:"";
  position:absolute;left:0;right:0;top:0;height:3px;
  background:var(--accent,#0b63ce);
}
body.home-v28.redesign-v26 .v26-stage:hover .v26-stage-no{
  transform:translateY(-3px);
  box-shadow:0 0 0 6px #f2f8fd,0 12px 23px color-mix(in srgb,var(--accent) 30%,transparent);
}
body.home-v28.redesign-v26 .v26-stage:hover .v26-stage-card{
  transform:translateY(-5px);
  border-color:color-mix(in srgb,var(--accent) 30%,#d6e5f0);
  box-shadow:0 17px 36px rgba(14,68,120,.095);
}
body.home-v28.redesign-v26 .v26-stage-card h3{color:#073b74;font-size:16px}
body.home-v28.redesign-v26 .v26-stage-card p{color:#486882;font-size:12.8px;line-height:1.58}

/* ---------- Dark IBOM section: stronger separation and text contrast ---------- */
body.home-v28.redesign-v26 .v26-dark{
  background:
    radial-gradient(circle at 54% 44%,rgba(48,157,235,.20),transparent 34%),
    linear-gradient(126deg,#06356f 0%,#0954a7 48%,#0d70ce 100%);
}
body.home-v28.redesign-v26 .v26-dark .v26-kicker{color:#9fe4ff;text-shadow:0 1px rgba(0,0,0,.08)}
body.home-v28.redesign-v26 .v26-dark .v26-title{color:#fff}
body.home-v28.redesign-v26 .v26-dark .v26-title span{color:#91e3ff}
body.home-v28.redesign-v26 .v26-dark .v26-lead{color:#e0f0fb;font-weight:500}
body.home-v28.redesign-v26 .v26-module{
  position:relative;
  overflow:hidden;
  min-height:80px;
  border-color:rgba(255,255,255,.24);
  background:linear-gradient(145deg,rgba(255,255,255,.135),rgba(255,255,255,.075));
  box-shadow:inset 0 1px rgba(255,255,255,.10),0 8px 22px rgba(2,29,68,.09);
  transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease;
}
body.home-v28.redesign-v26 .v26-module:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 46%);
  transform:translateX(-110%);
  transition:transform .45s ease;
  pointer-events:none;
}
body.home-v28.redesign-v26 .v26-module:hover{
  transform:translateY(-5px);
  background:linear-gradient(145deg,rgba(255,255,255,.20),rgba(255,255,255,.10));
  border-color:rgba(255,255,255,.38);
  box-shadow:0 18px 32px rgba(2,29,68,.20),inset 0 1px rgba(255,255,255,.12);
}
body.home-v28.redesign-v26 .v26-module:hover:after{transform:translateX(110%)}
body.home-v28.redesign-v26 .v26-module b{font-size:14.2px;color:#fff}
body.home-v28.redesign-v26 .v26-module small{font-size:11.6px;color:#d9ebf8;line-height:1.45}
body.home-v28.redesign-v26 .v26-module .v26-icon{border:1px solid rgba(255,255,255,.11);transition:transform .22s ease,box-shadow .22s ease}
body.home-v28.redesign-v26 .v26-module:hover .v26-icon{transform:translateY(-2px);box-shadow:0 8px 18px rgba(1,24,60,.16)}
body.home-v28.redesign-v26 .v26-module-list .v26-module:nth-child(1) .v26-icon{color:#8bdcff;background:rgba(54,177,240,.18)}
body.home-v28.redesign-v26 .v26-module-list .v26-module:nth-child(2) .v26-icon{color:#75e6bf;background:rgba(34,191,139,.17)}
body.home-v28.redesign-v26 .v26-module-list .v26-module:nth-child(3) .v26-icon{color:#ffd085;background:rgba(242,155,33,.17)}
body.home-v28.redesign-v26 .v26-module-list--right .v26-module:nth-child(1) .v26-icon{color:#c6b5ff;background:rgba(116,88,232,.19)}
body.home-v28.redesign-v26 .v26-module-list--right .v26-module:nth-child(2) .v26-icon{color:#82ddff;background:rgba(34,169,238,.18)}
body.home-v28.redesign-v26 .v26-module-list--right .v26-module:nth-child(3) .v26-icon{color:#ff9aaf;background:rgba(239,64,80,.17)}
body.home-v28.redesign-v26 .v26-platform-core{
  position:relative;
  overflow:hidden;
  border-color:rgba(255,255,255,.30);
  background:linear-gradient(150deg,rgba(255,255,255,.19),rgba(255,255,255,.08));
  box-shadow:0 20px 46px rgba(2,29,68,.19),inset 0 1px rgba(255,255,255,.14);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
}
body.home-v28.redesign-v26 .v26-platform-core:before{
  content:"";
  position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,#8ee5ff 32%,#fff 50%,#b9a8ff 70%,transparent);
  opacity:.8;
}
body.home-v28.redesign-v26 .v26-platform-core:hover{
  transform:translateY(-5px);
  border-color:rgba(255,255,255,.42);
  box-shadow:0 28px 58px rgba(2,29,68,.24),inset 0 1px rgba(255,255,255,.16);
}
body.home-v28.redesign-v26 .v26-platform-core h3{color:#fff}
body.home-v28.redesign-v26 .v26-platform-core p{color:#e1eff9;font-size:13.2px}
body.home-v28.redesign-v26 .v26-platform-ai{
  border-color:rgba(222,215,255,.48);
  background:linear-gradient(105deg,rgba(108,85,217,.42),rgba(139,111,239,.27));
  box-shadow:0 10px 24px rgba(52,34,133,.16);
  transition:transform .23s ease,border-color .23s ease,background .23s ease;
}
body.home-v28.redesign-v26 .v26-platform-ai:hover{
  transform:translateY(-2px);
  border-color:rgba(238,233,255,.70);
  background:linear-gradient(105deg,rgba(108,85,217,.52),rgba(139,111,239,.34));
}
body.home-v28.redesign-v26 .v26-platform-ai small{color:#ece9ff;font-size:11px}

/* ---------- Customer wall: interaction without touching original logos ---------- */
body.home-v28.redesign-v26 .v26-logo-card{
  position:relative;
  overflow:hidden;
  border-color:#d9e6ef;
  background:linear-gradient(180deg,#fff,#fcfeff);
}
body.home-v28.redesign-v26 .v26-logo-card:before{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,#0b63ce,#28a9ee);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .26s ease;
}
body.home-v28.redesign-v26 .v26-logo-card:hover{
  transform:translateY(-6px);
  border-color:#b9d7e9;
  background:#fff;
  box-shadow:0 16px 34px rgba(14,68,120,.09);
}
body.home-v28.redesign-v26 .v26-logo-card:hover:before{transform:scaleX(1)}
body.home-v28.redesign-v26 .v26-logo-card b{color:#073b74;font-size:13.2px}
body.home-v28.redesign-v26 .v26-logo-card span{color:#526f88;font-size:11px}
body.home-v28.redesign-v26 .v26-logo-card .v26-logo-visual img{transform:none!important;filter:none!important}

/* Stronger section text hierarchy, especially on soft/coloured surfaces */
body.home-v28.redesign-v26 .v26-section-head .v26-lead{color:#496985}
body.home-v28.redesign-v26 .v26-soft .v26-lead{color:#496985}
body.home-v28.redesign-v26 .v26-hero-note{color:#45647f}

/* ---------- Reveal rhythm: same principle as Triển khai, but remains fail-safe ---------- */
html.v26-js body.home-v28.redesign-v26 .v26-reveal{
  transform:translateY(22px);
}
html.v26-js body.home-v28.redesign-v26 .v26-reveal.is-in{
  transition-duration:.68s;
  transition-timing-function:cubic-bezier(.2,.8,.2,1);
}
body.home-v28.redesign-v26 .v26-layer-grid .v26-reveal:nth-child(1){--d:0ms}
body.home-v28.redesign-v26 .v26-layer-grid .v26-reveal:nth-child(2){--d:70ms}
body.home-v28.redesign-v26 .v26-layer-grid .v26-reveal:nth-child(3){--d:140ms}
body.home-v28.redesign-v26 .v26-layer-grid .v26-reveal:nth-child(4){--d:210ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list:first-child .v26-reveal:nth-child(1){--d:0ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list:first-child .v26-reveal:nth-child(2){--d:70ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list:first-child .v26-reveal:nth-child(3){--d:140ms}
body.home-v28.redesign-v26 .v26-platform-core{--d:120ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list--right .v26-reveal:nth-child(1){--d:180ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list--right .v26-reveal:nth-child(2){--d:250ms}
body.home-v28.redesign-v26 .v26-platform .v26-module-list--right .v26-reveal:nth-child(3){--d:320ms}
body.home-v28.redesign-v26 .v26-logo-grid .v26-reveal:nth-child(4n+1){--d:0ms}
body.home-v28.redesign-v26 .v26-logo-grid .v26-reveal:nth-child(4n+2){--d:55ms}
body.home-v28.redesign-v26 .v26-logo-grid .v26-reveal:nth-child(4n+3){--d:110ms}
body.home-v28.redesign-v26 .v26-logo-grid .v26-reveal:nth-child(4n+4){--d:165ms}

/* Motion only where the user can hover. Touch devices stay calm and predictable. */
@media (hover:none){
  body.home-v28.redesign-v26 .v26-board:hover,
  body.home-v28.redesign-v26 .v26-kpi:hover,
  body.home-v28.redesign-v26 .v26-chart:hover,
  body.home-v28.redesign-v26 .v26-ai-box:hover,
  body.home-v28.redesign-v26 .v26-layer:hover,
  body.home-v28.redesign-v26 .v26-cap:hover,
  body.home-v28.redesign-v26 .v26-stage:hover .v26-stage-no,
  body.home-v28.redesign-v26 .v26-stage:hover .v26-stage-card,
  body.home-v28.redesign-v26 .v26-module:hover,
  body.home-v28.redesign-v26 .v26-platform-core:hover,
  body.home-v28.redesign-v26 .v26-logo-card:hover{transform:none}
}

@media (prefers-reduced-motion:reduce){
  body.home-v28.redesign-v26 .v26-board,
  body.home-v28.redesign-v26 .v26-kpi,
  body.home-v28.redesign-v26 .v26-chart,
  body.home-v28.redesign-v26 .v26-ai-box,
  body.home-v28.redesign-v26 .v26-layer,
  body.home-v28.redesign-v26 .v26-cap,
  body.home-v28.redesign-v26 .v26-stage-card,
  body.home-v28.redesign-v26 .v26-stage-no,
  body.home-v28.redesign-v26 .v26-module,
  body.home-v28.redesign-v26 .v26-platform-core,
  body.home-v28.redesign-v26 .v26-logo-card,
  body.home-v28.redesign-v26 .v26-btn{transition:none!important}
}

@media(max-width:900px){
  body.home-v28.redesign-v26 .v26-stage-card{min-height:145px}
}
@media(max-width:620px){
  body.home-v28.redesign-v26 .v26-stage-no{margin-left:13px}
  body.home-v28.redesign-v26 .v26-stage-card{padding:29px 15px 17px}
  body.home-v28.redesign-v26 .v26-module small{font-size:11.4px}
}

/* Final contrast lock for dark surfaces — must remain after general section lead rules. */
body.home-v28.redesign-v26 .v26-dark .v26-section-head .v26-lead{
  color:#e4f2fc!important;
  font-weight:550;
  text-shadow:0 1px 0 rgba(0,0,0,.08);
}
body.home-v28.redesign-v26 .v26-dark .v26-platform-core p{color:#e6f3fc!important}
body.home-v28.redesign-v26 .v26-dark .v26-module small{color:#dcecf8!important}
body.home-v28.redesign-v26 .v26-dark .v26-platform-ai small{color:#f0edff!important}