/* /work/buzz-os/ in Buzz OS's own look. Tokens from buzz-os/app/globals.css: black #0e0e0e,
   acid lime #cfea3d used as an accent (never a surface), neutral grey page #f4f4f5,
   Anton display + Lato body (buzz-os/app/layout.tsx). Everything scoped under .cs-buzzos. */
.cs-buzzos{--ink:#14150f;--black:#0e0e0e;--muted:#61635a;--faint:#8e9086;--page:#f4f4f5;--surface:#fff;
  --line:#e3e3e0;--lime:#cfea3d;--lime-ink:#6f8410;--lime-soft:#eaf5b8;--lime-chip:#4d5c0b;
  --warn:#a8710f;--warn-bg:#fdf7e8;--bad:#b8372c;--bad-bg:#fdf1ef;
  background:var(--page);color:var(--ink);font:400 17px/1.65 'Lato',system-ui,sans-serif;overflow:hidden}
.cs-buzzos *{box-sizing:border-box}
.cs-buzzos section{border-bottom:0}
.cs-buzzos h1,.cs-buzzos h2,.cs-buzzos h3{font-family:'Anton',Impact,sans-serif;font-weight:400;letter-spacing:.005em;
  line-height:1.02;color:var(--black);margin:0 0 .45em;max-width:none;text-transform:none}
