/* ECE Group - giao diện công khai. Màu lấy từ biến theme (--kdm-*) nên đổi được tại /admin/theme. */
html{scroll-behavior:smooth}
body,body.font-sans{font-family:Montserrat,'Be Vietnam Pro',ui-sans-serif,system-ui,sans-serif}

/* ---- Header: nền navy khi cuộn, logo thật (không tô màu) ---- */
body .kdm-logo img{opacity:1!important}
body .kdm-logo::after{display:none!important}
body .kdm-hdr.is-solid{background:rgb(var(--kdm-purple));color:#fff;box-shadow:0 2px 14px rgba(0,0,0,.35)}
body .kdm-hdr.is-solid .kdm-hdr-nav .kdm-top>li>a,
body .kdm-hdr.is-solid .kdm-hdr-nav .kdm-top>li>a:hover,
body .kdm-hdr.is-solid .kdm-hdr-nav .kdm-top>li:focus-within>a,
body .kdm-hdr.is-solid .kdm-hdr-tools,body .kdm-hdr.is-solid .kdm-hdr-tools a,
body .kdm-hdr.is-solid #mobile-menu-btn,body .kdm-hdr.is-solid .kdm-srch-m{color:#fff}
body .kdm-hdr .kdm-dd{background:rgb(var(--kdm-darkPurple))}
body .kdm-hdr-nav .kdm-top>li>a{font-weight:700}

/* ---- Khung chung ---- */
.ece-w{max-width:1100px;margin:0 auto;padding:0 20px}
.ece-sec{padding:60px 0}
.ece-dk{background:linear-gradient(160deg,rgb(var(--kdm-purple)),rgb(var(--kdm-lightPurple)));color:#fff}
.ece-alt{background:rgb(var(--kdm-surfaceAlt))}
.ece-sh{text-align:center;margin-bottom:34px}
.ece-tag{display:inline-block;position:relative;padding-left:32px;font-weight:900;font-size:14px;text-transform:uppercase;color:rgb(var(--kdm-inkMuted))}
.ece-tag::before{content:"";position:absolute;left:0;top:50%;width:23px;height:3px;border-radius:2px;background:currentColor;transform:translateY(-50%)}
.ece-sh h2{margin:6px 0 0;font-weight:700;font-size:clamp(24px,4.2vw,42px);line-height:1.25;text-transform:uppercase;color:rgb(var(--kdm-ink))}
.ece-dk .ece-tag,.ece-dk .ece-sh h2{color:#fff}
.ece-btn{display:inline-block;border:1px solid rgb(var(--kdm-ink));color:rgb(var(--kdm-ink));padding:10px 26px;font-weight:700;font-size:14px;transition:.25s}
.ece-btn:hover{background:rgb(var(--kdm-ink));color:#fff}
.ece-dk .ece-btn,.ece-btn.w{border-color:#fff;color:#fff}.ece-dk .ece-btn:hover,.ece-btn.w:hover{background:#fff;color:#000}

/* ---- Thư ngỏ ---- */
.ece-intro{background:rgb(var(--kdm-surface));padding:64px 0 56px}
.ece-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;align-items:center}
.ece-ni{font-weight:300;font-size:clamp(26px,4.5vw,42px);line-height:1.2;text-transform:uppercase;color:rgb(var(--kdm-ink))}
.ece-nc{font-weight:700;font-size:clamp(22px,3.6vw,38px);line-height:1.25;text-transform:uppercase;color:rgb(var(--kdm-ink));padding-bottom:15px;margin-bottom:22px;position:relative}
.ece-nc::before{content:"";position:absolute;left:0;bottom:0;width:85px;height:1px;background:rgb(var(--kdm-ink))}
.ece-rich{line-height:30px;font-size:15px;color:rgb(var(--kdm-inkSoft));margin-bottom:12px}
.ece-stats{display:flex;gap:28px;flex-wrap:wrap;margin:20px 0 26px}
.ece-stats .st-v{font-weight:700;font-size:34px;line-height:1;color:rgb(var(--kdm-purple))}
.ece-stats .st-l{font-size:12px;margin-top:6px;text-transform:uppercase;letter-spacing:.08em;color:rgb(var(--kdm-inkMuted))}
.ece-imgs{position:relative;height:370px}
.ece-imgs a{position:absolute;width:58%;background-size:cover;background-position:center;box-shadow:6px 8px 22px rgba(0,0,0,.25);transition:transform .5s}
.ece-imgs a:hover{transform:scale(1.03)}
.ece-imgs .i1{left:0;top:0;height:300px}.ece-imgs .i2{right:0;bottom:0;height:260px}

/* ---- Đối tác ---- */
.ece-partners{background:rgb(var(--kdm-surface));padding:0 0 56px}
.ece-tp{display:flex;align-items:center;gap:20px;justify-content:center;font-weight:700;font-size:16px;text-transform:uppercase;color:rgb(var(--kdm-ink));margin-bottom:20px}
.ece-tp::before,.ece-tp::after{content:"";flex:0 1 160px;height:1px;background:rgb(var(--kdm-ink))}
.ece-mq{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ece-mq>div{display:flex;gap:14px;width:max-content;animation:eceMq 40s linear infinite}
.ece-mq:hover>div{animation-play-state:paused}
.ece-mq a,.ece-mq span{display:flex;align-items:center;justify-content:center;padding:8px 22px;background:#fff;border-radius:6px}
.ece-mq img{height:56px;width:auto;max-width:180px;object-fit:contain;display:block}
@keyframes eceMq{to{transform:translateX(-50%)}}

/* ---- Lĩnh vực (hàng xen kẽ trên nền tối) ---- */
.ece-fr{display:flex;gap:30px;align-items:center;padding:16px 0;color:#fff}
.ece-fr:nth-child(even){flex-direction:row-reverse;text-align:right}
.ece-fi{flex:0 0 188px;height:188px;background-size:cover;background-position:center;transition:transform .5s}
.ece-fr:hover .ece-fi{transform:scale(1.04)}
.ece-fr h3{margin:0;font-weight:700;font-size:clamp(20px,3vw,28px);text-transform:uppercase;color:#fff}
.ece-fr p{margin:8px 0 0;line-height:1.8;font-size:15px;color:rgb(var(--kdm-onDarkSoft))}

/* ---- Thẻ sản phẩm / tin tức ---- */
.ece-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px}
.ece-card{display:block;background:#fff;border:1px solid rgb(var(--kdm-line));border-radius:12px;overflow:hidden;transition:transform .25s,border-color .25s}
.ece-card:hover{transform:translateY(-4px);border-color:rgb(var(--kdm-gold))}
.ece-ci{height:200px;background-size:cover;background-position:center;position:relative;transition:transform .6s}
.ece-card:hover .ece-ci{transform:scale(1.06)}
.ece-card .wrap{overflow:hidden}
.ece-cb{padding:18px}
.ece-cb h3{margin:0 0 6px;font-weight:700;font-size:17px;line-height:1.35;color:rgb(var(--kdm-purple))}
.ece-cb .cat{font-size:12px;font-weight:700;text-transform:uppercase;color:rgb(var(--kdm-goldDeep));margin-bottom:6px}
.ece-cb p{margin:0;font-size:14px;line-height:1.7;color:rgb(var(--kdm-inkSoft))}
.ece-news .ece-cb h3{color:rgb(var(--kdm-ink));font-size:15px}
.ece-dt{position:absolute;left:0;bottom:0;width:66px;height:60px;background:#404040;color:#fff;display:flex;flex-direction:column;justify-content:center;text-align:center;font-size:12px}
.ece-dt b{font-weight:700;font-size:24px;line-height:1;margin-bottom:3px}
.ece-more{text-align:center;margin-top:26px}

/* ---- Quan hệ đầu tư ---- */
.ece-irg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:28px;max-width:940px;margin:0 auto}
.ece-ir{display:block;position:relative;overflow:hidden;box-shadow:4.5px 7.8px 2px rgba(0,0,0,.35);background:rgb(var(--kdm-lightPurple))}
.ece-iri{aspect-ratio:278/363;background-size:cover;background-position:center;transition:transform .6s}
.ece-ir:hover .ece-iri{transform:scale(1.06)}
.ece-irn{position:absolute;left:0;right:0;bottom:34px;text-align:center;font-weight:700;font-size:15px;text-transform:uppercase;color:#fff;padding:28px 10px 10px;background:linear-gradient(transparent,rgba(0,0,0,.8))}
.ece-irb{position:absolute;left:0;right:0;bottom:0;text-align:center;font-weight:700;font-size:12px;color:#fff;padding:9px;background:rgba(0,0,0,.65)}

/* ---- Tuyển dụng ---- */
.ece-crg{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:36px}
.ece-cr{display:flex;gap:16px;color:#fff}
.ece-nb{font-weight:400;font-size:48px;line-height:1}
.ece-cr h3{margin:0;font-weight:700;font-size:16px;line-height:24px;text-transform:uppercase;color:#fff;padding-bottom:22px;position:relative}
.ece-cr h3::after{content:"";position:absolute;left:0;bottom:0;width:59px;height:1px;background:#fff}
.ece-de{margin-top:22px;font-size:14px;line-height:24px}
.ece-ob{display:inline-block;margin-top:30px;border:1px solid #fff;padding:8px 24px;font-weight:700;font-size:14px;color:#fff}
.ece-ob:hover{background:#fff;color:#000}

/* ---- Liên hệ ---- */
.ece-ct{background:rgb(var(--kdm-surface));padding:64px 0}
.ece-ct h2{margin:0;font-weight:700;font-size:26px;text-transform:uppercase;color:rgb(var(--kdm-ink))}
.ece-ct .bar{width:210px;height:4px;background:rgb(var(--kdm-gold));margin:14px 0 18px}
.ece-ci2{display:flex;align-items:center;gap:14px;margin-top:18px}
.ece-ci2 i{width:44px;height:44px;border:1px solid rgb(var(--kdm-purple));border-radius:50%;display:flex;align-items:center;justify-content:center;color:rgb(var(--kdm-purple));font-style:normal;font-size:18px;flex:0 0 auto}
.ece-ci2 small{display:block;font-size:11px;font-weight:700;text-transform:uppercase;color:rgb(var(--kdm-inkMuted))}
.ece-ci2 b{font-size:15px;color:rgb(var(--kdm-ink))}
.ece-form{background:#fff;border:1px solid rgb(var(--kdm-line));padding:30px}
.ece-form label{display:block;font-size:12px;font-weight:700;text-transform:uppercase;color:rgb(var(--kdm-purple));margin:14px 0 6px}
.ece-form input,.ece-form select,.ece-form textarea{width:100%;padding:11px 14px;border:1px solid rgb(var(--kdm-line));background:rgb(var(--kdm-surface));color:rgb(var(--kdm-ink));font:inherit;font-size:14px}
.ece-form input:focus,.ece-form select:focus,.ece-form textarea:focus{outline:none;border-color:rgb(var(--kdm-purple))}
.ece-form button{margin-top:20px;width:100%;padding:14px;border:0;background:rgb(var(--kdm-purple));color:#fff;font-weight:700;font-size:14px;text-transform:uppercase;cursor:pointer;transition:.25s}
.ece-form button:hover{background:rgb(var(--kdm-lightPurple))}
.ece-form button:disabled{opacity:.6}
.ece-g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* ---- Chân trang: nền navy ---- */
body .kdm-footer{background:rgb(var(--kdm-footerBg));color:rgb(var(--kdm-onDarkSoft))}
body .kdm-footer,body .kdm-footer a,body .kdm-footer p,body .kdm-footer li,body .kdm-footer span,body .kdm-footer small{color:rgb(var(--kdm-onDarkSoft))}
body .kdm-footer h4,body .kdm-footer h3{color:#fff}
body .kdm-footer a:hover{color:rgb(var(--kdm-lightGold))}

/* ---- Hiệu ứng hiện dần ---- */
.ece-rv{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--d,0s)}
.ece-rv.ece-in{opacity:1;transform:none}
@media (max-width:640px){
  .ece-fr,.ece-fr:nth-child(even){flex-direction:column;text-align:left;align-items:stretch}.ece-fi{flex:0 0 auto;width:100%;height:200px}
  .ece-imgs{height:300px}.ece-imgs .i1{height:240px}.ece-imgs .i2{height:200px}.ece-tp::before,.ece-tp::after{flex-basis:30px}.ece-g2{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.ece-rv{opacity:1;transform:none;transition:none}.ece-mq>div{animation:none}html{scroll-behavior:auto}}