/* MCN Labs / Premium Malaysia Edition / v3.1
   Deliberately visual-only. Existing business flows, links, pricing and forms remain owned by their original pages. */
:root {
  --bg:#f5f4f0; --bg2:#faf9f6; --ink:#172126; --muted:#667075;
  --gold:#b99762; --gold2:#d8bd87; --line:rgba(30,43,46,.13);
  --card:#fff; --dark:#111b21; --shadow:0 20px 60px rgba(21,31,36,.075);
  --mcn-blue:#101a20; --mcn-hairline:rgba(25,35,40,.11);
}
html { scroll-padding-top:116px }
body { background:#f5f4f0; color:#172126; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,"PingFang SC","Microsoft YaHei",sans-serif; -webkit-font-smoothing:antialiased }
body::selection { background:#dbc79f; color:#102028 }
.container { width:min(1240px,calc(100% - 96px)) }
nav { z-index:500; background:rgba(249,248,244,.96); border-bottom:1px solid rgba(19,31,38,.10); box-shadow:0 2px 16px rgba(15,22,27,.025) }
.navin { height:91px; gap:28px }
.brand { flex-shrink:0 }
.brand .mcn-official-mark, .brand img.mcn-official-mark { width:122px!important;max-width:122px!important;height:68px!important;flex-basis:122px!important;object-fit:contain!important }
.links { gap:28px; align-items:center; font-size:12px; letter-spacing:.06em; text-transform:uppercase; font-weight:650; color:#526066 }
.links a,.region-strip a { transition:color .18s ease,background .18s ease,border-color .18s ease }
.links a:hover {color:#ad8953}
.region-strip {gap:8px}
.region-strip .nav-contact,.region-strip a.nav-contact {border-radius:4px;background:#172126;border:1px solid #172126;color:#fff;padding:13px 17px;font-size:11px;font-weight:750;letter-spacing:.045em;white-space:nowrap}
.region-strip a.nav-contact:hover {background:#304047;color:#fff}
.region-strip a.pill { border-radius:4px;background:transparent;border-color:rgba(20,31,36,.15);padding:10px 12px;color:#263238 }
.region-strip a.pill.active {color:#fff;background:#19252a}
.btn,.engine-link { border-radius:5px; font-size:12px; font-weight:750; letter-spacing:.045em; padding:15px 22px; min-height:46px; box-shadow:none; text-align:center; transition:transform .18s,background .18s,border-color .18s,color .18s }
.btn:hover,.engine-link:hover { transform:translateY(-2px) }
.btn.dark,.engine-link { background:#17242a; color:#fff; border-color:#17242a }
.btn.gold { background:#c7a46c; border-color:#c7a46c; color:#131c20 }
.btn.light { background:transparent; color:#17242a; border:1px solid rgba(16,28,33,.25) }
.btn:focus-visible,a:focus-visible,button:focus-visible { outline:2px solid #b99762;outline-offset:4px }
/* Dramatic but restrained, enterprise-first hero */
header.hero { background:radial-gradient(ellipse at 94% 12%,rgba(190,153,93,.12),transparent 38%),linear-gradient(112deg,#101b20 0%,#17262b 62%,#192a30 100%); min-height:680px;padding:108px 0 104px;color:#fff;overflow:hidden }
header.hero::before {content:"";position:absolute;width:570px;height:570px;border:1px solid rgba(214,193,155,.10);border-radius:50%;right:-180px;top:-210px;pointer-events:none}
header.hero::after {left:0;right:0;bottom:0;height:1px;transform:none;background:linear-gradient(90deg,transparent,rgba(205,177,123,.46),transparent)}
.hero-grid {grid-template-columns:1.08fr .92fr;gap:66px}
.hero .eyebrow {font-size:11px;letter-spacing:.23em;color:#d1b984;font-weight:700}
.hero .eyebrow::before {background:#d0ad73;width:30px}
.hero h1 {font-size:clamp(70px,7.1vw,116px);letter-spacing:-.075em;line-height:.94;font-weight:650;margin:28px 0 33px;color:#f8f7f3}
.hero h1 em {font-style:normal;color:#d7bb88;font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.045em}
.hero p,.hero .lead {max-width:610px;font-size:18px;line-height:1.85;font-weight:350;color:#c1cacf}
.hero .actions {margin-top:36px}
.hero .btn.dark {background:#f6f4ee;color:#172329;border-color:#f6f4ee}
.hero .btn:not(.dark):not(.gold) {border-color:rgba(240,243,243,.3);color:#f4f5f2}
.hero-note {margin-top:29px;color:#9da9af;font-size:12px;letter-spacing:.05em}
.hero .system {background:rgba(240,242,238,.07);border:1px solid rgba(225,223,210,.20);box-shadow:0 30px 80px rgba(0,0,0,.24);border-radius:10px;padding:23px;backdrop-filter:blur(12px)}
.hero .system-head {margin-bottom:23px;padding:7px 3px 19px;border-bottom:1px solid rgba(255,255,255,.12)}
.hero .system-title {color:#e5e8e4;font-size:11px;font-weight:650;letter-spacing:.16em}
.hero .signal i {background:#546268}.hero .signal i:nth-child(2){background:#d3b477}
.hero .flow {gap:8px}
.hero .row {background:rgba(241,244,244,.06);border:1px solid rgba(233,235,233,.09);border-radius:5px;padding:17px 14px;gap:14px}
.hero .row .icon {border-radius:3px;background:rgba(211,180,125,.14);color:#ddc493;font-size:11px}
.hero .row b {color:#f2f2ee;font-size:13px;line-height:1.45;font-weight:650}
.hero .row small {color:#aebac0;font-size:11px;line-height:1.5}
.hero .row .status {border:1px solid rgba(211,180,125,.21);background:rgba(211,180,125,.1);color:#d4bd8e;border-radius:3px;font-size:10px;padding:7px 8px}
/* Editorial rhythm */
section {padding:112px 0}
section.alt {background:#eeefeb;border-color:rgba(23,33,38,.06)}
.head {margin-bottom:48px;gap:64px}
.kicker,.eyebrow {color:#ad8551;font-size:11px;letter-spacing:.2em;font-weight:750}
h1,h2,h3 {color:inherit}
h2 {font-size:clamp(38px,4.2vw,60px);font-weight:650;letter-spacing:-.055em;line-height:1.09}
.head p {color:#647075;max-width:410px;font-size:15px;line-height:1.85}
.card,.engine-card,.pcard,.mcard,.market-card,.summarybox,.check,.usecase,.step,.stage-box,.plaincard,.level,.depth-row {background:#fff;border:1px solid rgba(28,40,46,.12);border-radius:8px;box-shadow:0 10px 36px rgba(14,25,32,.025)}
.card,.engine-card {padding:35px}
.card h3,.engine-card h3 {font-size:22px;font-weight:650;letter-spacing:-.035em;line-height:1.34}
.card p,.engine-card p {font-size:14px;line-height:1.9;color:#667076}
.card .num,.engine-label {font-size:10px;color:#a17d46;letter-spacing:.15em}
.engine-card {transition:border-color .22s, transform .22s,box-shadow .22s}
.engine-card:hover {border-color:rgba(169,128,74,.42);transform:translateY(-4px);box-shadow:0 20px 38px rgba(24,39,45,.065)}
.engine-flow {border-top-color:rgba(20,35,42,.10);color:#677278;font-size:12px;line-height:1.7}
.engine-link {font-size:11px;padding:12px 16px;min-height:43px}
.architecture {background:#18252b;border-radius:8px;padding:46px 38px;box-shadow:0 22px 55px rgba(14,27,32,.12)}
.arch-step small {font-size:10px;color:#d5b985;letter-spacing:.16em}
.arch-step b {font-weight:650;font-size:22px}
.arch-step span {color:#b8c2c4;line-height:1.8}
.arch-plus {color:#d9b986;font-weight:400}
.ai-note,.sample-note,.delivery,.note {border-radius:6px;background:rgba(183,153,96,.07);border-color:rgba(143,115,77,.17);color:#5a6266;line-height:1.8}
.ai-note b,.delivery b {color:#27353a}
.flowline {gap:10px}
.fbox {border-radius:7px;min-height:139px;background:#fff;padding:22px 17px;border-color:rgba(24,38,43,.12)}
.fbox b {font-weight:650;color:#243237}
.fbox small {color:#a4804b}.fbox span {color:#6b777c;line-height:1.5}
.fbox:not(:last-child)::after {color:#c09d68}
.offer {min-height:330px;gap:2px}
.offer.featured {background:#17262c;color:#fff;box-shadow:0 23px 48px rgba(15,32,38,.15);border-color:#17262c;transform:translateY(-9px)}
.offer.featured p {color:#c1c9c9}
.offer.featured .level-note{background:rgba(255,255,255,.05)!important;color:#d1d7d4!important;border-color:rgba(255,255,255,.16)!important}
.tag {border-radius:3px;background:#f2ede5;color:#937042;letter-spacing:.14em}
.offer.featured .tag{background:#d5b982;color:#19262c}
.level-note{border-radius:4px;background:#f6f7f4}
.demo {gap:76px}.demo p {color:#677277!important}
.dashboard{border-radius:9px;background:#17252b;padding:15px;box-shadow:0 22px 55px rgba(20,33,39,.12)}
.dash{background:#f5f6f4;border-radius:5px;padding:21px}
.metric{border-radius:4px}.col{border-radius:4px;background:#e3e9e6}.leadbox{border-radius:4px}
.cta{border-radius:8px;background:linear-gradient(115deg,#142229,#25343a);padding:62px 66px}
.cta h2 {font-size:clamp(36px,4vw,52px)}.cta p{color:#c8d0d0}
footer {background:#121e24;color:#bec7c9;border-top:1px solid rgba(211,187,148,.23);padding:56px 0;font-size:12px;line-height:1.9}
footer .foot {align-items:center}footer b{font-size:17px;letter-spacing:.11em;color:#fff}footer a:hover{color:#e2bf84}
/* Made in Malaysia: no faux global-market selector */
.premium-local-section .premium-local-layout {display:grid;grid-template-columns:1.05fr .95fr;gap:90px;align-items:center}
.premium-local-section .premium-local-copy p{max-width:580px;line-height:1.85;color:#667075;font-size:16px}
.premium-local-overline {font-size:11px;color:#a68251;letter-spacing:.21em;font-weight:750;text-transform:uppercase}
.premium-local-spec {border-top:1px solid var(--mcn-hairline);margin:0;padding:0;list-style:none}
.premium-local-spec li{display:flex;gap:18px;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid var(--mcn-hairline);font-size:13px;color:#6b7579}
.premium-local-spec li strong {color:#1b2a30;font-weight:700;text-align:right}
.premium-local-section .actions{margin-top:33px}
/* Free Audit remains fully usable, but no longer displaces the homepage proposition */
section.premium-audit-section {padding:0;background:#eeefeb}
.premium-audit-inner {position:relative;display:grid;grid-template-columns:1fr .67fr;min-height:385px;background:#18252b;color:#fff;overflow:hidden;border:1px solid rgba(183,153,96,.22);border-radius:9px}
.premium-audit-copy {padding:66px 66px 62px;position:relative;z-index:2}
.premium-audit-copy .kicker{color:#d7b880}
.premium-audit-copy h2{max-width:710px;font-size:clamp(33px,3.3vw,50px);margin:17px 0}
.premium-audit-copy p{color:#bfcccb;line-height:1.9;max-width:590px;font-size:15px}
.premium-audit-image {background:linear-gradient(90deg,#18252b 0%,rgba(24,37,43,.12) 45%),url('../audit-home-premium.jpg') center right /cover no-repeat;min-height:100%}
.premium-audit-copy .btn.gold {margin-top:20px}
.premium-audit-section .container {padding-top:48px;padding-bottom:48px}
/* Detail, comparison, and pricing pages */
.pricehero,.comparehero,.detailhero {padding:95px 0 66px;background:linear-gradient(118deg,#17252b,#24353c);color:#fff}
.pricehero h1,.comparehero h1,.detailhero h1 {font-size:clamp(50px,6vw,83px);letter-spacing:-.06em;font-weight:650;color:#f7f7f3}
.pricehero p,.comparehero p,.detailhero p,.detailhero .lead {color:#c6d0cf;font-size:17px;line-height:1.8}
.pricehero .eyebrow,.comparehero .eyebrow,.detailhero .eyebrow{color:#d9bd89}
.detailhero .summary {margin-top:36px}
.detailhero .summarybox{background:rgba(255,255,255,.08);color:#f3f5f3;border-color:rgba(255,255,255,.17)}
.detailhero .summarybox h3,.detailhero .summarybox b {color:#f4f1e9}
.detailhero .summarybox p {color:#c4cdcc}
.detailhero .summarybox .btn.dark {background:#d2b37c;color:#14242a;border-color:#d2b37c}
.detailhero .btn.light {color:#fff;border-color:rgba(255,255,255,.32)}
.detailhero .btn.dark {background:#efece3;color:#15232a;border-color:#efece3}
.pricing {gap:12px}.pcard{border-radius:7px;padding:26px 20px;min-height:310px;background:#fff}
.pcard.hot {box-shadow:0 0 0 2px #c8a76f inset;background:#fdfbf6}
.pamt {font-size:25px;letter-spacing:-.04em;color:#162329}.pname{font-size:14px;color:#1b292e}
.pcard li {line-height:1.8}.maintenance{gap:14px}.mcard{border-radius:7px;background:#fff}
/* Legal pages, audit screens, and controls inherit a coherent visual language */
.legal-nav {background:#f7f6f2!important}
.legal-shell {max-width:1050px!important}
.legal-card {border-radius:7px!important;border-color:rgba(22,35,43,.1)!important;background:#fff!important}
.legal-shell h1 {letter-spacing:-.045em}
.mcn-lang-switch {right:23px;bottom:23px;border-radius:4px;background:rgba(19,30,35,.95);border:1px solid rgba(217,185,128,.3);box-shadow:0 15px 42px rgba(0,0,0,.16);padding:4px}
.mcn-lang-switch a {border-radius:3px;letter-spacing:.04em}.mcn-lang-switch a.active{background:#d2b984;color:#13242a}
/* Layout resilience */
@media(max-width:1100px){
 .container{width:min(100% - 64px,1240px)}
 .navin{gap:17px}.links{gap:16px}
 .hero-grid{gap:38px}
 .premium-local-section .premium-local-layout{gap:40px}
 .pricing{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:900px){
 .navin{height:auto;min-height:80px;display:flex;flex-wrap:wrap;padding:4px 0 0;gap:4px;justify-content:space-between}
 .links{display:flex!important;order:3;flex:0 0 100%;min-width:0;overflow-x:auto;white-space:nowrap;padding:11px 0 16px;gap:21px;scrollbar-width:none}
 .links::-webkit-scrollbar{display:none}
 .region-strip{display:flex!important;gap:7px}
 .brand img.mcn-official-mark{height:59px!important;width:102px!important;flex-basis:102px!important;max-width:102px!important}
 header.hero{padding:78px 0 83px;min-height:0}
 .hero-grid,.demo,.premium-local-section .premium-local-layout{grid-template-columns:1fr;gap:40px}
 .premium-audit-inner{grid-template-columns:1fr .45fr}
 .premium-audit-copy{padding:48px 38px}
 .head{gap:30px}
 .offer.featured{transform:none}
 .pricing{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
 .container{width:calc(100% - 36px)}
 .brand img.mcn-official-mark{height:54px!important;width:91px!important;max-width:91px!important;flex-basis:91px!important}
 .region-strip a.nav-contact{font-size:10px;padding:12px 11px}
 .region-strip a.pill{font-size:10px;padding:9px 8px}
 header.hero{padding:67px 0 67px}
 .hero h1{font-size:clamp(59px,12vw,75px);letter-spacing:-.07em}
 .hero p{font-size:15px;line-height:1.83}
 .hero-grid{gap:33px}
 .hero .system {padding:12px;border-radius:7px}
 .hero .row{padding:10px 8px;gap:6px;grid-template-columns:30px minmax(0,1fr) auto}
 .hero .row .icon{height:29px;width:29px;font-size:10px}
 .hero .row b{font-size:11px}.hero .row small{font-size:10px}.hero .row .status{font-size:9px;padding:5px}
 section{padding:74px 0}
 h2{font-size:clamp(35px,9vw,46px)}
 .head{display:block;margin-bottom:31px}.head p{margin-top:18px}
 .card,.engine-card{padding:27px 23px}
 .architecture{padding:30px 23px}.cta{padding:34px 28px}
 .premium-audit-inner{display:block;min-height:0}
 .premium-audit-image{display:none}
 .premium-audit-copy{padding:38px 28px}
 .premium-audit-copy h2{font-size:35px}
 .premium-audit-section .container{padding-top:23px;padding-bottom:23px}
 .premium-local-section .premium-local-layout{gap:29px}
 .premium-local-spec li{gap:8px;align-items:flex-start;font-size:12px}
 .pricing{grid-template-columns:1fr}
 .pricehero,.comparehero,.detailhero{padding:65px 0 48px}
 .pricehero h1,.comparehero h1,.detailhero h1{font-size:clamp(44px,11vw,60px)}
 .mcn-lang-switch{right:10px;bottom:10px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}}
/* Depth-page finishing: dark-on-dark legibility throughout Core / Flow / Command. */
body.mcn-depth-page header.hero {min-height:565px;padding:86px 0 76px}
body.mcn-depth-page header.hero h1 {font-size:clamp(63px,6.2vw,95px)}
body.mcn-depth-page header.hero .chips {margin-top:29px}
body.mcn-depth-page header.hero .chip {background:rgba(205,175,117,.12);border:1px solid rgba(215,183,131,.25);color:#e5cf9f;border-radius:3px;font-size:11px;line-height:1.55;font-weight:600;padding:8px 12px}
body.mcn-depth-page header.hero .depth-map {background:rgba(255,255,255,.065);border:1px solid rgba(237,233,213,.22);color:#f5f3ec;border-radius:8px;padding:31px}
body.mcn-depth-page header.hero .depth-map .kicker {color:#d9bb86}
body.mcn-depth-page header.hero .depth-row {border-bottom-color:rgba(242,235,212,.14)}
body.mcn-depth-page header.hero .depth-row b {color:#f5f3ec}
body.mcn-depth-page header.hero .depth-row span {color:#c2cecd}
body.mcn-depth-page header.hero .depth-row.active {background:rgba(209,181,130,.14);border-radius:4px}
@media(max-width:900px){body.mcn-depth-page header.hero {min-height:0;padding:75px 0}}
@media(max-width:640px){body.mcn-depth-page header.hero{padding:63px 0}body.mcn-depth-page header.hero .depth-map{padding:20px}}
/* Keep inner UI inside dark feature panels genuinely dark (not inherited white cards). */
body.mcn-depth-page header.hero .depth-row {background:transparent;border:0;border-bottom:1px solid rgba(232,226,205,.13);border-radius:0;box-shadow:none}
body.mcn-depth-page header.hero .depth-row.active {background:rgba(211,183,128,.13);border:0;border-radius:4px;box-shadow:none}
.scenario-stage .stage-box {background:rgba(255,255,255,.075);border-color:rgba(255,255,255,.13);box-shadow:none;color:#f1f1ee;border-radius:5px}
.scenario-stage .stage-box b {color:#f4f1eb}
.scenario-stage .stage-box span {color:#c7ceca}