/* Nexora Aero — brand.html (public brand guidelines, v1.0) */
.bg{--m:clamp(16px,4vw,48px);color:#050505;background:#F7F6F2}
.bg *{box-sizing:border-box}
.bg-w{width:min(100% - 2*var(--m),1280px);margin-inline:auto}
.bg-mono{font:500 11px/1.2 var(--nx-mono);letter-spacing:.16em;text-transform:uppercase}

/* cover — route A, Monolith */
.bg-cover{background:#050505;color:#F7F6F2;padding:clamp(128px,16vh,176px) 0 clamp(56px,8vh,88px)}
.bg-cover .top{display:flex;justify-content:space-between;gap:16px;color:#6B6B67;margin-bottom:clamp(72px,12vh,140px)}
.bg-cover .mark{width:min(74%,940px);display:block}
.bg-cover .rule{height:1px;background:#A3BF02;margin:clamp(28px,4vh,44px) 0}
.bg-cover .row{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end}
.bg-cover h1{font:500 clamp(34px,4.2vw,56px)/1.05 var(--nx-display);letter-spacing:-.03em;margin:0;color:#F7F6F2}
.bg-cover .bg-sub{font:500 clamp(34px,4.2vw,56px)/1.05 var(--nx-display);letter-spacing:-.03em;margin:0;color:#6B6B67;max-width:none}
.bg-cover .acts{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:860px){.bg-cover .row{grid-template-columns:1fr}.bg-cover .mark{width:100%}}
.bg-btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;font:500 15px/1 var(--nx-text);text-decoration:none;border:1px solid currentColor;cursor:pointer;background:none;transition:background-color 120ms cubic-bezier(.2,0,0,1),color 120ms cubic-bezier(.2,0,0,1),border-color 120ms cubic-bezier(.2,0,0,1)}
.bg-btn.lime{background:#DAFF03;border-color:#DAFF03;color:#050505}
.bg-btn.lime:hover{background:#F7F6F2;border-color:#F7F6F2}
.bg-btn.ghost-d{color:#F7F6F2;border-color:rgba(247,246,242,.5)}
.bg-btn.ghost-d:hover{background:#F7F6F2;color:#050505}
.bg-btn.black{background:#050505;color:#F7F6F2;border-color:#050505}
.bg-btn.black:hover{background:#DAFF03;color:#050505}
.bg-btn.outline{color:#050505;border-color:#050505}
.bg-btn.outline:hover{background:#050505;color:#F7F6F2}
.bg-btn:disabled{opacity:.4;cursor:not-allowed}

/* layout: sticky index + content */
.bg-body{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(24px,4vw,64px);padding:clamp(56px,8vh,96px) 0}
.bg-toc{position:sticky;top:120px;align-self:start;max-height:calc(100vh - 140px);overflow:auto}
.bg-toc ol{list-style:none;margin:0;padding:0;border-top:1px solid #050505}
.bg-toc a{display:grid;grid-template-columns:28px 1fr;gap:8px;padding:9px 0;border-bottom:1px solid #E4E3DD;color:#3A3A38;text-decoration:none;font:400 14px/1.35 var(--nx-text);transition:color 120ms cubic-bezier(.2,0,0,1)}
.bg-toc a b{font:500 11px/1.6 var(--nx-mono);color:#6B6B67}
.bg-toc a:hover,.bg-toc a.on{color:#050505}
.bg-toc a.on b{color:#3B4500}
@media(max-width:1023px){.bg-body{grid-template-columns:minmax(0,1fr)}.bg-toc{display:none}}
.bg-body > *,.bg-grid > *,.bg-cover .row > *{min-width:0}
.bg-table td,.bg-table th{overflow-wrap:anywhere}

/* sections */
.bg-sec{padding:0 0 clamp(64px,9vh,112px);scroll-margin-top:110px}
.bg-sec + .bg-sec{border-top:1px solid #E4E3DD;padding-top:clamp(40px,6vh,64px)}
.bg-ey{display:block;color:#3B4500;margin:0 0 14px}
.bg-sec h2{font:500 clamp(30px,3.4vw,44px)/1.05 var(--nx-display);letter-spacing:-.028em;margin:0 0 16px}
.bg-sec h3{font:600 20px/1.25 var(--nx-display);letter-spacing:-.01em;margin:0 0 8px}
.bg-lead{font:400 18px/1.6 var(--nx-text);color:#3A3A38;max-width:62ch;margin:0 0 32px}
.bg p{max-width:68ch}
.bg-panel{background:#fff;border:1px solid #E4E3DD}
.bg-grid{display:grid;gap:1px;background:#E4E3DD;border:1px solid #E4E3DD}
.bg-grid > *{background:#fff;padding:24px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:860px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.g2,.g3,.g4{grid-template-columns:1fr}}
.bg-grid small,.bg-label{display:block;font:500 11px/1.3 var(--nx-mono);letter-spacing:.16em;text-transform:uppercase;color:#6B6B67;margin:0 0 10px}
.bg-grid p{margin:0;color:#3A3A38;font-size:15px;line-height:1.55}
.bg-dark{background:#050505!important;color:#F7F6F2}
.bg-dark p{color:#B4B4AE!important}

/* positioning */
.bg-state{font:400 clamp(22px,2.4vw,30px)/1.35 var(--nx-display);letter-spacing:-.012em;max-width:34ch;margin:0 0 36px}
.bg-stats b{display:block;font:500 34px/1 var(--nx-display);letter-spacing:-.02em;color:#3B4500;margin-bottom:10px;font-variant-numeric:tabular-nums}

/* pillars */
.bg-pillar{display:grid;grid-template-columns:64px 1fr 1fr;gap:24px;padding:28px 24px!important}
.bg-pillar .n{font:500 34px/1 var(--nx-display);color:#3B4500}
.bg-pillar .say{border-left:1px solid #E4E3DD;padding-left:20px;color:#6B6B67;font-size:15px;line-height:1.55}
@media(max-width:760px){.bg-pillar{grid-template-columns:1fr}.bg-pillar .say{border-left:0;padding-left:0}}

/* tables */
.bg-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid #E4E3DD;font-variant-numeric:tabular-nums}
.bg-table th{background:#050505;color:#F7F6F2;text-align:left;font:500 11px/1.2 var(--nx-mono);letter-spacing:.16em;text-transform:uppercase;padding:14px 16px}
.bg-table td{padding:14px 16px;border-top:1px solid #E4E3DD;font-size:15px;vertical-align:top}
.bg-table td.hl{background:#F2FFC2}
.bg-table td.dim{color:#6B6B67}
.bg-scroll{overflow-x:auto}

/* logo tiles */
.bg-tile{min-height:200px;display:grid;place-items:center;padding:48px!important}
.bg-tile img{width:min(100%,300px)}
.bg-tile.k{background:#050505!important}.bg-tile.l{background:#DAFF03!important}
.bg-cap{padding:16px 24px!important;font-size:14px;color:#3A3A38}
.bg-dl{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.bg-dl a{font:500 11px/1 var(--nx-mono);letter-spacing:.12em;text-transform:uppercase;color:#050505;border:1px solid #E4E3DD;padding:9px 10px;text-decoration:none;transition:border-color 120ms cubic-bezier(.2,0,0,1)}
.bg-dl a:hover{border-color:#050505}
.bg-clear{position:relative;padding:64px!important;display:grid;place-items:center}
.bg-clear .box{border:1px dashed #3B4500;padding:28px 36px;position:relative}
.bg-clear .box span{position:absolute;left:8px;top:6px;font:500 10px/1 var(--nx-mono);letter-spacing:.14em;color:#3B4500}
.bg-clear img{width:min(52vw,440px)}
/* misuse */
.bg-mis{min-height:150px;display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.bg-mis img{width:190px}
.bg-mis .x{font:500 11px/1 var(--nx-mono);letter-spacing:.14em;text-transform:uppercase;color:#C4362F}

/* colour */
.bg-sw{min-height:180px;display:flex;flex-direction:column;justify-content:space-between;padding:22px!important}
.bg-sw h3{margin:0}
.bg-sw code{font:400 12.5px/1.7 var(--nx-mono);display:block;opacity:.85}
.bg-copy{align-self:flex-start;margin-top:12px;font:500 11px/1 var(--nx-mono);letter-spacing:.14em;text-transform:uppercase;background:none;border:1px solid currentColor;color:inherit;padding:8px 10px;cursor:pointer;min-height:32px}
.bg-tints{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid #E4E3DD}
.bg-tints div{padding:16px;min-height:88px;font:400 12px/1.5 var(--nx-mono)}
@media(max-width:640px){.bg-tints{grid-template-columns:repeat(2,1fr)}}
.bg-neutral{display:grid;grid-template-columns:repeat(5,1fr)}
.bg-neutral div{height:64px}
.bg-neutral + .lbls{display:grid;grid-template-columns:repeat(5,1fr);font:400 12px/1.5 var(--nx-mono);color:#6B6B67;margin-top:8px}
.bg-dist{display:flex;height:48px;border:1px solid #E4E3DD}
.bg-dist span{display:block;height:100%}

/* type */
.bg-spec{display:grid;grid-template-columns:1fr auto;gap:12px 24px;padding:28px 24px!important}
.bg-spec .big{grid-column:1/-1;font-size:clamp(40px,5vw,64px);line-height:1.05}
.bg-scale td:first-child{font:400 12px/1.5 var(--nx-mono);color:#6B6B67;white-space:nowrap;width:170px}
.bg-scale td:last-child{color:#6B6B67;font-size:14px;width:200px}

/* grid & edges */
.bg-cols{display:grid;grid-template-columns:repeat(12,1fr);gap:8px;height:120px}
.bg-cols i{background:#F2FFC2;border-top:2px solid #3B4500}
.bg-space{display:flex;align-items:flex-end;gap:8px;height:72px}
.bg-space i{background:#050505;width:28px}

/* UI demo */
.bg-task{display:flex;border:1px solid #050505;background:#fff;padding:6px;max-width:460px}
.bg-task input{flex:1;border:0!important;outline:0;background:none;padding:0 12px;font:400 16px var(--nx-text);min-width:0}
.bg-task:focus-within{outline:2px solid #3B4500;outline-offset:2px}
.bg-chip{display:inline-block;font:500 11px/1 var(--nx-mono);letter-spacing:.12em;text-transform:uppercase;padding:9px 12px;border:1px solid #E4E3DD;margin:0 6px 8px 0}
.bg-chip.sel{background:#F2FFC2;border-color:#A3BF02}
.bg-chip.sell{background:#F7E3FE;border-color:#F7E3FE;color:#7A02A2}
.bg-chip.ok{background:#17694A;border-color:#17694A;color:#fff}
.bg-card{border:1px solid #E4E3DD;background:#fff;display:flex;flex-direction:column}
.bg-card .th{height:96px;background:repeating-linear-gradient(135deg,#F7F6F2 0 8px,#EFEEE8 8px 16px);border-bottom:1px solid #E4E3DD}
.bg-card .bd{padding:18px}
.bg-card .ct{font:500 11px/1 var(--nx-mono);letter-spacing:.14em;text-transform:uppercase;color:#3B4500;margin-bottom:10px}
.bg-card h4{font:600 17px/1.3 var(--nx-display);margin:0 0 8px}
.bg-card p{font-size:15px;color:#6B6B67;margin:0 0 16px}
.bg-card .ft{display:flex;justify-content:space-between;border-top:1px solid #E4E3DD;padding-top:12px;font:400 14px var(--nx-mono)}
.bg-card .ft span{font-size:11px;letter-spacing:.12em;color:#6B6B67}
.bg-card.k{background:#050505;border-color:#050505;color:#F7F6F2}
.bg-card.k .th{background:repeating-linear-gradient(135deg,#050505 0 8px,#121212 8px 16px);border-color:#3A3A38}
.bg-card.k .ct{color:#DAFF03}.bg-card.k p{color:#B4B4AE}.bg-card.k .ft{border-color:#3A3A38}

/* diagram + motion demo */
.bg-dia{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr;align-items:center}
.bg-node{border:1px solid #050505;background:#fff;padding:14px 16px}
.bg-node small{display:block;font:500 10.5px/1 var(--nx-mono);letter-spacing:.16em;text-transform:uppercase;color:#6B6B67;margin-bottom:8px}
.bg-node b{font:600 16px/1.3 var(--nx-display)}
.bg-node.auto{background:#F2FFC2;border-color:#A3BF02}.bg-node.auto small{color:#3B4500}
.bg-node.flash{outline:2px solid #DAFF03;outline-offset:-2px}
.bg-wire{height:1px;background:#E4E3DD;position:relative;overflow:hidden}
.bg-wire i{position:absolute;inset:0;background:#050505;transform:scaleX(1);transform-origin:left}
.bg-dia.reset .bg-wire i{transform:scaleX(0);transition:none}
.bg-dia.run .bg-wire i{transform:scaleX(1);transition:transform 450ms cubic-bezier(.2,0,0,1)}
.bg-dia.run .bg-wire.w2 i{transition-delay:450ms}
.bg-dia .res{transition:opacity 220ms cubic-bezier(.2,0,0,1),transform 220ms cubic-bezier(.2,0,0,1)}
.bg-dia.reset .res{opacity:0;transform:translateY(8px);transition:none}
@media(max-width:700px){.bg-dia{grid-template-columns:1fr}.bg-wire{height:24px;width:1px;margin-left:20px}.bg-wire i{transform-origin:top}}
.bg-tok b{display:block;font:500 30px/1 var(--nx-display);color:#DAFF03;margin-bottom:10px}
.bg-tok code{font:400 13px/1.5 var(--nx-mono);color:#F7F6F2}

/* voice */
.bg-wt td:first-child{color:#050505}.bg-wt td:last-child{color:#6B6B67}
.bg-banned{font:400 17px/1.8 var(--nx-text);color:#6B6B67;text-decoration:line-through;text-decoration-color:#C4362F}
.bg-quote{font:400 17px/1.6 var(--nx-text);color:#050505;margin:0 0 14px}

/* ten rules */
.bg-rules{list-style:none;counter-reset:r;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:repeat(5,auto);grid-auto-flow:column;column-gap:48px;border-top:1px solid #3A3A38}
.bg-rules li{counter-increment:r;display:grid;grid-template-columns:36px 1fr;padding:18px 0;border-bottom:1px solid #3A3A38;font:400 17px/1.5 var(--nx-text);color:#F7F6F2}
.bg-rules li::before{content:counter(r,decimal-leading-zero);font:500 11px/2.2 var(--nx-mono);color:#DAFF03}
@media(max-width:760px){.bg-rules{grid-template-columns:1fr;grid-auto-flow:row}}
.bg-final{background:#050505;color:#F7F6F2;padding:clamp(64px,10vh,120px) 0}
.bg-final h2{color:#F7F6F2}
.bg-final a{color:#DAFF03}
.bg-note{border-left:2px solid #3B4500;padding:4px 0 4px 16px;color:#3A3A38;font-size:15px}
/* headings inherit their tile's ink (kyma sets every h1–h6 to Black) */
.bg .bg-sw h3,.bg .bg-card h4,.bg .bg-dark h3,.bg .bg-final h2{color:inherit!important}
.bg .bg-final .bg-ey{color:#DAFF03!important}
