/* Kanza design system — shared token + component layer.
   Generated from redesign/kanza-home.html; edit there and rebuild. */
/* ============================================================
         KANZA DESIGN SYSTEM — institutional terminal × Kanza identity
         Buildless token layer. KCP. mark · Kanza Capital Partners name.
         ============================================================ */
      :root{
        --bg:#F5F0E5; --paper:#FBF8F1; --card:#FCFAF4; --ink:#211C18; --ink-2:#2C2620;
        --oxblood:#8C2A2A; --oxblood-d:#6E2020;
        --soft:#5C554C; --muted:#6B6358;
        --hair:#D8CEBC; --hair-d:#211C18; --tint:#EFE7D7;
        --up:#0A6E5C; --down:#8C2A2A; --gold:#A87C12;
        --on-dark:#F5F0E5; --on-dark-soft:#C9C2B6; --on-dark-line:#4A443D;
        --up-dark:#1FAE8E; --down-dark:#E3B0A8;
        --ff-display:"Playfair Display",Georgia,serif;
        --ff-body:"Source Serif 4",Georgia,"Times New Roman",serif;
        --ff-ui:"Inter",system-ui,sans-serif;
        --wrap:1120px; --r-sm:3px; --r-md:4px; --r-lg:8px;
        --shadow-card:0 1px 3px rgba(33,28,24,.05);
        --shadow-pop:0 14px 26px rgba(33,28,24,.10);
        color-scheme:light;
      }
      *{box-sizing:border-box}
      html{scroll-behavior:smooth}
      body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ff-body);font-size:17px;
        line-height:1.6;-webkit-font-smoothing:antialiased;display:flex;flex-direction:column;min-height:100vh}
      .wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px;width:100%}
      @media(min-width:768px){.wrap{padding:0 24px}}
      a{color:var(--oxblood);text-decoration:none} a:hover{text-decoration:underline}
      .ui{font-family:var(--ff-ui)} .serif{font-family:var(--ff-display)} .num{font-variant-numeric:tabular-nums}
      :focus-visible{outline:2px solid var(--oxblood);outline-offset:2px;border-radius:2px}
      .label{font-family:var(--ff-ui);font-size:10px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
      .up{color:var(--up)} .dn{color:var(--down)} .flat{color:var(--muted)}
      /* ---- macro ticker (ink band) ---- */
      .macro{background:var(--ink);color:var(--on-dark-soft);font-family:var(--ff-ui);font-size:12px;font-weight:500;
        border-bottom:1px solid var(--ink-2);overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none}
      .macro::-webkit-scrollbar{display:none}
      .macro .row{display:flex;align-items:center;gap:24px;white-space:nowrap;padding:9px 16px;max-width:var(--wrap);margin:0 auto}
      .macro .m{display:flex;align-items:center;gap:6px}
      .macro .k{color:var(--muted)} .macro .v{color:var(--on-dark);font-weight:600}
      .macro .u{color:var(--up-dark)} .macro .d{color:var(--down-dark)}
      .macro .clock{margin-left:auto;color:var(--muted);display:flex;align-items:center;gap:6px}
      /* ---- header / nav ---- */
      .head{background:var(--bg);border-bottom:1.5px solid var(--hair-d);position:sticky;top:0;z-index:50}
      .head .row{display:flex;align-items:center;justify-content:space-between;height:64px}
      .brand{display:flex;align-items:center;gap:28px}
      .mark{font-family:var(--ff-display);font-weight:800;font-size:21px;letter-spacing:-.02em;color:var(--ink)}
      .mark b{color:var(--oxblood)}
      .nav{display:none;align-items:center;gap:24px}
      .nav a{font-family:var(--ff-ui);font-size:13.5px;font-weight:500;color:var(--soft);padding:21px 0}
      .nav a:hover{color:var(--ink);text-decoration:none}
      .nav a.on{color:var(--ink);box-shadow:inset 0 -2px 0 var(--oxblood)}
      .actions{display:flex;align-items:center;gap:10px}
      .login{display:none;font-family:var(--ff-ui);font-size:13px;font-weight:500;color:var(--soft);padding:8px 4px}
      .login:hover{color:var(--ink);text-decoration:none}
      .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-family:var(--ff-ui);font-size:13px;
        font-weight:600;letter-spacing:.02em;background:var(--oxblood);color:#fff;padding:9px 18px;border-radius:var(--r-sm);
        border:1px solid var(--oxblood);min-height:40px;cursor:pointer;transition:.14s}
      .btn:hover{background:var(--oxblood-d);color:#fff;text-decoration:none}
      .btn.ghost{background:transparent;color:var(--oxblood)} .btn.ghost:hover{background:var(--oxblood);color:#fff}
      .btn.lg{min-height:46px;padding:12px 22px;font-size:13.5px}
      .btn.block{width:100%}
      .btn.light{background:var(--on-dark);color:var(--ink);border-color:var(--on-dark)}
      .btn.light:hover{background:#fff;color:var(--ink)}
      .toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--hair);
        border-radius:var(--r-md);background:transparent;cursor:pointer;color:var(--ink);font-size:20px}
      .langtoggle{font-family:var(--ff-ui);font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--soft);background:transparent;
        border:1px solid var(--hair);border-radius:20px;padding:0 12px;min-height:40px;cursor:pointer}
      .langtoggle b{color:var(--oxblood)}
      .langtoggle:hover{border-color:var(--oxblood);color:var(--ink)}
      @media(min-width:768px){.nav{display:flex} .login{display:inline-block} .toggle{display:none}}
      .mobnav{display:none;border-bottom:1.5px solid var(--hair-d);background:var(--bg);box-shadow:var(--shadow-pop)}
      .mobnav.open{display:block}
      .mobnav a{display:block;font-family:var(--ff-ui);font-size:15px;color:var(--soft);padding:13px 0;border-bottom:1px solid var(--hair)}
      /* ---- main grid (lead + data rail) ---- */
      main{flex:1 0 auto}
      .grid12{display:grid;grid-template-columns:1fr;gap:36px;padding:32px 0}
      @media(min-width:1024px){.grid12{grid-template-columns:8fr 4fr;gap:40px;padding:40px 0}}
      .col-main{display:flex;flex-direction:column;gap:40px;min-width:0}
      .rail{display:flex;flex-direction:column;gap:28px;min-width:0}
      /* hero lead */
      .hero{border-bottom:1px solid var(--hair);padding-bottom:30px}
      .hero h1{font-family:var(--ff-display);font-weight:800;font-size:clamp(33px,5vw,50px);line-height:1.06;
        letter-spacing:-.02em;margin:0 0 14px;max-width:18ch}
      .hero p.sub{font-size:18px;line-height:1.6;color:var(--soft);max-width:60ch;margin:0 0 20px}
      .hero .cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
      .hero .link{font-family:var(--ff-ui);font-size:13.5px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:5px}
      .hero .link:hover{color:var(--oxblood);text-decoration:none}
      .notadv{display:inline-flex;align-items:center;gap:6px;margin-top:22px;font-family:var(--ff-ui);font-size:10.5px;
        font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--hair);
        border-radius:var(--r-sm);padding:6px 10px}
      /* lead analysis + tags */
      .tagrow{display:flex;align-items:center;gap:8px;font-family:var(--ff-ui);font-size:12px;color:var(--muted);margin-bottom:6px}
      .tag{background:var(--tint);color:var(--oxblood);font-weight:600;padding:3px 9px;border-radius:var(--r-sm);font-size:11px;letter-spacing:.03em}
      .lead-an h2{font-family:var(--ff-display);font-weight:700;font-size:clamp(22px,3vw,30px);line-height:1.14;letter-spacing:-.01em;margin:4px 0 10px}
      .lead-an p{font-size:16.5px;color:var(--soft);max-width:62ch;margin:0 0 14px}
      .readmore{font-family:var(--ff-ui);font-size:13.5px;font-weight:600;color:var(--ink);display:inline-flex;align-items:center;gap:5px}
      .readmore:hover{color:var(--oxblood);text-decoration:none}
      hr.rule{border:0;border-top:1px solid var(--hair);margin:0}
      /* feed */
      .feedhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
      .feedhead h2{font-family:var(--ff-display);font-weight:700;font-size:21px;margin:0;letter-spacing:-.01em}
      .feed{border-left:2px solid var(--hair);padding-left:20px;display:flex;flex-direction:column;gap:22px}
      .item{display:grid;grid-template-columns:1fr;gap:4px;cursor:pointer}
      @media(min-width:600px){.item{grid-template-columns:120px 1fr;gap:16px}}
      .item .when{font-family:var(--ff-ui);font-size:12px;color:var(--muted)}
      .item h3{font-family:var(--ff-display);font-weight:700;font-size:18px;line-height:1.22;margin:0 0 3px;letter-spacing:-.005em}
      .item:hover h3{color:var(--oxblood)}
      .item p{font-family:var(--ff-body);font-size:14.5px;color:var(--soft);margin:0}
      /* ---- data widget (DSE table) ---- */
      .widget{background:var(--paper);border:1px solid var(--hair);border-radius:var(--r-lg);overflow:hidden}
      .widget .wh{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-bottom:1px solid var(--hair);background:var(--card)}
      .widget .wh h3{font-family:var(--ff-ui);font-weight:600;font-size:13.5px;margin:0;color:var(--ink)}
      .widget .wh .src{font-family:var(--ff-ui);font-size:10px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--muted);margin-top:2px}
      table.dse{width:100%;border-collapse:collapse;font-family:var(--ff-ui)}
      table.dse thead th{font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);
        text-align:left;padding:8px 16px;background:var(--card);border-bottom:1px solid var(--hair)}
      table.dse th.r,table.dse td.r{text-align:right;font-variant-numeric:tabular-nums}
      table.dse tbody tr{border-bottom:1px solid var(--hair);cursor:pointer}
      table.dse tbody tr:last-child{border-bottom:0}
      table.dse tbody tr:hover{background:#F2EADB}
      table.dse td{font-size:13.5px;padding:11px 16px;color:var(--soft)}
      table.dse td.tk{font-weight:600;color:var(--ink)}
      table.dse td.d{font-weight:600}
      .widget .wf{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;background:var(--card);border-top:1px solid var(--hair)}
      .widget .wf .ill{font-family:var(--ff-ui);font-size:10px;color:var(--muted)}
      .widget .wf a{font-family:var(--ff-ui);font-size:12px;font-weight:600;color:var(--soft)}
      .widget .wf a:hover{color:var(--oxblood);text-decoration:none}
      /* free on-ramp card */
      .freecard{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:18px}
      .freecard h3{font-family:var(--ff-display);font-weight:700;font-size:18px;margin:0 0 4px}
      .freecard p{font-size:13.5px;color:var(--soft);margin:0 0 12px}
      .field{display:flex;gap:8px}
      .field input{flex:1;min-width:0;font-family:var(--ff-ui);font-size:13.5px;color:var(--ink);background:#fff;
        border:1px solid var(--hair);border-radius:var(--r-sm);padding:10px 12px;min-height:42px}
      .field input::placeholder{color:var(--muted)}
      .field input:focus-visible{border-color:var(--oxblood);outline:2px solid var(--oxblood);outline-offset:1px}
      /* ---- institutional Pro card (ink) ---- */
      .procard{position:relative;overflow:hidden;background:var(--ink);color:var(--on-dark);border-radius:var(--r-lg);padding:24px}
      .procard .ring{position:absolute;border:1px solid var(--on-dark-line);border-radius:50%;opacity:.5}
      .procard .r1{width:130px;height:130px;right:-40px;top:-40px}
      .procard .r2{width:96px;height:96px;right:40px;bottom:-40px}
      .procard .body{position:relative;z-index:1}
      .procard .glyph{font-family:var(--ff-ui);font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--down-dark);text-transform:uppercase}
      .procard h3{font-family:var(--ff-display);font-weight:700;font-size:20px;margin:8px 0 8px}
      .procard p{font-size:13px;color:var(--on-dark-soft);margin:0 0 16px;line-height:1.55}
      .procard input{width:100%;font-family:var(--ff-ui);font-size:13.5px;color:#fff;background:var(--ink-2);
        border:1px solid var(--on-dark-line);border-radius:var(--r-sm);padding:11px 12px;min-height:44px;margin-bottom:10px}
      .procard input::placeholder{color:var(--muted)}
      .procard input:focus-visible{border-color:var(--down-dark);outline:2px solid var(--down-dark);outline-offset:1px}
      /* ---- footer ---- */
      .foot{flex-shrink:0;background:var(--paper);border-top:1.5px solid var(--hair-d);margin-top:24px}
      .foot .top{display:grid;grid-template-columns:1fr;gap:28px;padding:44px 0 36px}
      @media(min-width:768px){.foot .top{grid-template-columns:2fr 1fr 1fr}}
      .foot .mark{display:block;margin-bottom:10px}
      .foot .about{font-size:13px;color:var(--soft);max-width:42ch;line-height:1.6}
      .foot h4{font-family:var(--ff-ui);font-size:12px;font-weight:700;color:var(--ink);margin:0 0 12px;letter-spacing:.02em}
      .foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
      .foot ul a{font-family:var(--ff-ui);font-size:13px;color:var(--soft)} .foot ul a:hover{color:var(--oxblood);text-decoration:none}
      .disclosure{border-top:1px solid var(--hair);padding:28px 0 44px;display:flex;flex-direction:column;gap:14px}
      .disclosure .h{font-family:var(--ff-ui);font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
      .disclosure p{font-size:12.5px;color:var(--soft);line-height:1.65;margin:0;max-width:none}
      .disclosure .bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:6px;
        font-family:var(--ff-ui);font-size:12px;color:var(--muted)}
      .disclosure .bottom a{color:var(--soft);margin-left:16px} .disclosure .bottom a:hover{color:var(--oxblood)}