/* Newsroom and posts: the pages tools/build_content.py generates from content/.
   Loaded after site.css, platform.css and pages.css. Uses the site tokens only. */

/* ---------- page head (light) ---------- */
.ct-hero{background:var(--paper);padding:clamp(136px,13vw,176px) 0 clamp(36px,4vw,52px);border-bottom:1px solid var(--line)}
.ct-h1{font-size:clamp(2.2rem,4.4vw,3.5rem);font-weight:700;line-height:1.07;letter-spacing:-.03em;color:var(--ink);text-wrap:balance;max-width:24ch}
.ct-hero .lede,.ct-post-head .lede{margin-top:16px}
.ct-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:22px;font-size:.88rem;font-weight:500;color:var(--dim)}
.ct-crumb a{transition:color .15s}
.ct-crumb a:hover{color:var(--blue)}
.ct-crumb svg{width:12px;height:12px;opacity:.6}
.ct-crumb b{max-width:46ch;overflow:hidden;font-weight:600;color:var(--text);text-overflow:ellipsis;white-space:nowrap}
.ct-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;font-size:.86rem;color:var(--dim)}
.ct-meta b{font-weight:600;color:var(--blue)}

/* ---------- category chips ---------- */
.ct-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.ct-chips a{padding:8px 15px;border:1px solid var(--line-2);border-radius:999px;background:var(--white);font-size:.9rem;font-weight:500;color:var(--muted);transition:border-color .15s,color .15s}
.ct-chips a:hover{border-color:var(--blue);color:var(--blue)}
.ct-chips a[aria-current]{border-color:var(--ink);background:var(--ink);color:#fff}

/* ---------- cards ---------- */
.ct-list{padding:clamp(40px,5vw,64px) 0 var(--pad);background:var(--paper)}
.ct-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.ct-feature{margin-bottom:28px}
.ct-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-card);background:var(--white);transition:border-color .2s,box-shadow .2s,transform .2s}
.ct-card:hover{border-color:var(--line-2);box-shadow:0 18px 40px rgba(11,16,36,.08);transform:translateY(-2px)}
.ct-img{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--mist)}
.ct-img img{display:block;width:100%;height:100%;object-fit:cover}
.ct-ph{display:block;width:100%;height:100%;background:radial-gradient(90% 120% at 85% 110%,rgba(19,113,254,.55),rgba(19,113,254,0) 60%),linear-gradient(160deg,var(--deep),var(--void))}
.ct-txt{display:flex;flex-direction:column;gap:10px;padding:22px 24px 26px}
.ct-title{font-size:1.12rem;font-weight:600;line-height:1.35;letter-spacing:-.01em;color:var(--ink)}
.ct-txt p{display:-webkit-box;overflow:hidden;font-size:.94rem;line-height:1.55;color:var(--muted);-webkit-line-clamp:3;-webkit-box-orient:vertical}
.ct-card.-big{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
.ct-card.-big .ct-img{aspect-ratio:auto;min-height:340px}
.ct-card.-big .ct-txt{justify-content:center;padding:clamp(28px,4vw,52px)}
.ct-card.-big .ct-title{font-size:clamp(1.35rem,2vw,1.75rem);line-height:1.22;letter-spacing:-.02em}
.ct-card.-big p{-webkit-line-clamp:4}
.ct-empty{color:var(--muted)}
@media (max-width:1080px){.ct-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.ct-grid{grid-template-columns:1fr}.ct-card.-big{grid-template-columns:1fr}.ct-card.-big .ct-img{aspect-ratio:16/9;min-height:0}}

/* ---------- a post ---------- */
.ct-post{background:var(--white)}
.ct-post-head{padding:clamp(136px,13vw,176px) 0 0;background:linear-gradient(var(--paper) 0,var(--paper) calc(100% - 120px),var(--white) calc(100% - 120px))}
.ct-post-head .wrap>:not(.ct-hero-img){max-width:880px;margin-inline:auto}
.ct-post-head .ct-crumb{margin-inline:auto}
.ct-post-head .ct-meta{margin-bottom:14px}
.ct-post-head .ct-h1{font-size:clamp(1.9rem,3.2vw,2.7rem);max-width:none}
.ct-post-head:not(:has(.ct-hero-img)){padding-bottom:clamp(36px,4vw,52px);border-bottom:1px solid var(--line);background:var(--paper)}
.ct-hero-img{max-width:1040px;margin:44px auto 0;overflow:hidden;border:1px solid var(--line);border-radius:var(--r-card);background:var(--mist)}
.ct-hero-img img{display:block;width:100%;height:auto;max-height:600px;object-fit:cover}
.ct-post-cta{max-width:880px;margin:-24px auto var(--pad)}

/* long-form text */
.prose{max-width:880px;margin:0 auto;padding:clamp(40px,5vw,60px) 0 var(--pad);font-size:1.1rem;line-height:1.75;color:var(--text)}
.prose>*+*{margin-top:1.1em}
.prose h2,.prose h3,.prose h4,.prose h5{color:var(--ink);letter-spacing:-.015em;line-height:1.3}
.prose h2{margin-top:2em;font-size:1.6rem;font-weight:700}
.prose h3{margin-top:1.8em;font-size:1.3rem;font-weight:600}
.prose h4{margin-top:1.6em;font-size:1.12rem;font-weight:600}
.prose h5,.prose h6{margin-top:1.4em;font-size:1rem;font-weight:600}
.prose a{color:var(--blue);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.prose strong{font-weight:600;color:var(--ink)}
.prose ul,.prose ol{padding-left:1.4em}
.prose ul{list-style:disc}
.prose ol{list-style:decimal}
.prose ul ul{list-style:circle}
.prose li+li,.prose li>ul,.prose li>ol{margin-top:.45em}
.prose li::marker{color:var(--dim)}
.prose img{width:100%;height:auto;border-radius:14px}
.prose blockquote{padding-left:20px;border-left:3px solid var(--blue);font-size:1.12rem;color:var(--muted)}
.prose hr{border:0;border-top:1px solid var(--line)}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem}
.prose th,.prose td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose code{padding:.1em .35em;border-radius:6px;background:var(--mist);font-family:var(--mono);font-size:.88em}
.ct-embed{position:relative;aspect-ratio:16/9}
.ct-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:14px}

