/* Blog pillar styles — cb-* namespace. Loaded on /blog/* pages. */

/* === Cowork blog (cb-*) — pillar article — fully scoped === */
.cb-article{
    --cb-text:#1a1d21;
    --cb-muted:#6b7480;
    --cb-soft:#f6f8fa;
    --cb-border:#e6e9ed;
    --cb-brand:#56cd74;
    --cb-brand-dark:#3eb35d;
    --cb-dark:#0d0f12;
    --cb-warn:#f0c548;
    --cb-info:#5fa0e8;
    --cb-radius:14px;
    color:var(--cb-text);
    font:400 17px/1.65 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    max-width:none;
    margin:0;
}
.cb-article *,
.cb-article *::before,
.cb-article *::after{box-sizing:border-box;}

/* Hero */
.cb-hero{
    position:relative;
    margin:0 0 32px;
    padding:54px 32px 44px;
    background:
        radial-gradient(ellipse at 80% -10%, rgba(86,205,116,.18), transparent 60%),
        linear-gradient(140deg, #14181d 0%, #0d0f12 100%);
    color:#fff;
    border-radius:var(--cb-radius);
    overflow:hidden;
}
.cb-hero::before{
    content:"";
    position:absolute;
    inset:auto -40px -40px auto;
    width:280px;height:280px;
    background:radial-gradient(circle, rgba(86,205,116,.22), transparent 70%);
    pointer-events:none;
}
.cb-hero__eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    padding:5px 12px;margin-bottom:18px;
    background:rgba(86,205,116,.14);
    border:1px solid rgba(86,205,116,.32);
    border-radius:999px;
    color:var(--cb-brand);
    font-size:12px;letter-spacing:.06em;text-transform:uppercase;
    font-weight:600;line-height:1;
}
.cb-hero__eyebrow::before{
    content:"";width:6px;height:6px;border-radius:50%;
    background:var(--cb-brand);
    box-shadow:0 0 0 3px rgba(86,205,116,.25);
}
.cb-hero__title{
    margin:0 0 14px;
    color:#fff;
    font-size:38px;line-height:1.15;font-weight:700;
    letter-spacing:-.01em;
    max-width:780px;
}
.cb-hero__lead{
    margin:0 0 22px;
    color:#c4ccd4;
    font-size:17px;line-height:1.55;
    max-width:680px;
}
.cb-hero__meta{
    display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;
    color:#a4adb6;font-size:13.5px;
}
.cb-hero__meta strong{color:#fff;font-weight:600;}
.cb-hero__meta-dot{
    display:inline-block;width:3px;height:3px;border-radius:50%;
    background:#5a626c;margin:0 -2px;
}

/* Article layout — desktop sidebar TOC, mobile collapsed at top */
.cb-layout{
    display:grid;
    grid-template-columns:minmax(0, 1fr) 260px;
    gap:48px;
    align-items:start;
}
.cb-prose{min-width:0;max-width:760px;}
.cb-toc{
    position:sticky;top:24px;
    padding:18px 18px 16px;
    background:var(--cb-soft);
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
    font-size:14px;
}
.cb-toc__title{
    margin:0 0 10px;
    font-size:11px;letter-spacing:.08em;text-transform:uppercase;
    color:var(--cb-muted);font-weight:600;
}
.cb-toc__list{margin:0;padding:0;list-style:none;}
.cb-toc__list li{margin:0 0 6px;line-height:1.4;}
.cb-toc__list a{
    color:var(--cb-text);text-decoration:none;
    display:block;padding:4px 8px;border-radius:6px;
    transition:background .12s ease, color .12s ease;
    border-left:2px solid transparent;
}
.cb-toc__list a:hover{
    background:#fff;color:var(--cb-brand-dark);
    border-left-color:var(--cb-brand);
}

/* Mobile TOC */
.cb-toc-mobile{
    display:none;
    margin:0 0 28px;
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
    background:var(--cb-soft);
    overflow:hidden;
}
.cb-toc-mobile summary{
    cursor:pointer;
    padding:14px 18px;
    list-style:none;
    font-size:13px;letter-spacing:.05em;text-transform:uppercase;
    color:var(--cb-muted);font-weight:600;
    display:flex;justify-content:space-between;align-items:center;
}
.cb-toc-mobile summary::-webkit-details-marker{display:none;}
.cb-toc-mobile summary::after{
    content:"+";font-size:18px;color:var(--cb-brand);
    transition:transform .15s ease;
}
.cb-toc-mobile[open] summary::after{content:"–";}
.cb-toc-mobile ol{
    margin:0;padding:0 18px 14px 38px;
    font-size:14.5px;line-height:1.5;
}
.cb-toc-mobile ol li{margin:0 0 4px;}
.cb-toc-mobile a{color:var(--cb-text);text-decoration:none;}
.cb-toc-mobile a:hover{color:var(--cb-brand-dark);}

/* Prose typography */
.cb-prose h2{
    margin:48px 0 18px;
    font-size:28px;line-height:1.25;font-weight:700;
    letter-spacing:-.005em;
    color:var(--cb-text);
    scroll-margin-top:24px;
}
.cb-prose h2:first-child{margin-top:0;}
.cb-prose h3{
    margin:32px 0 12px;
    font-size:21px;line-height:1.3;font-weight:600;
    color:var(--cb-text);
}
.cb-prose h4{
    margin:24px 0 10px;
    font-size:17px;line-height:1.35;font-weight:600;
    color:var(--cb-text);
}
.cb-prose p{margin:0 0 16px;}
.cb-prose strong{font-weight:600;color:var(--cb-text);}
.cb-prose a{
    color:var(--cb-brand-dark);text-decoration:none;
    border-bottom:1px solid rgba(62,179,93,.4);
    transition:border-color .12s ease;
}
.cb-prose a:hover{border-bottom-color:var(--cb-brand);}
.cb-prose ul,.cb-prose ol{margin:0 0 18px;padding-left:24px;}
.cb-prose li{margin:0 0 6px;}
.cb-prose hr{
    margin:36px 0;
    border:0;border-top:1px solid var(--cb-border);
}

/* Tables */
.cb-prose table{
    width:100%;
    border-collapse:collapse;
    margin:18px 0 24px;
    font-size:15.5px;
    background:#fff;
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
    overflow:hidden;
}
.cb-prose thead th{
    background:var(--cb-soft);
    color:var(--cb-text);
    font-weight:600;
    text-align:left;
    padding:12px 14px;
    border-bottom:1px solid var(--cb-border);
    font-size:13.5px;letter-spacing:.02em;
}
.cb-prose tbody td{
    padding:11px 14px;
    border-bottom:1px solid var(--cb-border);
    vertical-align:top;
}
.cb-prose tbody tr:last-child td{border-bottom:0;}
.cb-prose tbody tr:hover{background:rgba(86,205,116,.04);}

/* Callouts */
.cb-callout{
    margin:22px 0;
    padding:16px 18px 16px 18px;
    background:var(--cb-soft);
    border-left:3px solid var(--cb-brand);
    border-radius:8px;
    font-size:15.5px;line-height:1.6;
}
.cb-callout--warn{
    background:#fff8e6;
    border-left-color:var(--cb-warn);
}
.cb-callout--info{
    background:#eff6ff;
    border-left-color:var(--cb-info);
}
.cb-callout strong{color:var(--cb-text);}
.cb-callout p:last-child{margin-bottom:0;}

/* FAQ — native <details> styled */
.cb-faq{
    margin:18px 0 28px;
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
    overflow:hidden;
    background:#fff;
}
.cb-faq__item{
    border-bottom:1px solid var(--cb-border);
}
.cb-faq__item:last-child{border-bottom:0;}
.cb-faq__item summary{
    cursor:pointer;
    list-style:none;
    padding:16px 18px;
    font-size:16px;font-weight:600;
    color:var(--cb-text);
    display:flex;align-items:flex-start;justify-content:space-between;
    gap:14px;
    transition:background .12s ease;
}
.cb-faq__item summary::-webkit-details-marker{display:none;}
.cb-faq__item summary:hover{background:var(--cb-soft);}
.cb-faq__item summary::after{
    content:"";
    flex-shrink:0;
    width:18px;height:18px;
    background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'><path d='M5 7l4 4 4-4' stroke='%2356cd74' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/></svg>") center/contain no-repeat;
    transition:transform .18s ease;
    margin-top:4px;
}
.cb-faq__item[open] summary::after{transform:rotate(180deg);}
.cb-faq__answer{
    padding:0 18px 18px;
    font-size:15.5px;line-height:1.65;color:#363b41;
}
.cb-faq__answer p:last-child{margin-bottom:0;}

/* Related pillars */
.cb-related{
    margin:48px 0 0;
    padding:28px;
    background:var(--cb-soft);
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
}
.cb-related__title{
    margin:0 0 16px;
    font-size:18px;font-weight:600;color:var(--cb-text);
}
.cb-related__grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:12px;
}
.cb-related a{
    display:block;
    padding:14px 16px;
    background:#fff;
    border:1px solid var(--cb-border);
    border-radius:10px;
    text-decoration:none;
    color:var(--cb-text);
    transition:transform .12s ease, border-color .12s ease;
    font-size:14.5px;line-height:1.4;
}
.cb-related a:hover{
    border-color:var(--cb-brand);
    transform:translateY(-1px);
}
.cb-related a strong{
    display:block;color:var(--cb-text);font-weight:600;
    margin-bottom:3px;
}
.cb-related a span{color:var(--cb-muted);font-size:13px;}

