:root {
  --terra:#D97757; --terra-light:#E8956F; --terra-dark:#B85E3F;
  --navy:#0D1B35; --navy-2:#1A3A6B;
  --beige:#FAF6F1; --beige-mid:#F0E8DF; --beige-dark:#E0D5C8;
  --ink:#1E1E2A; --ink-light:#4A4A5A; --ink-muted:#8A8A9A;
  --white:#FFFFFF; --green:#2E7D4F; --green-bg:#E8F5E9;
  --yellow:#E67E22; --yellow-bg:#FFF8E1; --red:#C0392B; --red-bg:#FDEDEC;
  --excel:#217346; --excel-light:#E2EFDA; --excel-grid:#D4D4D4;
  --claude-bg:#FBF6F1; --claude-border:#E8DDD0;
  --blue-bg:#E8F0FE; --purple-bg:#F3E5F5;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Segoe UI',-apple-system,BlinkMacSystemFont,sans-serif;background:var(--beige);color:var(--ink);line-height:1.6}
body.lang-th{font-family:'Sarabun','Noto Sans Thai','Segoe UI',sans-serif}
/* 3-language toggle (EN / TH / Lo). Lao falls back to English where a .lo span is absent. */
body.lang-en .th, body.lang-en .lo{display:none!important}
body.lang-th .en, body.lang-th .lo{display:none!important}
body.lang-lo .en, body.lang-lo .th{display:none!important}
/* Lao fallback: if a parent has no direct .lo child, show its English instead of blank */
body.lang-lo *:not(:has(> .lo)) > .en{display:inline!important}

/* NAV */
.topnav{position:sticky;top:0;z-index:50;min-height:56px;display:flex;align-items:center;gap:12px;padding:10px 24px;background:rgba(13,27,53,.98);color:var(--white);border-bottom:1px solid rgba(255,255,255,.08)}
.brand{font-weight:800;letter-spacing:-.3px;white-space:nowrap;font-size:15px}
.brand span{color:var(--terra-light)}
.nav-links{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.nav-links a{color:rgba(255,255,255,.66);text-decoration:none;font-size:12px;font-weight:600;padding:6px 10px;border-radius:7px;transition:background .2s}
.nav-links a:hover,.nav-links a.active{background:rgba(255,255,255,.09);color:var(--white)}
.lang-switch{display:flex;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:9px;padding:3px}
.lang-btn{border:0;background:transparent;color:rgba(255,255,255,.6);padding:5px 13px;border-radius:6px;font-size:12px;font-weight:800;cursor:pointer;transition:all .2s}
.lang-btn.active{background:var(--terra);color:var(--white)}

/* HERO */
.hero{position:relative;overflow:hidden;text-align:center;color:var(--white);padding:82px 32px 62px;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 54%,#30272D 100%)}
.hero:before{content:"";position:absolute;width:680px;height:680px;border-radius:50%;right:-200px;top:-260px;background:radial-gradient(circle,rgba(217,119,87,.15),transparent 68%)}
.hero>*{position:relative;z-index:1}
.badge{display:inline-block;background:rgba(217,119,87,.18);border:1px solid rgba(217,119,87,.4);color:var(--terra-light);padding:7px 18px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.9px;text-transform:uppercase;margin-bottom:20px}
h1{font-size:42px;line-height:1.12;max-width:960px;margin:0 auto 16px}
h1 .accent,h2 .accent{color:var(--terra-light)}
.hero p.sub{max-width:780px;margin:0 auto 30px;color:rgba(255,255,255,.76);font-size:17px}
.hero-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:10px;padding:12px 22px;text-decoration:none;font-weight:800;font-size:13px;transition:transform .15s,background .2s}
.btn.primary{background:var(--terra);color:var(--white)}
.btn.primary:hover{background:var(--terra-light);transform:translateY(-1px)}
.btn.secondary{color:var(--white);border:1px solid rgba(255,255,255,.24);background:rgba(255,255,255,.07)}
.btn.secondary:hover{background:rgba(255,255,255,.14)}

/* METRIC BAR */
.metric-bar{max-width:1120px;margin:-36px auto 0;position:relative;z-index:2;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden;border-radius:16px;box-shadow:0 10px 32px rgba(0,0,0,.12)}
.metric{background:var(--white);padding:26px 16px;text-align:center;border-right:1px solid var(--beige-mid)}
.metric:last-child{border-right:0}
.metric .num{color:var(--terra);font-size:32px;font-weight:900;line-height:1}
.metric .lbl{margin-top:6px;color:var(--ink-muted);font-size:11px;text-transform:uppercase;font-weight:800;letter-spacing:.6px}

/* SECTION */
.section{max-width:1180px;margin:0 auto;padding:70px 28px}
.section-header{text-align:center;margin-bottom:36px}
.eyebrow{color:var(--terra);font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:1.3px;margin-bottom:8px}
h2{font-size:32px;line-height:1.2;margin-bottom:10px}
.section-header p{color:var(--ink-light);max-width:740px;margin:0 auto;font-size:16px}

/* GRID */
.grid{display:grid;gap:16px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
.grid.cols-4{grid-template-columns:repeat(4,1fr)}

/* CARD */
.card{background:var(--white);border:1px solid var(--beige-dark);border-radius:16px;padding:20px;box-shadow:0 3px 12px rgba(0,0,0,.04);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.08)}
.card h3{font-size:17px;margin-bottom:6px}
.card p,.card li{color:var(--ink-light);font-size:13px}
.card ul{margin:8px 0 0 16px}
.pill{display:inline-flex;border-radius:999px;background:#F9E6DD;color:var(--terra-dark);border:1px solid #F1C8B9;padding:4px 10px;font-size:11px;font-weight:900;margin-bottom:8px}

/* DEMO BLOCK */
.demo{margin-bottom:48px;border-radius:20px;overflow:hidden;border:1px solid var(--beige-dark);background:var(--white);box-shadow:0 4px 18px rgba(0,0,0,.05)}
.demo-head{display:flex;align-items:center;gap:14px;padding:18px 22px;background:linear-gradient(135deg,var(--navy),var(--navy-2));color:var(--white)}
.demo-num{width:38px;height:38px;min-width:38px;border-radius:50%;background:var(--terra);display:flex;align-items:center;justify-content:center;font-weight:900;font-size:15px}
.demo-title{flex:1}
.demo-title h3{font-size:18px;margin:0;color:var(--white)}
.demo-title .dept{font-size:11px;color:var(--terra-light);font-weight:700;text-transform:uppercase;letter-spacing:.8px}
.time-pill{display:inline-flex;align-items:center;gap:5px;background:rgba(46,125,79,.15);border:1px solid rgba(46,125,79,.3);color:#6FCF97;padding:5px 12px;border-radius:999px;font-size:11px;font-weight:800;white-space:nowrap}

.demo-body{display:grid;grid-template-columns:1fr 1fr;gap:0}
.demo-body.full-width{grid-template-columns:1fr}

/* BEFORE / AFTER */
.panel{padding:20px}
.panel-label{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.8px;margin-bottom:12px;padding:4px 10px;border-radius:6px}
.panel-label.before{background:var(--red-bg);color:var(--red)}
.panel-label.after{background:var(--green-bg);color:var(--green)}
.panel-desc{font-size:13px;color:var(--ink-light);margin-bottom:14px}

/* EXCEL MOCKUP */
.excel-window{border:1px solid var(--excel-grid);border-radius:10px;overflow:hidden;background:var(--white)}
.excel-bar{display:flex;align-items:center;gap:8px;padding:7px 12px;background:#F2F2F2;border-bottom:1px solid #DDD;font-size:11px;color:var(--ink-muted)}
.excel-bar .dot{width:9px;height:9px;border-radius:50%}
.excel-bar .dot.r{background:#FF5F57}.excel-bar .dot.y{background:#FFBD2E}.excel-bar .dot.g{background:#28C840}
.excel-bar .filename{margin-left:8px;font-weight:700;color:var(--excel)}
.excel-table{width:100%;border-collapse:collapse;font-size:11.5px}
.excel-table th{background:var(--excel-light);color:#143826;font-weight:700;padding:7px 8px;border:1px solid var(--excel-grid);text-align:left;white-space:nowrap}
.excel-table td{padding:6px 8px;border:1px solid var(--excel-grid);vertical-align:top}
.excel-table tr:nth-child(even){background:#FAFAFA}
.cell-warn{background:#FFF3CD;color:#856404}
.cell-danger{background:#F8D7DA;color:#721C24}
.cell-good{background:#D4EDDA;color:#155724}

/* CLAUDE CHAT */
.claude-panel{background:var(--claude-bg);border-left:1px solid var(--claude-border);padding:20px}
.claude-header{display:flex;align-items:center;gap:8px;margin-bottom:14px}
.claude-avatar{width:28px;height:28px;border-radius:8px;background:var(--terra);display:flex;align-items:center;justify-content:center;color:var(--white);font-weight:900;font-size:12px}
.claude-name{font-weight:800;font-size:13px;color:var(--terra-dark)}
.claude-msg{font-size:12.5px;color:var(--ink-light);line-height:1.7}
.claude-msg b{color:var(--ink);font-weight:700}
.claude-msg .finding{display:block;padding:6px 10px;margin:6px 0;border-radius:8px;border-left:3px solid var(--terra)}
.claude-msg .finding.red{border-left-color:var(--red);background:var(--red-bg)}
.claude-msg .finding.yellow{border-left-color:var(--yellow);background:var(--yellow-bg)}
.claude-msg .finding.green{border-left-color:var(--green);background:var(--green-bg)}
.claude-msg .action-list{margin:10px 0 0 14px;font-size:12px}
.claude-msg .action-list li{margin-bottom:5px}

/* PROMPT KIT */
.prompt-kit{padding:20px 22px;border-top:1px solid var(--beige-mid);background:#FFFCF9}
.prompt-kit-label{font-size:12px;font-weight:900;color:var(--terra-dark);text-transform:uppercase;letter-spacing:.8px;margin-bottom:10px}
.prompt-box{background:#FFF7F2;border:1px solid #EEDCCF;border-radius:10px;overflow:hidden}
.prompt-box .p-head{background:#F5E6DC;color:var(--terra-dark);padding:8px 12px;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.7px;display:flex;justify-content:space-between;align-items:center}
.prompt-box .p-body{padding:12px;font-family:Consolas,'Courier New',monospace;font-size:12px;color:#5A3B2E;white-space:pre-wrap;line-height:1.6}
.prompt-box .p-rules{padding:10px 12px;border-top:1px solid #EEDCCF;font-size:11px;color:var(--ink-muted)}
.prompt-box .p-rules b{color:var(--red)}
.copy-btn{background:var(--terra);color:var(--white);border:0;padding:4px 10px;border-radius:5px;font-size:10px;font-weight:800;cursor:pointer}
.copy-btn:hover{background:var(--terra-light)}

/* STATUS */
.status{display:inline-flex;align-items:center;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:900;white-space:nowrap}
.status.green{background:var(--green-bg);color:var(--green)}
.status.yellow{background:var(--yellow-bg);color:var(--yellow)}
.status.red{background:var(--red-bg);color:var(--red)}

/* CTA */
.cta{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:var(--white);text-align:center;padding:70px 28px}
.cta p{color:rgba(255,255,255,.72);max-width:700px;margin:0 auto 22px}
.footer{text-align:center;color:var(--ink-muted);padding:24px;font-size:12px}

/* PLATFORM PANEL — "Run it on web.ldcbi.com" (ldc-ai-mvp platform layer) */
.platform-panel{border-top:2px solid #109040;background:#F3FAF5;padding:18px 22px}
.pp-head{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px}
.pp-logo{display:inline-flex;align-items:center;gap:7px;font-weight:900;font-size:12px;color:#0B6E30}
.pp-logo .dot{width:18px;height:18px;border-radius:5px;background:#109040;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px}
.pp-assistant{font-size:11px;font-weight:800;color:#0B6E30;background:#DCF1E4;border:1px solid #B6E0C6;border-radius:999px;padding:3px 10px}
.pp-tier{font-size:10.5px;font-weight:900;letter-spacing:.4px;border-radius:999px;padding:3px 10px;text-transform:uppercase}
.pp-tier.t1{background:#E8F0FE;color:#1A56C4;border:1px solid #B9CEF5}
.pp-tier.t2{background:#E8F5E9;color:#2E7D4F;border:1px solid #B6E0C6}
.pp-tier.t3{background:#FFF3CD;color:#856404;border:1px solid #F0DDA0}
.pp-tier.t4{background:#FDEDEC;color:#B23A2E;border:1px solid #F2C4BD}
.pp-rows{display:grid;gap:8px}
.pp-row{display:grid;grid-template-columns:148px 1fr;gap:10px;font-size:12.5px;align-items:start}
.pp-row .pp-k{font-weight:800;color:#0B6E30;font-size:11px;text-transform:uppercase;letter-spacing:.4px;padding-top:2px}
.pp-row .pp-v{color:var(--ink-light)}
.pp-row .pp-v b{color:var(--ink)}
.pp-prompt{margin-top:4px;background:#fff;border:1px solid #C9E6D5;border-radius:9px;overflow:hidden}
.pp-prompt .pp-phead{background:#E4F4EA;color:#0B6E30;padding:7px 12px;font-size:10.5px;font-weight:900;text-transform:uppercase;letter-spacing:.6px;display:flex;justify-content:space-between;align-items:center}
.pp-prompt .pp-pbody{padding:11px 12px;font-family:Consolas,'Courier New',monospace;font-size:11.5px;color:#244031;white-space:pre-wrap;line-height:1.6}
.pp-prompt .copy-btn{background:#109040}
.pp-prompt .copy-btn:hover{background:#15a850}
.pp-note{margin-top:10px;font-size:10.5px;color:var(--ink-muted)}
.pp-verify{color:#0B6E30}
@media(max-width:920px){.pp-row{grid-template-columns:1fr}.pp-row .pp-k{padding-top:0}}

/* RESPONSIVE */
@media(max-width:920px){
  h1{font-size:30px}
  .metric-bar{grid-template-columns:repeat(2,1fr);margin:0 16px}
  .grid.cols-2,.grid.cols-3,.grid.cols-4{grid-template-columns:1fr}
  .demo-body{grid-template-columns:1fr}
  .claude-panel{border-left:0;border-top:1px solid var(--claude-border)}
  .topnav{flex-wrap:wrap}
  .nav-links{order:3;width:100%}
}