.cs-buzzos h1{font-size:clamp(44px,5vw,70px)}
.cs-buzzos h2{font-size:clamp(32px,3.6vw,48px)}
.cs-buzzos h3{font-family:'Lato',sans-serif;font-weight:900;font-size:20px;letter-spacing:-.01em;line-height:1.25}
.cs-buzzos p{margin:0 0 1em;color:#3a3b34}
.cs-buzzos img{display:block;width:100%;height:auto}
.cs-buzzos figure{margin:0}
.cs-buzzos figcaption{font-size:13px;color:var(--faint);margin-top:10px;line-height:1.45}
.cs-buzzos .bo-w{max-width:1180px;margin:0 auto;padding:0 28px}
.cs-buzzos .bo-kick{font:900 12px/1 'Lato';letter-spacing:.22em;text-transform:uppercase;color:var(--lime-ink);margin-bottom:18px}
.cs-buzzos .bo-btn{display:inline-flex;align-items:center;background:var(--lime);color:var(--black);font:700 15px/1 'Lato';
  padding:14px 20px;border-radius:8px;text-decoration:none;border:1px solid var(--lime)}
.cs-buzzos .bo-btn:hover{background:#c2dd2c}
.cs-buzzos .bo-btn.ghost{background:#fff;border-color:var(--line)}
.cs-buzzos .bo-btn.ghost:hover{border-color:var(--black)}

/* opening: copy left, the planner running off the right edge */
.cs-buzzos .bo-open{padding:80px 0 72px;background:linear-gradient(180deg,#fff 0,var(--page) 100%)}
.cs-buzzos .bo-opengrid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:56px;align-items:center}
.cs-buzzos .bo-lede{font-size:19px;max-width:32rem}
.cs-buzzos .bo-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cs-buzzos .bo-hero{margin-right:-240px}
.cs-buzzos .bo-hero img{border-radius:12px;border:1px solid var(--line);box-shadow:0 40px 80px -30px rgba(14,14,14,.35)}

/* the page's own nav, drawn as the Buzz OS top bar */
.cs-buzzos .bo-hubbar{background:var(--black);position:sticky;top:0;z-index:5}
.cs-buzzos .bo-hubbar .bo-w{display:flex;align-items:center;gap:30px;height:58px;overflow-x:auto;scrollbar-width:none}
.cs-buzzos .bo-hubbar a{color:#fff;text-decoration:none;font:700 15px/1 'Lato';white-space:nowrap;padding:21px 0 18px;border-bottom:3px solid transparent}
.cs-buzzos .bo-hubbar a:hover{color:var(--lime);border-bottom-color:var(--lime)}
.cs-buzzos .bo-logo{font:400 24px/1 'Anton';color:#fff;letter-spacing:.02em;margin-right:12px;position:relative}
.cs-buzzos .bo-logo small{position:absolute;left:1px;bottom:-9px;font:900 9px/1 'Lato';letter-spacing:.32em;color:var(--lime)}

/* why */
.cs-buzzos .bo-why{padding:96px 0 40px}
.cs-buzzos .bo-whygrid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:72px;align-items:end}
.cs-buzzos .bo-whygrid p{font-size:18px;max-width:40rem}
.cs-buzzos .bo-note{background:#fff;border:1px solid var(--line);border-left:4px solid var(--lime);border-radius:10px;padding:26px 26px 12px}
.cs-buzzos .bo-tag{font:900 12px/1 'Lato';letter-spacing:.2em;text-transform:uppercase;color:var(--lime-ink)}
.cs-buzzos .bo-note p:last-child{font-size:17px;color:var(--ink)}

/* the chain the modules grew along */
.cs-buzzos .bo-grew{padding:56px 0 96px}
.cs-buzzos .bo-chain{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;
  background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cs-buzzos .bo-chain li{padding:26px 24px 22px;border-right:1px solid var(--line);position:relative}
.cs-buzzos .bo-chain li:last-child{border-right:0;background:var(--black)}
.cs-buzzos .bo-chain li:last-child b{color:var(--lime)}
.cs-buzzos .bo-chain li:last-child p{color:#c9cac3}
.cs-buzzos .bo-chain li:not(:last-child)::after{content:"";position:absolute;right:-9px;top:34px;width:16px;height:16px;background:#fff;
  border-top:1px solid var(--line);border-right:1px solid var(--line);transform:rotate(45deg);z-index:1}
.cs-buzzos .bo-chain .n{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--lime);
  font:900 13px/1 'Lato';color:var(--black);margin-bottom:14px}
.cs-buzzos .bo-chain b{display:block;font:400 26px/1.05 'Anton';color:var(--black);margin-bottom:8px}
.cs-buzzos .bo-chain p{font-size:15px;line-height:1.5;margin:0}

/* image left breaking out, copy right */
.cs-buzzos .bo-split{padding:0 0 110px}
.cs-buzzos .bo-splitgrid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:64px;align-items:center}
.cs-buzzos .bo-left{margin-left:-200px}
.cs-buzzos .bo-left img{border-radius:12px;border:1px solid var(--line);box-shadow:0 30px 70px -30px rgba(14,14,14,.3)}
.cs-buzzos .bo-splitcopy p{font-size:18px}

/* the one dark panel: HMRC filing */
.cs-buzzos .bo-hmrc{padding:0 0 110px}
.cs-buzzos .bo-panel{background:var(--black);border-radius:16px;padding:64px 64px 56px;display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:start}
.cs-buzzos .bo-panel h2{color:#fff}
.cs-buzzos .bo-panel .bo-kick{color:var(--lime)}
.cs-buzzos .bo-panelhead p{color:#c9cac3}
.cs-buzzos .bo-filings{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cs-buzzos .bo-filings li{display:flex;gap:14px;background:#1b1c17;border:1px solid #2c2d27;border-radius:10px;padding:22px 20px}
.cs-buzzos .bo-filings b{display:block;color:#fff;font:900 17px/1.3 'Lato';margin-bottom:6px}
.cs-buzzos .bo-filings p{color:#a9aaa2;font-size:14.5px;line-height:1.5;margin:0 0 12px}
.cs-buzzos .bo-filings em{font:700 12.5px/1 'Lato';font-style:normal;color:var(--black);background:var(--lime);padding:7px 9px;border-radius:5px;display:inline-block;white-space:nowrap}
.cs-buzzos .tick{flex:none;width:22px;height:22px;border-radius:50%;border:2px solid var(--lime);position:relative;margin-top:1px}
.cs-buzzos .tick::after{content:"";position:absolute;left:6px;top:3px;width:5px;height:9px;border:solid var(--lime);border-width:0 2px 2px 0;transform:rotate(45deg)}

/* the approval queue: the component only this page has */
.cs-buzzos .bo-agents{padding:0 0 110px}
.cs-buzzos .bo-agentgrid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:64px;align-items:center}
.cs-buzzos .bo-agentcopy p{font-size:18px}
.cs-buzzos .bo-queue{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -36px rgba(14,14,14,.35)}
.cs-buzzos .bo-qhead{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 22px;border-bottom:1px solid var(--line)}
.cs-buzzos .bo-qhead b{font:900 16px/1.2 'Lato'}
.cs-buzzos .bo-qhead span{font-size:12.5px;color:var(--faint)}
.cs-buzzos .bo-queue ul{list-style:none;margin:0;padding:0}
.cs-buzzos .bo-queue li{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;padding:16px 22px;border-bottom:1px solid #eeeeec}
.cs-buzzos .bo-queue li:last-child{border-bottom:0}
.cs-buzzos .bo-queue .who{grid-column:1/-1;display:flex;align-items:center;gap:8px;font:700 12px/1 'Lato';color:var(--faint);
  text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.cs-buzzos .bo-queue .ai{display:inline-grid;place-items:center;width:24px;height:20px;border-radius:5px;background:var(--lime-soft);color:var(--lime-chip);font:900 10.5px/1 'Lato';letter-spacing:.04em}
.cs-buzzos .bo-queue b{font:900 16px/1.35 'Lato';grid-column:1}
.cs-buzzos .bo-queue p{grid-column:1;font-size:14.5px;line-height:1.5;color:var(--muted);margin:2px 0 0}
.cs-buzzos .bo-queue .act{grid-column:2;grid-row:2/4;align-self:center;font:700 13.5px/1 'Lato';padding:10px 14px;border-radius:7px;
  background:var(--black);color:var(--lime)}
.cs-buzzos .bo-queue li.esc{background:var(--warn-bg)}
.cs-buzzos .bo-queue li.esc .act{background:#fff;color:var(--warn);border:1px solid #ecd9a8}

/* decisions, two to a row */
.cs-buzzos .bo-calls{padding:0 0 110px}
.cs-buzzos .bo-callgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:32px}
.cs-buzzos .bo-callgrid article{background:#fff;border:1px solid var(--line);border-radius:12px;padding:30px 30px 18px;border-top:4px solid var(--black)}
.cs-buzzos .bo-callgrid p{font-size:16px}

/* the rest */
.cs-buzzos .bo-rest{padding:0 0 100px}
.cs-buzzos .bo-restgrid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:64px;align-items:start}
.cs-buzzos .bo-restgrid figure img{border-radius:12px;border:1px solid var(--line)}
.cs-buzzos .bo-rlist{list-style:none;margin:8px 0 28px;padding:0}
.cs-buzzos .bo-rlist li{padding:16px 0;border-bottom:1px solid var(--line)}
.cs-buzzos .bo-rlist b{display:block;font:900 17px/1.3 'Lato';margin-bottom:4px}
.cs-buzzos .bo-rlist span{font-size:15.5px;color:var(--muted)}
.cs-buzzos .bo-stack{display:flex;flex-wrap:wrap;gap:8px}
.cs-buzzos .bo-stack span{font:700 12.5px/1 'Lato';padding:8px 11px;border-radius:6px;background:#fff;border:1px solid var(--line);color:var(--muted)}

/* next case */
.cs-buzzos .bo-next{padding:0 0 90px}
.cs-buzzos .bo-next a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;text-decoration:none;
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:26px 30px}
.cs-buzzos .bo-next span{font:900 12px/1 'Lato';letter-spacing:.2em;text-transform:uppercase;color:var(--lime-ink)}
.cs-buzzos .bo-next b{font:400 28px/1.1 'Anton';color:var(--black)}
.cs-buzzos .bo-next i{font-style:normal;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--lime);font-size:22px;color:var(--black)}
.cs-buzzos .bo-next a:hover{border-color:var(--black)}

@media (max-width:980px){
  .cs-buzzos .bo-w{padding:0 20px}
  .cs-buzzos .bo-open{padding:44px 0 48px}
  .cs-buzzos .bo-opengrid,.cs-buzzos .bo-whygrid,.cs-buzzos .bo-splitgrid,.cs-buzzos .bo-agentgrid,
  .cs-buzzos .bo-restgrid,.cs-buzzos .bo-panel,.cs-buzzos .bo-callgrid,.cs-buzzos .bo-filings{grid-template-columns:minmax(0,1fr);gap:28px}
  .cs-buzzos .bo-hero{margin-right:-60px}
  .cs-buzzos .bo-left{margin-left:0}
  .cs-buzzos .bo-why{padding:56px 0 24px}
  .cs-buzzos .bo-grew,.cs-buzzos .bo-split,.cs-buzzos .bo-hmrc,.cs-buzzos .bo-agents,.cs-buzzos .bo-calls{padding-bottom:64px}
  .cs-buzzos .bo-chain{grid-template-columns:minmax(0,1fr)}
  .cs-buzzos .bo-chain li{border-right:0;border-bottom:1px solid var(--line)}
  .cs-buzzos .bo-chain li:not(:last-child)::after{right:auto;left:30px;top:auto;bottom:-9px;transform:rotate(135deg)}
  .cs-buzzos .bo-panel{padding:36px 22px}
  .cs-buzzos .bo-queue li{grid-template-columns:minmax(0,1fr)}
  .cs-buzzos .bo-queue .act{grid-column:1;grid-row:auto;justify-self:start;margin-top:12px}
  .cs-buzzos .bo-next a{grid-template-columns:1fr auto;gap:12px 18px;padding:22px}
  .cs-buzzos .bo-next span{grid-column:1/-1}
  .cs-buzzos .bo-next b{font-size:22px}
}
@media (max-width:980px){.cs-buzzos .bo-hero figcaption{padding-right:70px}}
