/* The About page and the blog: community.stonkbuilder.com/about and /blog (app/community_blog.py).
   Loaded after landing.css, which supplies the header, footer, buttons, FAQ list and colour
   variables (dark by default); theme.css switches the variables for the light theme, and the
   light-only colours below keep accents readable on a light background. */
.blog-page{--ink:#c7f36f;--card:#151a14;--card-hover:#62784f;--prose:#d3dacb;--quiet:#98a38f;--callout:#182017;--warn:#2a2213;--warn-line:#6d5a2c}
.site-nav>a[aria-current=page]:not(.button){color:var(--lime);box-shadow:inset 0 -2px 0 var(--lime);padding-block:6px}
.footer-main nav a[aria-current=page]{color:var(--lime)}
.blog-page .eyebrow{margin-bottom:16px}
.blog-page main:focus{outline:none}

/* Heroes (blog index, About, not found) */
.bl-hero,.ab-hero{padding-block:76px 34px}
.bl-hero h1,.ab-hero h1{margin:0;font-size:clamp(44px,6.4vw,82px);font-weight:710;letter-spacing:-.07em;line-height:1}
.bl-hero h1 em,.ab-hero h1 em,.blog-page .section-heading h2 em{font-style:normal;color:var(--ink)}
.bl-lede,.ab-lede{max-width:700px;margin:24px 0 0;color:#b8c0b1;font-size:18px;line-height:1.7}
.bl-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.bl-topics{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.bl-topics a{padding:7px 13px;border:1px solid var(--line);border-radius:999px;background:var(--panel);color:#c6ceba;font-size:12px}
.bl-topics a:hover{border-color:var(--card-hover);color:var(--ink)}

/* Sections and cards */
.bl-section{padding-block:58px}
.bl-section .section-heading{margin-bottom:28px}
.bl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
.bl-grid-featured{grid-template-columns:repeat(3,minmax(0,1fr))}
.bl-topic{margin:34px 0 16px;color:var(--quiet);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.bl-topic:first-of-type{margin-top:0}
.bl-card{display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--panel);transition:border-color .18s ease,transform .18s ease}
.bl-card:hover{border-color:var(--card-hover);transform:translateY(-2px)}
.bl-card-cover{display:block;overflow:hidden;border-bottom:1px solid var(--line);background:#0b0e0b}
.bl-card-cover img{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;transition:transform .35s ease}
.bl-card:hover .bl-card-cover img{transform:scale(1.025)}
.bl-card-body{display:flex;flex:1;flex-direction:column;gap:10px;padding:20px 20px 22px}
.bl-card-kind{margin:0;color:var(--ink);font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.bl-card h3{margin:0;font-size:21px;font-weight:700;letter-spacing:-.035em;line-height:1.2}
.bl-card h3 a:hover{color:var(--ink)}
.bl-card-body>p:not(.bl-card-kind):not(.bl-card-meta){margin:0;color:var(--muted);font-size:13.5px;line-height:1.65}
.bl-card-meta{margin:auto 0 0;padding-top:6px;color:var(--quiet);font-size:11.5px}
.bl-card-featured h3{font-size:23px}

/* The guide library */
.bl-lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.bl-lib{display:flex;flex-direction:column;gap:12px;padding:22px 22px 24px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.bl-lib-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.bl-lib h3{margin:0;font-size:23px;letter-spacing:-.04em}
.bl-lib h3 a:hover{color:var(--ink)}
.bl-lib-head span{flex:none;padding:3px 10px;border:1px solid var(--line);border-radius:999px;color:#c6ceba;font-size:11px}
.bl-lib>p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.bl-lib-list{display:grid;gap:2px;margin:0;padding:0;list-style:none;counter-reset:guide}
.bl-lib-list li{counter-increment:guide}
.bl-lib-list a{display:grid;grid-template-columns:26px 1fr auto;gap:8px;padding:9px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.45}
.bl-lib-list a::before{content:counter(guide,decimal-leading-zero);color:var(--quiet);font-size:11px;padding-top:2px}
.bl-lib-list a:hover{color:var(--ink)}
.bl-lib-more{margin:0;color:var(--quiet);font-size:12px}
.bl-lib .text-link{margin-top:auto;padding-top:4px}

/* The basics and the mission band */
.bl-basics{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px;align-items:start;margin-block:30px;padding:36px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.bl-basics h2{margin:0;font-size:clamp(30px,3.6vw,42px);letter-spacing:-.055em;line-height:1.08}
.bl-basics-copy>p:not(.eyebrow){margin:16px 0 18px;color:var(--muted);font-size:14px;line-height:1.75}
.bl-basics-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}
.bl-basic{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 12px;height:100%;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel-raised)}
.bl-basic strong{font-size:14px}
.bl-basic small{grid-column:1;color:var(--muted);font-size:12px;line-height:1.5}
.bl-basic b{grid-row:1/3;grid-column:2;color:var(--ink)}
.bl-basic:hover{border-color:var(--card-hover)}
.bl-mission{padding-block:70px 90px;text-align:center}
.bl-mission-quote{max-width:900px;margin:0 auto 22px;font-size:clamp(26px,3.3vw,40px);font-weight:650;letter-spacing:-.045em;line-height:1.22}
.bl-not-found{display:grid;gap:8px;margin:28px 0 0;padding:0 0 0 18px;font-size:15px}
.bl-not-found a{color:var(--ink)}

/* A post */
.bp{padding-block:42px 60px}
.bp-crumbs{display:flex;flex-wrap:wrap;gap:8px;color:var(--quiet);font-size:12px}
.bp-crumbs a:hover{color:var(--ink)}
.bp-head{max-width:880px;padding-block:28px 30px}
.bp-kicker{display:flex;align-items:center;gap:10px;margin:0;color:var(--ink);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.bp-kicker-icon{display:grid;place-items:center;width:30px;height:30px;border:1px solid #9dc86e44;border-radius:9px;background:#c7f36f10}
.bp-kicker .ic{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.bp-head h1{margin:18px 0 0;font-size:clamp(34px,4.6vw,56px);font-weight:720;letter-spacing:-.055em;line-height:1.06}
.bp-lede{max-width:760px;margin:20px 0 0;color:#bdc5b5;font-size:19px;line-height:1.65}
.bp-meta{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.bp-meta li{padding:5px 11px;border:1px solid var(--line);border-radius:999px;color:#c6ceba;font-size:12px}
.bp-layout{display:grid;grid-template-columns:230px minmax(0,740px);gap:56px;align-items:start;border-top:1px solid var(--line);padding-top:36px}
.bp-side{position:sticky;top:100px;display:grid;gap:18px}
.bp-toc p{margin:0 0 10px;color:var(--quiet);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.bp-toc ol{display:grid;gap:2px;margin:0;padding:0;list-style:none}
.bp-toc a{display:block;padding:6px 0 6px 12px;border-left:2px solid var(--line);color:#b3bca9;font-size:13px;line-height:1.4}
.bp-toc a:hover{border-color:var(--ink);color:var(--ink)}
.bp-side-card{display:grid;gap:6px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.bp-side-card p{margin:0;font-size:14px;font-weight:700}
.bp-side-card span{color:var(--muted);font-size:12.5px;line-height:1.55}
.bp-side-card .text-link{margin-top:4px;white-space:normal}
.bp-main{min-width:0}
.bp-short{padding:22px 24px;border:1px solid #58703f;border-radius:14px;background:linear-gradient(145deg,#1d2918,#161b14)}
.bp-short h2,.bp-words h2{margin:0 0 12px;font-size:13px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;color:var(--ink)}
.bp-short ul{display:grid;gap:9px;margin:0;padding-left:20px;color:var(--prose);font-size:15.5px;line-height:1.6}
.bp-words{margin-top:22px;padding:22px 24px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.bp-words dl{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px;margin:0}
.bp-words dt{font-size:14px;font-weight:700}
.bp-words dd{margin:3px 0 0;color:var(--muted);font-size:13.5px;line-height:1.55}
.bp-words-more{margin:16px 0 0;color:var(--quiet);font-size:12.5px}
.bp-words-more a{color:var(--ink)}
.bp-prose{margin-top:10px;color:var(--prose);font-size:17px;line-height:1.8}
.bp-prose h2{margin:46px 0 14px;color:var(--text);font-size:clamp(24px,2.6vw,30px);letter-spacing:-.04em;line-height:1.2;scroll-margin-top:100px}
.bp-prose h3{margin:30px 0 10px;color:var(--text);font-size:20px;letter-spacing:-.025em;line-height:1.3}
.bp-prose p{margin:0 0 16px}
.bp-prose strong{color:var(--text)}
.bp-prose a,.bp-faq a,.bp-short a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.bp-prose a:hover{text-decoration-thickness:2px}
.bp-ul,.bp-ol{display:grid;gap:10px;margin:0 0 18px;padding-left:24px}
.cite{margin-left:1px;font-size:.72em;line-height:0}
.cite a{text-decoration:none!important}
.bp-steps{display:grid;gap:12px;margin:8px 0 22px;padding:0;list-style:none}
.bp-step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:var(--panel);scroll-margin-top:100px}
.bp-step-no{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#c7f36f17;color:var(--ink);font-size:13px;font-weight:750}
.bp-step h3{margin:6px 0 6px;font-size:17.5px;letter-spacing:-.02em}
.bp-step p{margin:0;font-size:15.5px;line-height:1.7}
.bp-table{overflow-x:auto;margin:8px 0 24px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.bp-table:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.bp-table table{width:100%;min-width:560px;border-collapse:collapse;font-size:14px;line-height:1.5}
.bp-table caption{padding:14px 16px 4px;color:var(--quiet);font-size:11px;font-weight:700;letter-spacing:.12em;text-align:left;text-transform:uppercase}
.bp-table th,.bp-table td{padding:11px 16px;border-top:1px solid var(--line);text-align:left;vertical-align:top}
.bp-table thead th{border-top:0;color:var(--quiet);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.bp-table tbody th{color:var(--text);font-weight:680}
@media (max-width:640px){
  .bp-table table{min-width:0;font-size:13px}
  .bp-table th,.bp-table td{padding:10px 12px}
  .bp-table caption{padding:12px 12px 4px}
  .bp-table table[data-cols="4"] :is(th,td){padding:9px 8px}
  .bp-table table[data-cols="4"] thead th{letter-spacing:.03em}
}
@media (max-width:360px){
  .bp-table table{font-size:12px}
  .bp-table th,.bp-table td{padding:9px 8px}
  .bp-table table[data-cols="4"] :is(th,td){padding:8px 5px}
  .bp-table thead th{font-size:10px;letter-spacing:.02em}
}
.bp-callout{margin:10px 0 24px;padding:18px 20px;border:1px solid var(--line);border-left:3px solid var(--ink);border-radius:12px;background:var(--callout)}
.bp-callout p{margin:0;font-size:15.5px;line-height:1.7}
.bp-callout .bp-callout-title{margin-bottom:6px;color:var(--text);font-size:12px;font-weight:750;letter-spacing:.1em;text-transform:uppercase}
.bp-plain{border-left-color:#86d1e4}
.bp-warn{border-color:var(--warn-line);border-left-color:#e4bf65;background:var(--warn)}
.bp-faq,.bp-hubs,.bp-journal,.bp-sources,.bp-related{margin-top:44px}
.bp-faq h2,.bp-hubs h2,.bp-journal h2,.bp-sources h2,.bp-related h2{margin:0 0 14px;font-size:24px;letter-spacing:-.035em}
.bp-journal ul{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.bp-journal a{display:flex;justify-content:space-between;gap:14px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-size:14.5px;line-height:1.45}
.bp-journal a:hover{border-color:var(--card-hover)}
.bp-journal b{flex:none;color:var(--ink)}
.bp-faq .faq-list summary{font-size:15px}
.bp-faq .faq-list details p{font-size:14.5px}
.bp-hubs ul,.bp-related ul{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}
.bp-hubs a,.bp-related a{display:grid;grid-template-columns:1fr auto;gap:4px 12px;height:100%;padding:15px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.bp-hubs a:hover,.bp-related a:hover{border-color:var(--card-hover)}
.bp-hubs strong{font-size:15px}
.bp-hubs small{grid-column:1;color:var(--muted);font-size:12.5px;line-height:1.5}
.bp-hubs span{grid-row:1/3;grid-column:2;align-self:center;color:var(--ink)}
.bp-related small{color:var(--ink);font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.bp-related strong{grid-column:1;font-size:14.5px;line-height:1.4}
.bp-sources ol{display:grid;gap:8px;margin:0;padding-left:24px;font-size:14px}
.bp-sources li{scroll-margin-top:100px}
.bp-sources a{color:var(--text)}
.bp-sources a:hover{color:var(--ink)}
.bp-sources small{display:block;color:var(--quiet);font-size:12px;word-break:break-all}
.bp-sources>p{margin:12px 0 0;color:var(--quiet);font-size:12.5px}
.bp-notice,.ab-notice{margin:34px 0 0;padding-top:18px;border-top:1px solid var(--line);color:var(--quiet);font-size:12px;line-height:1.7}
.ab-notice{padding-bottom:40px}
.bp-pager{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:40px}
.bp-pager a{display:grid;gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
.bp-pager a:hover{border-color:var(--card-hover)}
.bp-pager small{color:var(--quiet);font-size:11px}
.bp-pager strong{font-size:14.5px;line-height:1.4}
.bp-next{text-align:right}

/* About */
.ab-statements{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-block:10px 30px}
.ab-statement{padding:34px 34px 38px;border:1px solid #58703f;border-radius:18px;background:linear-gradient(150deg,#22301b,#161b14 80%)}
.ab-vision{border-color:var(--line);background:linear-gradient(150deg,#1b2420,#151a14 80%)}
.ab-quote{margin:0;font-size:clamp(22px,2.5vw,30px);font-weight:650;letter-spacing:-.04em;line-height:1.3}
.ab-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ab-card{display:flex;flex-direction:column;gap:10px;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.ab-icon{display:grid;place-items:center;width:40px;height:40px;border:1px solid #9dc86e33;border-radius:12px;background:#c7f36f0c;color:var(--ink)}
.ab-icon .ic{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ab-card h3{margin:4px 0 0;font-size:19px;letter-spacing:-.03em}
.ab-card p{margin:0 0 6px;color:var(--muted);font-size:13.5px;line-height:1.65}
.ab-card .text-link{margin-top:auto;white-space:normal}
.ab-audience,.ab-never{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;list-style:none}
.ab-audience li,.ab-never li{display:grid;gap:6px;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.ab-audience strong,.ab-never strong{font-size:17px;letter-spacing:-.02em}
.ab-audience span,.ab-never span{color:var(--muted);font-size:14px;line-height:1.65}
.ab-never li{grid-template-columns:30px 1fr;column-gap:12px}
.ab-never li::before{content:"✕";grid-row:1/3;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e4bf651c;color:#e8cf8a;font-size:13px;font-weight:700}
.ab-principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.ab-principles li{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:20px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.ab-no{color:var(--ink);font-size:13px;font-weight:750;padding-top:3px}
.ab-principles h3{margin:0 0 6px;font-size:17px;letter-spacing:-.02em}
.ab-principles p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.65}
.ab-checklist{display:grid;grid-template-columns:1fr 1fr;gap:10px 26px;margin:0;padding:0;list-style:none;counter-reset:check}
.ab-checklist li{position:relative;padding:14px 0 14px 44px;border-top:1px solid var(--line);color:var(--muted);font-size:14.5px;line-height:1.6;counter-increment:check}
.ab-checklist li::before{content:counter(check,decimal-leading-zero);position:absolute;left:0;top:14px;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#c7f36f17;color:var(--ink);font-size:11px;font-weight:750}
.ab-checklist strong{color:var(--text)}
.ab-more{margin:20px 0 0}
.ab-family{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:0;list-style:none}
.ab-family a{display:grid;grid-template-columns:1fr auto;gap:6px 10px;height:100%;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.ab-family a:hover{border-color:var(--card-hover)}
.ab-family strong{font-size:15.5px}
.ab-family small{grid-column:1;color:var(--muted);font-size:13px;line-height:1.55}
.ab-family b{grid-row:1/3;grid-column:2;color:var(--ink)}
.about-page .final-cta{border-top:1px solid var(--line)}

@media(max-width:1060px){.bp-layout{grid-template-columns:1fr;gap:26px}.bp-side{position:static;grid-template-columns:1fr 1fr}.ab-cards,.ab-family{grid-template-columns:1fr 1fr}.ab-principles{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.bl-grid-featured{grid-template-columns:1fr 1fr}.bl-basics{grid-template-columns:1fr;gap:22px;padding:26px}}
@media(max-width:680px){
.bl-hero,.ab-hero{padding-block:48px 20px}.bl-lede,.ab-lede{font-size:16px}.bl-section{padding-block:40px}
.bl-grid,.bl-grid-featured,.bl-lib-grid{grid-template-columns:1fr}.bl-basics-list{grid-template-columns:1fr}
.bl-basics{padding:20px;margin-block:18px}.bl-mission{padding-block:46px 60px}
.bp{padding-block:26px 44px}.bp-head{padding-block:20px 22px}.bp-lede{font-size:17px}.bp-side{grid-template-columns:1fr}
.bp-prose{font-size:16px}.bp-step{grid-template-columns:1fr;gap:10px;padding:16px}.bp-step-no{width:34px;height:34px}
.bp-words dl,.bp-hubs ul,.bp-related ul,.bp-pager{grid-template-columns:1fr}.bp-next{text-align:left}
.bp-short,.bp-words{padding:18px}
.ab-statements,.ab-cards,.ab-audience,.ab-never,.ab-principles,.ab-checklist,.ab-family{grid-template-columns:1fr}
.ab-statement{padding:24px 22px 26px}}

/* Light theme: dark-green ink instead of lime, white cards */
html[data-theme="light"] .blog-page{--ink:#3d6a1c;--card-hover:#a9c28b;--prose:#323c2f;--quiet:#5d6857;--callout:#f1f5ea;--warn:#fbf6e6;--warn-line:#e4d69f}
html[data-theme="light"] .blog-page .eyebrow{color:#4a6d24}
html[data-theme="light"] .blog-page .live-dot{background:#7fa94a;box-shadow:none}
html[data-theme="light"] .bl-hero h1 em,html[data-theme="light"] .ab-hero h1 em,html[data-theme="light"] .blog-page .section-heading h2 em,html[data-theme="light"] .blog-page .final-cta h2 em{color:#5e8a2c}
html[data-theme="light"] .blog-page .text-link{color:#3f5f1f}
html[data-theme="light"] .bl-lede,html[data-theme="light"] .ab-lede,html[data-theme="light"] .bp-lede{color:#4f5b4a}
html[data-theme="light"] .bl-topics a,html[data-theme="light"] .bl-lib-head span,html[data-theme="light"] .bp-meta li{color:#4b5846;background:#fff}
html[data-theme="light"] .bl-card-cover{background:#e8ece3}
html[data-theme="light"] .bp-short{border-color:#b8ce9b;background:linear-gradient(145deg,#eef5e3,#f7faf2)}
html[data-theme="light"] .bp-kicker-icon,html[data-theme="light"] .bp-step-no,html[data-theme="light"] .ab-icon,html[data-theme="light"] .ab-checklist li::before{background:#e8f2dc;border-color:#c9dcb2}
html[data-theme="light"] .bp-toc a{color:#4b5846}
html[data-theme="light"] .bp-warn{border-left-color:#c79a2c}
html[data-theme="light"] .bp-plain{border-left-color:#3f8fa6}
html[data-theme="light"] .ab-statement{border-color:#b8ce9b;background:linear-gradient(150deg,#eaf3dd,#fbfdf8 80%)}
html[data-theme="light"] .ab-vision{border-color:#cfdbd6;background:linear-gradient(150deg,#e6f0ee,#fbfdfc 80%)}
html[data-theme="light"] .ab-never li::before{background:#f7ecd0;color:#8a6414}
html[data-theme="light"] .blog-page .site-nav>a[aria-current=page]:not(.button),html[data-theme="light"] .blog-page .footer-main nav a[aria-current=page]{color:#3f5f1f}
html[data-theme="light"] .blog-page .site-nav>a[aria-current=page]:not(.button){box-shadow:inset 0 -2px 0 #7fa94a}
@media(max-width:680px){.site-nav>a[aria-current=page]:not(.button),html[data-theme="light"] .blog-page .site-nav>a[aria-current=page]:not(.button){box-shadow:none}}