/* Author */
.cb-author{
    margin:36px 0 0;
    padding:22px 24px;
    background:#fff;
    border:1px solid var(--cb-border);
    border-radius:var(--cb-radius);
    display:flex;gap:18px;align-items:center;
}
.cb-author__avatar{
    flex-shrink:0;
    width:64px;height:64px;border-radius:50%;
    background:linear-gradient(135deg, var(--cb-brand) 0%, var(--cb-brand-dark) 100%);
    color:#fff;
    display:flex;align-items:center;justify-content:center;
    font-size:24px;font-weight:600;
}
.cb-author__body{flex:1;}
.cb-author__label{
    font-size:11px;letter-spacing:.08em;text-transform:uppercase;
    color:var(--cb-muted);font-weight:600;
    margin-bottom:4px;
}
.cb-author__name{
    margin:0 0 4px;
    font-size:17px;font-weight:600;color:var(--cb-text);
}
.cb-author__bio{
    margin:0;
    font-size:14px;line-height:1.55;color:var(--cb-muted);
}

/* CTA banner mid-article */
.cb-cta{
    margin:30px 0;
    padding:22px 26px;
    background:linear-gradient(135deg, #14181d 0%, #0d0f12 100%);
    color:#fff;
    border-radius:var(--cb-radius);
    display:flex;justify-content:space-between;align-items:center;
    gap:20px;flex-wrap:wrap;
}
.cb-cta__text{flex:1;min-width:240px;}
.cb-cta__text strong{color:#fff;display:block;margin-bottom:4px;font-size:16px;}
.cb-cta__text span{color:#b9c2cc;font-size:14px;}
.cb-cta__btn{
    flex-shrink:0;
    background:var(--cb-brand);color:var(--cb-dark);
    padding:11px 20px;border-radius:8px;
    font-weight:600;font-size:14.5px;
    text-decoration:none;
    transition:background .12s ease;
}
.cb-cta__btn:hover{background:var(--cb-brand-dark);color:#fff;}

/* Responsive */
@media (max-width: 1024px){
    .cb-layout{grid-template-columns:1fr;gap:0;}
    .cb-toc{display:none;}
    .cb-toc-mobile{display:block;}
    .cb-prose{max-width:760px;margin:0 auto;}
}
@media (max-width: 640px){
    .cb-hero{padding:36px 22px 30px;border-radius:0;margin-left:-15px;margin-right:-15px;}
    .cb-hero__title{font-size:28px;}
    .cb-hero__lead{font-size:15.5px;}
    .cb-hero__meta{font-size:12.5px;gap:8px 14px;}
    .cb-prose h2{font-size:23px;margin:36px 0 14px;}
    .cb-prose h3{font-size:18.5px;}
    .cb-prose{font-size:16.5px;}
    .cb-prose table{font-size:14px;}
    .cb-prose thead th,.cb-prose tbody td{padding:10px 11px;}
    .cb-cta{padding:18px;}
    .cb-related{padding:22px 18px;}
    .cb-author{padding:18px;flex-direction:column;align-items:flex-start;text-align:left;}
}

/* === pillar-polish v2 === */
/* hide page-title chrome (gray camera header) on blog */
.page-title--img { display: none !important; }
/* hide empty intro area (we don't use introtext on pillars) */
article.editor-area .content-area--intro { display: none !important; }

/* one-column layout — sidebar gone, prose full width */
.cb-layout { grid-template-columns: 1fr !important; max-width: 820px !important; margin: 0 auto !important; }
.cb-prose { max-width: 100% !important; }
.cb-toc, .cb-toc-mobile { display: none !important; }