
:root{--bg:#020b15;--panel:#091b2b;--panel2:#0c2133;--gold:#e7b52d;--white:#f5f7fa;--muted:#9ec1df;--line:#183246}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,Helvetica,sans-serif}
.nav{height:88px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #172431;background:#020a13;position:sticky;top:0;z-index:5}
.brand{display:flex;gap:12px;align-items:center;color:white;text-decoration:none}.mark{width:44px;height:44px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-family:Georgia;font-size:25px}.brand b{display:block;color:#efc552;letter-spacing:2px}.brand small{display:block;font-size:9px;letter-spacing:3px;margin-top:5px}
nav{display:flex;gap:28px}nav a{color:#d5dbe1;text-decoration:none;font-size:14px;padding:34px 0 27px;border-bottom:2px solid transparent}nav a:hover,nav a.active{color:var(--gold);border-bottom-color:var(--gold)}
main{max-width:1500px;margin:auto;padding:70px 4%}.eyebrow{color:var(--gold);font-size:13px;font-weight:700;letter-spacing:3px;margin-bottom:20px}
.hero{max-width:1100px;margin-bottom:55px}.hero h1{font-family:Georgia,serif;font-size:66px;line-height:1.03;margin:0 0 24px;font-weight:500}.hero p{font-size:20px;line-height:1.6;color:var(--muted);max-width:850px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{min-height:280px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:32px;color:white;text-decoration:none;transition:.22s ease;display:flex;flex-direction:column}
.card:hover{transform:translateY(-5px);background:var(--panel2);border-color:rgba(113,148,180,.52);box-shadow:0 12px 35px rgba(0,0,0,.28)}.card.priority{border-color:rgba(113,148,180,.46);box-shadow:inset 3px 0 0 rgba(240,196,84,.72)}
.num{color:var(--gold);font-size:12px;font-weight:700}.card h2{font-size:25px;margin:32px 0 16px}.card p{color:var(--muted);font-size:16px;line-height:1.55;margin:0 0 28px}.cta{margin-top:auto;color:var(--gold);font-size:12px;font-weight:700}
.reference{margin-top:70px;padding:42px;border:1px solid #6c5920;border-radius:18px;background:#071725;display:grid;grid-template-columns:1.1fr 1fr;gap:60px}.reference h2{font-size:38px;line-height:1.15;margin:0 0 18px}.reference p{color:var(--muted);line-height:1.6}.reference-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.reference-grid div{border:1px solid var(--line);border-radius:12px;padding:22px;display:flex;gap:14px;align-items:center}.reference-grid b{color:var(--gold);font-size:12px}.reference-grid span{font-size:15px}
.notice{margin-top:28px;border:1px solid #6a3b3b;background:#1b1014;border-radius:14px;padding:22px 26px;display:flex;gap:30px;align-items:center}.notice strong{color:#efb6b6;letter-spacing:2px;font-size:12px;white-space:nowrap}.notice span{color:#d7c5c7;line-height:1.5}
footer{border-top:1px solid #172431;padding:30px 5%;color:#71889b;font-size:12px;letter-spacing:1px}
@media(max-width:1000px){nav{display:none}.grid{grid-template-columns:1fr 1fr}.reference{grid-template-columns:1fr}.hero h1{font-size:50px}}
@media(max-width:650px){.grid{grid-template-columns:1fr}.hero h1{font-size:40px}.reference-grid{grid-template-columns:1fr}.notice{align-items:flex-start;flex-direction:column;gap:10px}}

/* V1.1 — active Knowledge capabilities + Verify Resource Center */
.reference-grid a{
  border:1px solid var(--line);
  border-radius:12px;
  padding:22px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  text-decoration:none;
  color:var(--white);
  background:#081725;
  transition:.22s ease;
}
.reference-grid a:hover{
  transform:translateY(-4px);
  border-color:rgba(113,148,180,.52);
  background:#0c2133;
}
.reference-grid a b{color:var(--gold);font-size:12px}
.reference-grid a i{font-style:normal;color:var(--gold);opacity:.65}
.resource-section{margin-top:70px;padding:42px;border:1px solid #183246;border-radius:18px;background:#061421}
.resource-section.alt{background:#071725}
.section-head{max-width:980px;margin-bottom:28px}
.section-head h2{font-size:40px;line-height:1.12;margin:0 0 16px}
.section-head p{color:var(--muted);line-height:1.6}
.doc-grid,.source-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.doc-card{min-height:190px;padding:22px;border:1px solid var(--line);border-radius:12px;background:#081725;transition:.22s;color:var(--white);text-decoration:none}
.doc-card:hover{border-color:rgba(113,148,180,.52);transform:translateY(-3px)}
.doc-card>span{font-size:9px;font-weight:800;letter-spacing:.14em;color:var(--gold)}
.doc-card h3{font-size:18px;margin:18px 0 10px}.doc-card p{font-size:13px;color:var(--muted);line-height:1.5}.doc-card b{font-size:10px;color:var(--gold)}
.glossary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.glossary-grid div{padding:18px;border:1px solid var(--line);border-radius:10px;background:#081725}.glossary-grid b{display:block;color:var(--gold);margin-bottom:6px}.glossary-grid span{font-size:13px;color:var(--muted)}
.verify-group{margin-top:30px}.verify-group h3{font-size:18px;margin:0 0 14px;color:#f4f6f8}
.source-grid{grid-template-columns:repeat(3,1fr)}
.source-grid a{min-height:145px;padding:20px;border:1px solid var(--line);border-radius:12px;background:#081725;text-decoration:none;color:var(--white);display:flex;flex-direction:column;transition:.22s}
.source-grid a:hover{border-color:rgba(113,148,180,.52);transform:translateY(-3px);background:#0c2133}
.source-grid b{font-size:16px}.source-grid span{font-size:12px;color:var(--muted);margin-top:7px}.source-grid i{font-style:normal;color:var(--gold);font-size:9px;font-weight:800;margin-top:auto;padding-top:14px}
.external-warning{margin-top:28px;border:1px solid #6a3b3b;background:#1b1014;border-radius:12px;padding:20px 22px;display:flex;gap:24px;align-items:flex-start}.external-warning strong{color:#efb6b6;font-size:10px;letter-spacing:.14em;white-space:nowrap}.external-warning span{color:#d7c5c7;font-size:12px;line-height:1.5}
@media(max-width:1100px){.doc-grid{grid-template-columns:repeat(2,1fr)}.source-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.doc-grid,.source-grid,.glossary-grid{grid-template-columns:1fr}.external-warning{flex-direction:column;gap:8px}}

/* V1.2 — International Trade & Commodity Transaction Mechanics */
.reference-grid .wide-capability{grid-column:1/-1}
.trade-mechanics{border-color:rgba(231,181,45,.32)}
.five-flows{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:28px 0 34px}
.five-flows div{padding:17px;border:1px solid var(--line);border-radius:11px;background:#081725;transition:.22s}
.five-flows div:hover{border-color:rgba(113,148,180,.52);transform:translateY(-3px)}
.five-flows b{display:block;color:var(--gold);font-size:9px;margin-bottom:12px}
.five-flows strong{display:block;font-size:11px;margin-bottom:7px}.five-flows span{font-size:10px;color:var(--muted)}
.mechanics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mechanics-grid a{min-height:170px;padding:20px;border:1px solid var(--line);border-radius:12px;background:#081725;text-decoration:none;color:var(--white);display:flex;flex-direction:column;transition:.22s}
.mechanics-grid a:hover{border-color:rgba(113,148,180,.52);transform:translateY(-4px);background:#0c2133}
.mechanics-grid a.gold-path{border-color:rgba(113,148,180,.46);box-shadow:inset 3px 0 0 rgba(240,196,84,.72)}
.mechanics-grid b{color:var(--gold);font-size:9px}.mechanics-grid strong{font-size:16px;margin:16px 0 7px}.mechanics-grid span{font-size:12px;color:var(--muted);line-height:1.45}.mechanics-grid i{font-style:normal;color:var(--gold);font-size:9px;font-weight:800;margin-top:auto;padding-top:12px}
.mechanics-detail,.two-docs,.risk-callout,.gold-module{margin-top:28px;border:1px solid var(--line);border-radius:14px;padding:24px;background:#081725}
.detail-label{display:block;color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.14em;margin-bottom:18px}
.contract-chain,.execution-chain,.gold-chain{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.contract-chain span,.execution-chain span,.gold-chain span{padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:#061421;font-size:9px;font-weight:800}
.contract-chain i,.execution-chain i,.gold-chain i{font-style:normal;color:var(--gold)}
.incoterm-grid,.gold-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.incoterm-grid div,.gold-grid div{padding:17px;border:1px solid var(--line);border-radius:10px;background:#061421}
.incoterm-grid b,.gold-grid b{display:block;color:var(--gold);margin-bottom:7px;font-size:11px}
.incoterm-grid span,.gold-grid span{font-size:11px;color:var(--muted);line-height:1.45}
.micro-note{font-size:11px;color:var(--muted);margin:18px 0 0}
.two-docs{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.two-docs>div{padding:18px;border:1px solid var(--line);border-radius:10px;background:#061421}
.two-docs ul{margin:0;padding-left:18px;color:var(--muted);font-size:12px;line-height:1.7}
.risk-callout{border-color:#6a3b3b;background:#1b1014;display:flex;gap:20px;align-items:flex-start}
.risk-callout strong{color:#efb6b6;font-size:10px;letter-spacing:.13em;white-space:nowrap}
.risk-callout span{font-size:12px;color:#d7c5c7}
.gold-module{border-color:rgba(231,181,45,.38);background:linear-gradient(180deg,#091b2b,#071725)}
.gold-module .section-head{margin-bottom:20px}.gold-module .section-head h2{font-size:32px}
.gold-chain{margin-bottom:20px}.gold-grid{margin-top:20px}
.source-link{margin-top:18px;text-align:right}.source-link a{font-size:10px;color:var(--gold);text-decoration:none;font-weight:800}
@media(max-width:1100px){.five-flows{grid-template-columns:repeat(2,1fr)}.mechanics-grid{grid-template-columns:repeat(2,1fr)}.incoterm-grid,.gold-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.five-flows,.mechanics-grid,.incoterm-grid,.gold-grid,.two-docs{grid-template-columns:1fr}.risk-callout{flex-direction:column;gap:8px}}

/* V2.4 glossary compact UI */
.glossary-tools{display:grid;gap:14px;margin:22px 0}.glossary-tools input{width:100%;box-sizing:border-box;padding:13px 15px;border:1px solid rgba(145,164,185,.28);border-radius:7px;background:#071625;color:#eef3f7}.glossary-tabs{display:flex;gap:8px;flex-wrap:wrap}.glossary-tabs button{border:1px solid rgba(145,164,185,.3);background:#0b1d2e;color:#aebdca;border-radius:999px;padding:9px 12px;font-size:9px;font-weight:800;letter-spacing:.06em;cursor:pointer}.glossary-tabs button.active{color:#d6b865;border-color:rgba(200,167,93,.55);background:rgba(200,167,93,.07)}.glossary-accordion{display:grid;grid-template-columns:1fr 1fr;gap:10px}.glossary-accordion details{border:1px solid rgba(145,164,185,.24);border-radius:8px;background:linear-gradient(180deg,rgba(23,45,65,.58),rgba(6,19,31,.92));overflow:hidden}.glossary-accordion summary{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;padding:15px;cursor:pointer;list-style:none}.glossary-accordion summary::-webkit-details-marker{display:none}.glossary-accordion summary b{color:#d6b865}.glossary-accordion summary span{color:#dbe3ea;font-size:12px}.glossary-accordion details p{margin:0;padding:0 15px 16px;color:#aab7c4;font-size:12px;line-height:1.65}.glossary-accordion details[open]{border-color:rgba(145,164,185,.45)}@media(max-width:780px){.glossary-accordion{grid-template-columns:1fr}.glossary-accordion summary{grid-template-columns:90px 1fr}}
