/* MCL — icon và đồ hoạ tuyến kết nối, 27/10/2026. */
.mcl-icon{width:24px;height:24px;flex:none;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ico,.icb{border-radius:10px;background:var(--navy);box-shadow:none;border:1px solid rgba(232,207,138,.2)}
.ico svg,.icb .ic{stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
a.card:hover .icb{transform:none;background:#163D58;border-color:var(--gold)}
.mcl-card-title{display:flex;align-items:center;gap:12px;margin:6px 0 12px;min-height:44px}
.mcl-card-title h3{margin:0;flex:1;min-width:0}
.mcl-icon-tile{width:42px;height:42px;display:grid;place-items:center;flex:none;border:1px solid #D5E2E5;border-radius:10px;background:#F0F6F6;color:#196779;transition:background .2s,border-color .2s}
.home-v2 .mcl-card-title .pt-ic{position:static;margin:0;width:24px;height:24px;color:inherit}
.card:hover .mcl-icon-tile{background:#E5EFF0;border-color:#85ADB5}
.home-v2 .the-huong a{position:relative;padding:12px;border-radius:10px}
.home-v2 .eyebrow.eb2::before{flex:none;white-space:nowrap}
.home-v2 .the-huong .mcl-icon{width:22px;height:22px;margin-bottom:10px;color:var(--gold2)}
.home-v2 .chon button{padding:22px 44px 22px 22px}
.home-v2 .chon button>.mcl-icon{color:var(--tealt);width:28px;height:28px;margin-bottom:18px}
.home-v2 .chon button[aria-checked=true]>.mcl-icon{color:var(--gold2)}
.home-v2 .principles .pr{position:relative;border:1px solid #28465F;background:var(--navy);padding:24px}
.home-v2 .principles .pr>.mcl-icon{width:30px;height:30px;margin-bottom:22px;color:var(--gold2)}
.home-v2 .principles .pr::after{content:"";position:absolute;right:20px;top:25px;width:24px;height:1px;background:#54717D}
.home-v2 .steps.s3{gap:28px;position:relative}
.home-v2 .steps.s3 .step{padding:22px 0 0;border-left:0;border-top:1px solid #C3D4DB;border-radius:0}
.home-v2 .steps.s3 .step::before{font-size:24px;margin-bottom:16px;color:var(--tealt);background:var(--bg);width:max-content;padding-right:10px}
.home-v2 .steps.s3 .step::after{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px var(--bg)}
/* La bàn có vòng chia hướng tĩnh; đường bay giữ ở lớp nền. */
.home-v2 .laban .khung{display:none}
.home-v2 .laban::before{content:"";position:absolute;inset:4%;background:url('/assets/mcl-compass-grid-v1.svg') center/contain no-repeat;pointer-events:none;opacity:.65}
.home-v2 .hero>.tuyen{opacity:.2}
.home-v2 .hero>.tuyen path{stroke-width:.8;stroke-dasharray:none;animation:none}
.home-v2 .hero::before,.home-v2 .hero::after{animation:none}
.phero::before{animation:none;opacity:.045}
.phero::after{height:1px;inset:auto 0 0;background:linear-gradient(90deg,transparent 5%,#C9A24A 35%,#357E89 72%,transparent 95%);mask:none;opacity:.75;pointer-events:none}
.sep{gap:18px;padding:20px 24px;max-width:360px}
.sep svg{width:26px;height:26px;stroke-width:1.5}
.sep::before,.sep::after{background:var(--line)}
.mc-gallery-note:before,.mc-editorial .mc-credit:before{content:"";display:inline-block;width:7px;height:7px;border:1px solid currentColor;transform:rotate(45deg);flex:none;margin:0 5px 0 1px;vertical-align:middle}
.mc-editorial .mc-credit:before{margin-bottom:8px}
:where(a,button,summary):focus-visible{outline:3px solid #268495;outline-offset:4px}
.hero :where(a,button):focus-visible,.phero :where(a,button):focus-visible,header :where(a,button):focus-visible{outline-color:var(--gold2)}
@media(max-width:520px){.mcl-card-title{gap:10px}.home-v2 .laban::before{inset:1%}.home-v2 .the-huong a{padding:12px}.home-v2 .principles{grid-template-columns:1fr 1fr;gap:10px}.home-v2 .principles .pr{padding:18px 14px}.home-v2 .principles .pr::after{display:none}.home-v2 .principles .pr>.mcl-icon{width:26px;height:26px;margin-bottom:16px}.home-v2 .steps.s3{gap:24px}}
@media(prefers-reduced-motion:reduce){.js-reveal [data-reveal]{opacity:1;transform:none}.mcl-icon-tile{transition:none}}

/* Trang con, công cụ và liên hệ. */
.mcl-hero-icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid #5A6C65;background:rgba(232,207,138,.06);border-radius:12px;margin-bottom:22px;color:var(--gold2)}
.mcl-hero-icon .mcl-icon{width:30px;height:30px}
.cc-the{padding:22px 20px;gap:16px;align-items:start}
.cc-the>span:last-child{min-width:0;flex:1}
.cc-the h3{position:relative;padding-right:25px!important;line-height:1.5}
.cc-the .cc-arrow{position:absolute;right:0;top:4px;width:17px;height:17px;color:var(--tealt);transition:transform .2s}
.cc-the:hover .cc-arrow{transform:translateX(3px)}
.cc-the .icb{background:#EDF4F5;border-color:#D4E2E5;box-shadow:none}
.cc-the .icb .ic{stroke:#196779}
.cc-the[data-mang="thuong-mai"] .icb{background:#F7F3E8;border-color:#E5D9B9}
.cc-the[data-mang="thuong-mai"] .icb .ic{stroke:#846623}
.cc-the[data-mang="tu-van"] .icb{background:#EEF0F6;border-color:#DADEEA}
.cc-the[data-mang="tu-van"] .icb .ic{stroke:#4C5D87}
.cc-the[data-mang="dau-tu"] .icb{background:#EDF4EF;border-color:#D4E2D8}
.cc-the[data-mang="dau-tu"] .icb .ic{stroke:#38694B}
.cc-the:focus-visible .cc-arrow{transform:translateX(3px)}
.loc .chip{min-height:44px;border-radius:8px}
.loc input{border-radius:10px;min-height:44px}
.ft-trai a{display:inline-flex;align-items:center;gap:7px}
.ft-trai .mcl-icon{width:16px;height:16px;color:var(--gold2)}
.noi .mcl-icon{stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.noi a:focus-visible{outline-color:var(--gold2)}
@media(max-width:520px){.mcl-hero-icon{width:46px;height:46px;margin-bottom:18px}.mcl-hero-icon .mcl-icon{width:26px;height:26px}.cc-the{padding:20px 16px;gap:12px}.cc-the .icb{width:40px;height:40px}.cc-the .icb .ic{width:22px;height:22px}}
@media(prefers-reduced-motion:reduce){.cc-the .cc-arrow{transition:none}}
/* Giữ tương phản nét icon khi thẻ được rê chuột hoặc focus. */
.cc-the:hover .icb .ic,.cc-the:focus-visible .icb .ic{stroke:var(--gold2)}
.cc-the:focus-visible .icb{background:var(--navy)}

/* Điều hướng, tìm kiếm và FAQ. */
.mbtn{align-items:center;justify-content:center;gap:7px;min-width:44px;min-height:44px}
.mbtn .mcl-icon{width:19px;height:19px}
.mbtn .menu-top,.mbtn .menu-mid,.mbtn .menu-bottom{transform-origin:12px 12px;transition:transform .2s,opacity .2s}
.mbtn[aria-expanded=true] .menu-top{transform:translateY(6px) rotate(45deg)}
.mbtn[aria-expanded=true] .menu-mid{opacity:0}
.mbtn[aria-expanded=true] .menu-bottom{transform:translateY(-6px) rotate(-45deg)}
.search-open:hover,.mbtn:hover{background:rgba(232,207,138,.1);border-color:var(--gold2)}
.search-top{border-top:3px solid var(--gold);padding:18px 20px}
.search-top button{display:grid;place-items:center;color:var(--navy)}
.search-top button:hover{background:#E6EDF1}
.search-top button .mcl-icon{width:20px;height:20px}
.search-input-wrap{display:block;position:relative;margin-top:8px}
.search-input-wrap>.mcl-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--tealt);pointer-events:none}
.search-content .search-input-wrap input{margin-top:0;padding-left:44px}
.search-results a{display:flex;gap:13px;align-items:flex-start;position:relative;padding:15px 36px 15px 14px}
.search-results a::after{content:"";position:absolute;right:16px;top:24px;width:6px;height:6px;border-top:1.5px solid var(--tealt);border-right:1.5px solid var(--tealt);transform:rotate(45deg)}
.search-result-copy{min-width:0}
.search-result-icon{width:23px;height:23px;flex:none;margin-top:3px;fill:none;stroke:var(--tealt);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.search-results small{letter-spacing:.5px;margin-bottom:3px}
summary{gap:20px;min-height:30px}
summary::after{content:"";width:24px;height:24px;flex:none;border:1px solid #D5E2E5;border-radius:50%;background:linear-gradient(var(--tealt),var(--tealt)) center/10px 1.5px no-repeat,linear-gradient(var(--tealt),var(--tealt)) center/1.5px 10px no-repeat;transition:background .2s}
details[open] summary::after{transform:none;background:linear-gradient(var(--tealt),var(--tealt)) center/10px 1.5px no-repeat;border-color:#85ADB5}
details[open]{box-shadow:0 5px 18px rgba(14,42,71,.04)}
@media(max-width:1120px){.mbtn{display:inline-flex}.menu a{position:relative;padding-right:28px!important}.menu a::after{display:block;content:"";position:absolute;left:auto;right:5px;top:18px;bottom:auto;width:6px;height:6px;background:none;border-right:1.5px solid #90ACBC;border-top:1.5px solid #90ACBC;transform:rotate(45deg)}.menu a[aria-current=page]{color:var(--gold2)}}
@media(max-width:420px){.mbtn{gap:5px;padding:6px 8px}.mbtn .mcl-icon{width:17px;height:17px}.search-results a{gap:10px;padding-left:12px}.search-result-icon{width:20px;height:20px}}
@media(prefers-reduced-motion:reduce){.mbtn path,summary::after{transition:none}}

.mbtn .menu-top{transform-origin:12px 6px}.mbtn .menu-bottom{transform-origin:12px 18px}
@media(max-width:420px){.mbtn>span{display:none}.mbtn{width:44px;padding:6px}}
