/* Bilantum website — base styles. Tokens live in tokens.css. */

@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/ibm-plex-sans-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/ibm-plex-mono-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/ibm-plex-mono-latin-500-normal.woff2) format('woff2')}

:root{
  --bl-dark-bg:#1b3556; --bl-dark-surface:#2a4f7c; --bl-dark-border:#3a608c; --bl-dark-text:#f1f6fb; --bl-dark-muted:#b9d3e8; --bl-dark-faint:#8fa6bd;
  --bl-ink:#0a1628; --bl-ink-surface:#122238; --bl-ink-divider:#1d3a5c;
  --bl-input-border:#c5d5e4;
  --container:1200px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bl-bg);color:var(--bl-text);font:400 16px/1.5 var(--bl-font-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--bl-mark)}a:hover{color:var(--bl-text)}
h1,h2,h3,p{margin:0}
img,svg{display:block}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

.container{max-width:var(--container);margin:0 auto;padding-left:32px;padding-right:32px}
@media (max-width:640px){.container{padding-left:16px;padding-right:16px}}

/* type */
.eyebrow{font:400 11px var(--bl-font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--bl-text-muted)}
.label{font:400 11px var(--bl-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bl-text-muted)}
.mono{font-family:var(--bl-font-mono);font-variant-numeric:tabular-nums}
.h1{font:600 clamp(38px,5vw,60px)/1.04 var(--bl-font-sans);letter-spacing:-.03em}
.h2{font:600 clamp(30px,3.4vw,40px)/1.1 var(--bl-font-sans);letter-spacing:-.025em}
.h3{font:600 18px/1.3 var(--bl-font-sans);letter-spacing:-.01em}
.lead{font-size:18px;line-height:1.55}
.body{font-size:16px;line-height:1.6;color:var(--bl-text-muted)}
.small{font-size:14px;line-height:1.6;color:var(--bl-text-muted)}
.muted{color:var(--bl-text-muted)}
.section-head{display:flex;flex-direction:column;gap:14px;max-width:760px}

