:root{
  --ink:#1f2d54;
  --brand:#39388d;
  --muted:#667085;
  --line:#e7e9f0;
  --bg:#f6f7fb;
  --white:#fff;
  --soft:#f0f1fa;
  --ok:#13795b;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;color:var(--ink);background:var(--bg)}
.topline{height:5px;background:linear-gradient(90deg,var(--brand),#675dc9)}
.header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:white;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:12px}.brandmark{width:42px;height:42px;border-radius:11px;background:var(--brand);color:white;display:grid;place-items:center;font-weight:900;letter-spacing:-1px}
.brandname{font-size:19px;font-weight:850;letter-spacing:-.4px}.brandsub{font-size:12px;color:var(--muted);margin-top:2px}.badge{font-size:11px;font-weight:800;letter-spacing:.12em;background:var(--soft);padding:9px 12px;border-radius:99px;color:var(--brand)}
main{max-width:1240px;margin:auto;padding:44px 28px 50px}
.hero{display:grid;grid-template-columns:1.6fr .65fr;gap:34px;align-items:stretch;margin-bottom:34px}
.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:900;color:var(--brand);margin-bottom:12px}
h1{font-size:50px;line-height:1.03;letter-spacing:-2.3px;margin:0 0 18px}h1 span{color:var(--brand)}
.hero p{font-size:18px;line-height:1.55;color:var(--muted);max-width:770px;margin:0}
.hero-card{background:var(--ink);color:white;border-radius:20px;padding:24px;display:flex;flex-direction:column;justify-content:center;min-height:200px}
.hero-card-title{text-transform:uppercase;font-size:11px;letter-spacing:.15em;opacity:.7;font-weight:800}.big{font-size:52px;font-weight:900;letter-spacing:-2px;margin:3px 0}
.rates{display:flex;gap:9px;align-items:center;font-size:15px}.rates span{opacity:.45}.hero-card small{opacity:.65;margin-top:14px;line-height:1.4}
.tabs{display:flex;gap:8px;margin-bottom:14px}.tab{border:1px solid var(--line);background:white;border-radius:10px;padding:11px 18px;font-weight:800;color:var(--muted);cursor:pointer}.tab.active{background:var(--brand);color:white;border-color:var(--brand)}
.tabpanel{display:none}.tabpanel.active{display:block}
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.card{background:white;border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 12px 28px rgba(31,45,84,.045)}
.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.11em;font-weight:900;color:var(--brand);margin-bottom:18px}.spaced{margin-top:25px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{font-size:12px;color:var(--muted);font-weight:750;display:flex;flex-direction:column;gap:7px}input{border:1px solid #d8dce7;border-radius:10px;padding:12px 13px;font-size:15px;color:var(--ink);outline:none;background:white}input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(57,56,141,.09)}
.actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:22px}button{font:inherit;cursor:pointer}.primary,.secondary,.ghost{border-radius:10px;padding:11px 14px;font-weight:850}.primary{border:1px solid var(--brand);background:var(--brand);color:white}.secondary{border:1px solid var(--ink);background:var(--ink);color:white}.ghost{border:1px solid var(--line);background:white;color:var(--ink)}
.note{font-size:11px;color:#8a91a4;line-height:1.45;margin:12px 0 0}
.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.metric{background:var(--bg);border-radius:13px;padding:16px}.metric span,.margin-box span,.price-box span{display:block;font-size:11px;color:var(--muted);font-weight:750;margin-bottom:7px}.metric strong{font-size:19px}
.margin-box{margin-top:12px;background:var(--ink);color:white;border-radius:15px;padding:20px;display:flex;align-items:center;justify-content:space-between}.margin-box span{color:#cbd2ea}.margin-box strong{font-size:22px}.margin-percent{font-size:38px;font-weight:900;letter-spacing:-1.5px}
.price-box{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.price-box>div{border:1px solid var(--line);border-radius:13px;padding:15px}.price-box strong{display:block;font-size:18px}.price-box small{color:var(--muted)}
.intro{color:var(--muted);margin-top:-6px;max-width:780px;line-height:1.5}.supplier-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:22px 0}.supplier-input{background:var(--bg);padding:18px;border-radius:14px}.supplier-input h3{margin:0 0 13px}.supplier-input label+label{margin-top:12px}
.supplier-results{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.supplier-result{border:1px solid var(--line);border-radius:14px;padding:17px}.supplier-result.best{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}.supplier-result .winner{font-size:10px;font-weight:900;color:var(--brand);letter-spacing:.1em}.supplier-result strong{display:block;font-size:22px;margin-top:7px}
.chat-layout{display:grid;grid-template-columns:1.8fr .7fr;gap:16px}.agent-head{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding-bottom:15px}.agent-icon{width:42px;height:42px;border-radius:12px;background:var(--brand);display:grid;place-items:center;color:white;font-weight:900}.agent-head strong,.agent-head span{display:block}.agent-head span{font-size:11px;color:var(--muted);margin-top:3px}
.chat{min-height:265px;max-height:400px;overflow:auto;padding:18px 0}.message{max-width:82%;padding:12px 14px;border-radius:14px;margin-bottom:10px;line-height:1.5;font-size:14px}.message.bot{background:var(--bg)}.message.user{background:var(--brand);color:white;margin-left:auto}.message b,.message strong{font-weight:900}
.quick{display:flex;gap:7px;flex-wrap:wrap}.quick button{font-size:11px;border:1px solid var(--line);background:white;color:var(--ink);border-radius:99px;padding:7px 10px}.ask-row{display:grid;grid-template-columns:1fr auto;gap:9px;margin-top:13px}
.context-card ul{padding-left:19px;color:var(--muted);line-height:1.9;font-size:14px}.future{margin-top:25px;background:var(--ink);color:white;border-radius:13px;padding:16px}.future span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.12em;opacity:.6;margin-bottom:8px}.future b{font-size:13px;line-height:1.45;display:block}
.disclaimer{font-size:11px;line-height:1.55;color:#777f92;margin:18px 4px}
footer{text-align:center;padding:23px;border-top:1px solid var(--line);background:white;color:var(--muted);font-size:12px}
@media(max-width:900px){.hero,.grid.two,.chat-layout{grid-template-columns:1fr}.hero h1{font-size:39px}.hero-card{min-height:auto}.form-grid,.supplier-grid,.supplier-results,.price-box{grid-template-columns:1fr}.header{padding:0 20px}.badge{display:none}main{padding:28px 16px}.metric-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){h1{font-size:35px}.metric-grid{grid-template-columns:1fr}.tabs{overflow:auto}.tab{white-space:nowrap}.margin-box{align-items:flex-end}.margin-percent{font-size:31px}}