/* =========================================================
   V2.13 VISUAL IMPACT REVIEW
   Purpose: strengthen weak / low-contrast blocks and KPI sections
   without changing site structure.
   ========================================================= */

:root{
  --v213-blue:#0d66dc;
  --v213-navy:#07367f;
  --v213-line:#d9e8f4;
  --v213-shadow:0 14px 34px rgba(9,61,118,.08);
  --v213-shadow-strong:0 22px 46px rgba(9,61,118,.12);
}

/* -----------------------------
   1) Customers page: hero model panel + sector cards
   ----------------------------- */
body[data-page="khach-hang-du-an"].redesign-v26 .v26-customer-hero-panel{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  border:1px solid #d8e8f4;
  box-shadow:0 26px 58px rgba(18,67,111,.11), inset 0 1px 0 rgba(255,255,255,.9);
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-customer-hero-panel::before{
  content:"";
  position:absolute;
  inset:auto -60px -70px auto;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(13,102,220,.09), rgba(13,102,220,0) 68%);
  pointer-events:none;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-customer-hero-panel h3{
  position:relative;
  z-index:1;
  font-size:22px;
  letter-spacing:-.02em;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector-list{gap:13px}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector{
  position:relative;
  overflow:hidden;
  min-height:64px;
  padding:16px 18px 16px 22px;
  border:1px solid #d8e8f4;
  border-radius:16px;
  background:linear-gradient(180deg,#ffffff 0%,#fafdff 100%);
  box-shadow:0 8px 20px rgba(17,70,118,.035);
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease, background .24s ease;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:6px;
  border-radius:16px 0 0 16px;
  background:linear-gradient(180deg,#44b8ff,#0d66dc);
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector::after{
  content:"";
  position:absolute;
  right:-18px;
  top:-18px;
  width:84px;
  height:84px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(68,184,255,.12), rgba(68,184,255,0) 72%);
  opacity:.7;
  transition:transform .24s ease, opacity .24s ease;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector:hover{
  transform:translateY(-5px);
  background:linear-gradient(180deg,#ffffff 0%,#f3f9ff 100%);
  border-color:#b8d6ee;
  box-shadow:var(--v213-shadow-strong);
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector:hover::after{
  transform:scale(1.1);
  opacity:1;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector b{
  position:relative;z-index:1;
  font-size:14px;
  line-height:1.35;
  color:#174b83;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector span{
  position:relative;z-index:1;
  font-size:12px;
  line-height:1.45;
  color:#5a7897;
  text-align:right;
}

/* -----------------------------
   2) Customers page: metrics — stronger cards and interaction
   ----------------------------- */
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric-band{
  padding-top:24px;
  background:transparent;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metrics{
  gap:16px;
  border:0;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric{
  position:relative;
  overflow:hidden;
  padding:24px 18px 20px;
  border-radius:20px;
  border:1px solid var(--v213-line);
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:var(--v213-shadow);
  transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,background .24s ease;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric::before{
  content:"";
  position:absolute;
  top:0; left:0; right:0;
  height:4px;
  background:linear-gradient(90deg,#39b7ff,#0d66dc 45%,#765af0);
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric::after{
  content:"";
  position:absolute;
  right:-18px;
  bottom:-18px;
  width:84px;
  height:84px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(13,102,220,.11),rgba(13,102,220,0) 70%);
  opacity:.55;
  transition:transform .24s ease,opacity .24s ease;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric:hover{
  transform:translateY(-6px);
  box-shadow:var(--v213-shadow-strong);
  border-color:#b8d6ee;
  background:linear-gradient(180deg,#ffffff 0%,#f5faff 100%);
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric:hover::after{
  transform:scale(1.12);
  opacity:.95;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric strong{
  position:relative;z-index:1;
  font-size:28px;
  font-weight:800;
  letter-spacing:-.02em;
  color:#0d66dc;
}
body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric span{
  position:relative;z-index:1;
  margin-top:8px;
  font-size:12.5px;
  line-height:1.55;
  color:#4f7192;
}

/* -----------------------------
   3) Implementation page: AI readiness rail should feel more premium
   ----------------------------- */
body[data-page="trien-khai"].refine-v24 .v24-layer-rail{
  align-items:stretch;
  gap:12px;
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail span{
  position:relative;
  overflow:hidden;
  min-height:132px;
  display:grid;
  place-items:center;
  padding:20px 18px;
  border-radius:22px;
  font-size:19px;
  line-height:1.28;
  letter-spacing:-.02em;
  background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  border:1px solid #d7e7f4;
  box-shadow:0 14px 34px rgba(5,55,110,.08);
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease, background .24s ease;
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail span::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:5px;
  background:currentColor;
  opacity:.92;
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail span::after{
  content:"";
  position:absolute;
  right:-18px;
  bottom:-18px;
  width:88px;
  height:88px;
  border-radius:50%;
  background:radial-gradient(circle, currentColor 0%, transparent 72%);
  opacity:.07;
  transition:transform .24s ease, opacity .24s ease;
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail span:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 46px rgba(5,55,110,.14);
  background:linear-gradient(180deg,#ffffff 0%,#f2f8ff 100%);
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail span:hover::after{
  transform:scale(1.14);
  opacity:.12;
}
body[data-page="trien-khai"].refine-v24 .v24-layer-rail i{
  display:grid;
  place-items:center;
  font-size:30px;
  line-height:1;
  color:#9fb6ca;
}

/* -----------------------------
   4) Subtle global lift for visually weak cards on key pages
   ----------------------------- */
body[data-page="giai-phap"].redesign-v26 .v26-map-module,
body[data-page="ibom"].redesign-v26 .v26-product-module,
body[data-page="giai-phap"].redesign-v26 .v26-model,
body[data-page="khach-hang-du-an"].redesign-v26 .v26-logo-card,
body[data-page="khach-hang-du-an"].redesign-v26 .v26-case{
  transition:transform .24s ease, box-shadow .24s ease, border-color .24s ease, background .24s ease;
}
body[data-page="giai-phap"].redesign-v26 .v26-map-module:hover,
body[data-page="ibom"].redesign-v26 .v26-product-module:hover,
body[data-page="giai-phap"].redesign-v26 .v26-model:hover,
body[data-page="khach-hang-du-an"].redesign-v26 .v26-logo-card:hover,
body[data-page="khach-hang-du-an"].redesign-v26 .v26-case:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 36px rgba(23,73,119,.11);
  border-color:#b9d6ec;
}

/* -----------------------------
   5) Contact page: stronger emphasis on direct contact items
   ----------------------------- */
body[data-page="lien-he"].redesign-v26 .v26-contact-item{
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:0 12px 28px rgba(17,70,118,.055);
}
body[data-page="lien-he"].redesign-v26 .v26-contact-item b,
body[data-page="lien-he"].redesign-v26 .v26-contact-item a{
  color:#0d66dc;
}
body[data-page="lien-he"].redesign-v26 .v26-contact-item small,
body[data-page="lien-he"].redesign-v26 .v26-contact-item span,
body[data-page="lien-he"].redesign-v26 .v26-contact-item p{
  color:#5c7896;
}

@media (max-width:1000px){
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector{
    flex-direction:column;
    align-items:flex-start;
  }
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector span{text-align:left}
  body[data-page="trien-khai"].refine-v24 .v24-layer-rail span{min-height:112px;font-size:18px}
}

@media (max-width:680px){
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-metrics{gap:12px}
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric{padding:20px 14px 18px}
  body[data-page="trien-khai"].refine-v24 .v24-layer-rail span{min-height:unset;padding:18px 16px;font-size:17px}
  body[data-page="trien-khai"].refine-v24 .v24-layer-rail i{font-size:24px}
}

@media (prefers-reduced-motion:reduce){
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-sector,
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-metric,
  body[data-page="trien-khai"].refine-v24 .v24-layer-rail span,
  body[data-page="giai-phap"].redesign-v26 .v26-map-module,
  body[data-page="ibom"].redesign-v26 .v26-product-module,
  body[data-page="giai-phap"].redesign-v26 .v26-model,
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-logo-card,
  body[data-page="khach-hang-du-an"].redesign-v26 .v26-case{
    transition:none!important;
  }
}