/* schemes */
.scheme-dark{background:var(--bl-dark-bg);color:var(--bl-dark-text)}
.scheme-dark .eyebrow{color:var(--bl-signal)}
.scheme-dark .body,.scheme-dark .small,.scheme-dark .muted{color:var(--bl-dark-muted)}
.scheme-ink{background:var(--bl-ink);color:var(--bl-bg)}
.scheme-ink .eyebrow{color:var(--bl-signal)}
.scheme-ink .body{color:var(--bl-dark-faint)}
.band{background:var(--bl-surface);border-top:1px solid var(--bl-border);border-bottom:1px solid var(--bl-border)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:var(--bl-radius-sm);font:500 14px var(--bl-font-sans);text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn-light{background:var(--bl-dark-text);color:var(--bl-ink)}.btn-light:hover{background:#fff;color:var(--bl-ink)}
.btn-ghost{border-color:var(--bl-dark-border);color:var(--bl-dark-text)}.btn-ghost:hover{border-color:var(--bl-dark-muted);color:var(--bl-dark-text)}
.btn-ink{background:var(--bl-ink);color:var(--bl-dark-text)}.btn-ink:hover{background:var(--bl-mark);color:var(--bl-dark-text)}
.btn-outline{height:36px;padding:0 16px;font-size:13px;border-color:var(--bl-dark-muted);color:var(--bl-dark-text)}.btn-outline:hover{background:rgba(255,255,255,.06);color:var(--bl-dark-text)}
:focus-visible{outline:2px solid var(--bl-signal);outline-offset:2px}

/* header */
.site-header{border-bottom:1px solid var(--bl-dark-surface)}
.site-header .container{min-height:64px;display:flex;align-items:center;gap:32px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}
.lockup{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.lockup img{width:24px;height:24px}
.lockup span{font:600 17px/1 var(--bl-font-sans);letter-spacing:-.02em}
.site-nav{display:flex;gap:4px;flex:1;min-width:0;flex-wrap:wrap}
.site-nav a{padding:8px 12px;font:400 13px var(--bl-font-sans);color:var(--bl-dark-muted);text-decoration:none}
.site-nav a:hover{color:var(--bl-dark-text)}

/* hero */
.hero .container{padding-top:88px;padding-bottom:96px;display:flex;flex-wrap:wrap;gap:64px;align-items:center}
@media (max-width:640px){.hero .container{padding-top:56px;padding-bottom:64px;gap:40px}}
.hero-copy{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:28px}
.hero-copy .h1{max-width:620px}
.hero-copy .lead{max-width:540px;color:var(--bl-dark-muted)}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-facts{display:flex;gap:24px;flex-wrap:wrap;font:400 11px var(--bl-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bl-dark-faint)}
.hero-shot{flex:1 1 460px;min-width:0;display:flex;flex-direction:column;gap:10px}
.sample{font:400 10px var(--bl-font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--bl-dark-faint);text-align:right}

/* product shot (miniature dashboard) */
.shot{background:var(--bl-surface);border:1px solid var(--bl-dark-border);border-radius:var(--bl-radius);overflow:hidden;color:var(--bl-text)}
.shot-bar{min-height:44px;border-bottom:1px solid var(--bl-border);padding:0 18px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.shot-lockup{display:flex;align-items:center;gap:8px}
.shot-lockup img{width:18px;height:18px}
.shot-lockup span{font:600 13px/1 var(--bl-font-sans);letter-spacing:-.02em}
.shot-tabs{display:flex;gap:2px;font:400 11px var(--bl-font-sans);color:var(--bl-text-muted);overflow:hidden}
.shot-tabs span{padding:0 8px;height:44px;display:flex;align-items:center;white-space:nowrap}
.shot-tabs .on{color:var(--bl-text);font-weight:500;border-bottom:2px solid var(--bl-text)}
.sync{margin-left:auto;display:flex;align-items:center;gap:6px;font:400 10px var(--bl-font-mono);letter-spacing:.04em;color:var(--bl-text-muted);white-space:nowrap}
.dot{width:7px;height:7px;border-radius:50%;background:var(--bl-positive);flex-shrink:0}
.dot.sm{width:6px;height:6px}
.dot.frost{background:var(--bl-frost)}
.dot.signal{background:var(--bl-signal)}
.shot-body{padding:18px;display:flex;flex-direction:column;gap:14px}
.shot-title{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.shot-title .eyebrow{font-size:9px;margin-bottom:5px}
.shot-title h3{font:600 18px/1.1 var(--bl-font-sans);letter-spacing:-.02em}
.shot-meta{font:400 10px var(--bl-font-mono);color:var(--bl-text-muted)}
.hairline{display:grid;gap:1px;background:var(--bl-border);border:1px solid var(--bl-border);border-radius:var(--bl-radius);overflow:hidden}
.hairline>*{background:var(--bl-surface)}
.kpis{grid-template-columns:repeat(auto-fit,minmax(min(100%,120px),1fr))}
.kpi{padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.kpi .label{font-size:9px}
.kpi .val{font:500 17px/1 var(--bl-font-mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.kpi .delta{font:400 10px var(--bl-font-mono)}
.up{color:var(--bl-positive)}.down{color:var(--bl-negative)}
.shot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:12px}
.mini-card{background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:var(--bl-radius);padding:14px;display:flex;flex-direction:column;gap:6px;font-size:11px}
.mini-card h4{margin:0 0 4px;font:600 12px var(--bl-font-sans)}
.row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid var(--bl-border-soft)}
.row:last-child{border-bottom:0}
.row.sub{font-weight:500}.row.total{font-weight:600}
.row .mono{font-size:11px}
.claude-panel{background:var(--bl-ink);color:var(--bl-bg);border-radius:var(--bl-radius);padding:14px;display:flex;flex-direction:column;gap:10px}
.claude-panel .label{color:var(--bl-signal);display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.18em}
.claude-panel p{font-size:11px;line-height:1.55}
.flags{border-top:1px solid var(--bl-ink-divider);padding-top:10px;display:flex;flex-direction:column;gap:6px}
.flags .label{color:var(--bl-dark-faint)}
.flag{display:flex;justify-content:space-between;gap:12px;font-size:11px}
.flag .mono{color:var(--bl-dark-faint);white-space:nowrap}

/* sections */
.section .container{padding-top:96px;padding-bottom:96px;display:flex;flex-direction:column;gap:40px}
.section.tight .container{padding-top:80px;padding-bottom:80px}
@media (max-width:640px){.section .container,.section.tight .container{padding-top:56px;padding-bottom:56px;gap:28px}}
.cells{grid-template-columns:repeat(auto-fit,minmax(min(100%,var(--min,280px)),1fr))}
.cells>div{padding:28px;display:flex;flex-direction:column;gap:12px}
.cells .num{font:400 11px var(--bl-font-mono);letter-spacing:.12em;color:var(--bl-text-muted)}
.steps{grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr))}
.steps>div{background:var(--bl-bg);padding:24px;display:flex;flex-direction:column;gap:10px;min-height:220px}
.steps h3{font:600 16px/1.3 var(--bl-font-sans)}
.steps p{font-size:13px;line-height:1.55;color:var(--bl-text-muted)}
.split{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.split p{max-width:420px}

/* architecture */
.flow{display:flex;flex-wrap:wrap;gap:32px;align-items:stretch}
.card{background:var(--bl-surface);border:1px solid var(--bl-border);border-radius:var(--bl-radius);padding:22px;display:flex;flex-direction:column;gap:4px;flex:1 1 300px;min-width:0}
.card h3{font:600 14px var(--bl-font-sans);margin-bottom:12px}
.src{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--bl-border-soft)}
.src:last-child{border-bottom:0}
.src .name{font:500 13px var(--bl-font-sans);flex:1}
.src .kind{font:400 11px var(--bl-font-mono);color:var(--bl-text-muted);white-space:nowrap}
.core{flex:0 1 300px;min-width:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px;text-align:center}
.core img{width:120px;height:120px}
.core .name{font:600 16px var(--bl-font-sans);letter-spacing:-.01em;margin-bottom:8px}
.core .list{font:400 11px/1.8 var(--bl-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--bl-text-muted)}

/* claude section */
.claude .container{display:flex;flex-wrap:wrap;gap:64px;align-items:center;flex-direction:row}
.claude-copy{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:24px}
.claude-big{flex:1 1 420px;min-width:0;background:var(--bl-ink-surface);border:1px solid var(--bl-ink-divider);border-radius:var(--bl-radius);padding:26px;display:flex;flex-direction:column;gap:16px}
.claude-big .head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.claude-big .label{color:var(--bl-signal);display:flex;align-items:center;gap:8px;letter-spacing:.18em}
.claude-big .when{font:400 11px var(--bl-font-mono);color:var(--bl-dark-faint)}
.claude-big p{font-size:14px;line-height:1.6}
.claude-big .flags{padding-top:16px;gap:10px}
.claude-big .flag{font-size:13px}
.claude-big .flag .mono{font-size:13px}
.claude-big .sample{color:var(--bl-text-muted)}

/* access */
.access .container{padding-top:88px;padding-bottom:88px;display:flex;flex-direction:row;flex-wrap:wrap;gap:48px;align-items:center;justify-content:space-between}
.access-copy{flex:1 1 400px;min-width:0;display:flex;flex-direction:column;gap:14px}
.access-copy p{max-width:520px}
.access-form{flex:0 1 440px;min-width:280px;display:flex;flex-direction:column;gap:10px}
.field{display:flex;gap:8px;flex-wrap:wrap}
.input{flex:1 1 220px;height:44px;padding:0 14px;border:1px solid var(--bl-input-border);border-radius:var(--bl-radius-sm);background:#fff;font:400 14px var(--bl-font-sans);color:var(--bl-text)}
.input::placeholder{color:var(--bl-text-muted)}
.note{font:400 11px var(--bl-font-mono);color:var(--bl-text-muted)}

/* footer */
.site-footer .container{padding-top:56px;padding-bottom:32px;display:flex;flex-direction:column;gap:40px}
.foot-cols{display:flex;flex-wrap:wrap;gap:48px;justify-content:space-between}
.foot-brand{display:flex;flex-direction:column;gap:14px;flex:1 1 260px}
.tagline{font:400 11px var(--bl-font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--bl-dark-faint)}
.foot-col{display:flex;flex-direction:column;gap:10px;flex:0 1 160px}
.foot-col .label{color:var(--bl-dark-faint);margin-bottom:4px}
.foot-col a,.foot-col span{font:400 13px var(--bl-font-sans);color:var(--bl-dark-muted);text-decoration:none}
.foot-col a:hover{color:var(--bl-dark-text)}
.foot-col span{color:var(--bl-dark-faint)}
.foot-bottom{border-top:1px solid var(--bl-dark-surface);padding-top:20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font:400 11px var(--bl-font-mono);letter-spacing:.04em;color:var(--bl-dark-faint)}

/* legal / text pages */
.prose{max-width:720px;display:flex;flex-direction:column;gap:20px}
.prose h2{font:600 20px/1.3 var(--bl-font-sans);margin-top:12px}
.prose p,.prose li{font-size:15px;line-height:1.65;color:var(--bl-text-muted)}
.prose ul{margin:0;padding-left:20px}
.placeholder{display:inline-block;padding:2px 8px;border:1px dashed var(--bl-warning);border-radius:3px;font:400 12px var(--bl-font-mono);color:var(--bl-warning)}