/* related posts */
.ct-more{padding:var(--pad) 0;border-top:1px solid var(--line);background:var(--paper)}
.ct-more-h{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:16px;margin-bottom:32px}

/* ---------- use case library (beam-use-case-library.html, beam-examples-library/) ---------- */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.uc-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:30px}
.uc-search{position:relative;flex:1 1 280px;display:flex;align-items:center}
.uc-search svg{position:absolute;left:15px;width:18px;height:18px;color:var(--dim);pointer-events:none}
.uc-search input,.uc-sel select{width:100%;height:48px;border:1px solid var(--line-2);border-radius:var(--r-btn);background:var(--white);font:inherit;font-size:.94rem;color:var(--ink);transition:border-color .15s}
.uc-search input{padding:0 14px 0 44px}
.uc-search input::placeholder{color:var(--dim)}
.uc-sel{position:relative;flex:0 1 228px}
.uc-sel select{padding:0 40px 0 15px;appearance:none;-webkit-appearance:none;cursor:pointer}
.uc-sel::after{content:"";position:absolute;top:50%;right:17px;width:7px;height:7px;border-right:2px solid var(--dim);border-bottom:2px solid var(--dim);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.uc-search input:hover,.uc-sel select:hover{border-color:var(--dim)}
.uc-search input:focus-visible,.uc-sel select:focus-visible{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.uc-clear{padding:0 6px;border:0;background:none;font:inherit;font-size:.94rem;font-weight:600;color:var(--blue);cursor:pointer}
.uc-filters .uc-clear{height:48px}
.uc-count{margin-bottom:22px;font-size:.92rem;color:var(--muted)}
.uc-count b{font-weight:600;color:var(--ink)}
.uc-card[hidden]{display:none}
.uc-img{position:relative;aspect-ratio:4/3;background:linear-gradient(180deg,var(--mist),var(--paper))}
.ct-img.uc-img img{position:absolute;inset:18px 22px;width:calc(100% - 44px);height:calc(100% - 36px);object-fit:contain}
.uc-none{padding:40px 0;color:var(--muted)}
/* a use case */
.uc-head{padding-bottom:clamp(40px,5vw,64px);border-bottom:1px solid var(--line);background:var(--paper)}
.ct-post-head.uc-head .uc-head-g{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
.ct-post-head.uc-head .uc-head-g>*{max-width:none;margin-inline:0}
.uc-head .ct-crumb{margin-inline:0}
.uc-head .ct-meta{margin-bottom:14px}
.uc-head .ct-h1{font-size:clamp(2rem,3.6vw,3rem);max-width:20ch}
.uc-intro{max-width:60ch}
.uc-intro p+p{margin-top:.8em}
.uc-fig{margin:0;padding:clamp(16px,2.5vw,28px);overflow:hidden;border:1px solid var(--line);border-radius:var(--r-card);background:var(--white)}
.uc-fig img{display:block;width:100%;height:auto;max-height:460px;object-fit:contain}
.uc-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(40px,5vw,72px);align-items:start;padding-block:clamp(40px,5vw,64px) var(--pad)}
.prose.uc-prose{max-width:760px;margin:0;padding:0}
.uc-prose h2:first-child{margin-top:0}
.uc-prose ul{padding:0;list-style:none;border-bottom:1px solid var(--line)}
.uc-prose li{position:relative;padding:14px 0 14px 34px;border-top:1px solid var(--line)}
.prose.uc-prose li+li{margin-top:0}
.uc-prose li::before{content:"";position:absolute;top:22px;left:4px;width:12px;height:7px;border-left:2px solid var(--blue);border-bottom:2px solid var(--blue);transform:rotate(-45deg)}
.uc-side{position:sticky;top:110px;display:grid;gap:24px;padding:24px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--paper)}
.uc-tg h2{margin-bottom:10px;font-size:.82rem;font-weight:600;color:var(--dim)}
.uc-tg ul{display:flex;flex-wrap:wrap;gap:8px}
.uc-tg a,.uc-tg span{display:inline-flex;padding:6px 12px;border:1px solid var(--line-2);border-radius:999px;background:var(--white);font-size:.86rem;font-weight:500;line-height:1.35;color:var(--text);transition:border-color .15s,color .15s}
.uc-tg a:hover{border-color:var(--blue);color:var(--blue)}
.uc-tg span{border-color:var(--line);background:transparent;color:var(--muted)}
@media (max-width:980px){
  .ct-post-head.uc-head .uc-head-g,.uc-body{grid-template-columns:minmax(0,1fr)}
  .uc-side{position:static}
}
@media (max-width:640px){.uc-sel{flex:1 1 100%}}