/* ============================================================
   BONE & INK — shared template stylesheet
   Loaded on: blog/guide articles, blog.html, guides.html,
   all-posts.html, all-guides.html.
   Link this AFTER styles.css so it overrides the old dark theme.
   Not yet loaded on: case-study.html, about.html, and other
   pages still pending their own pass.
   ============================================================ */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:300 700;font-display:swap;src:url('fonts/fraunces-variable.woff2') format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:400 600;font-display:swap;src:url('fonts/fraunces-italic.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url('fonts/ibm-plex-sans-variable.woff2') format('woff2');}

:root{
  --bk-bone:#F2EEE6; --bk-bone-raised:#FAF7F1; --bk-bone-sunken:#E6E0D4;
  --bk-ink:#1C1815; --bk-ink-soft:#5C544A; --bk-rule:#D8D1C3; --bk-surface-dark:#332A22;
  --bk-rust:#A8412A; --bk-rust-light:#D97757;
  --bk-serif:'Fraunces',Georgia,serif; --bk-sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}

body{background:var(--bk-bone)!important;color:var(--bk-ink)!important;font-family:var(--bk-sans)!important;}
body::before{display:none;}
main{position:relative;z-index:1;}
main h1,main h2,main h3{font-family:var(--bk-serif)!important;font-weight:600;letter-spacing:-.015em;}
main section{border-top-color:var(--bk-rule)!important;}
.sec-label{color:var(--bk-rust)!important;font-family:var(--bk-sans)!important;}
.sec-label::after{background:linear-gradient(90deg,var(--bk-rust),transparent 60%)!important;}
.sec-title{color:var(--bk-ink);}

/* ---- header ---- */
header{background:rgba(242,238,230,.94)!important;border-bottom:1px solid var(--bk-rule)!important;backdrop-filter:blur(8px);}
.brand{font-family:var(--bk-serif)!important;font-weight:600!important;font-size:19px!important;color:var(--bk-ink)!important;letter-spacing:-.01em!important;}
.brand span{color:var(--bk-rust);}
.nav-links a{color:var(--bk-ink-soft)!important;}
.nav-links a:hover{color:var(--bk-ink)!important;}
.nav-links a.nav-cta{background:var(--bk-rust)!important;border-color:var(--bk-rust)!important;color:var(--bk-bone)!important;}
.nav-links a.nav-cta:hover{background:#8F3624!important;color:var(--bk-bone)!important;}
.nav-toggle span{background:var(--bk-ink)!important;}
.dropdown{background:var(--bk-surface-dark)!important;border-color:rgba(242,238,230,.15)!important;}
.dropdown a{color:rgba(242,238,230,.8)!important;}
.dropdown a:hover{color:var(--bk-rust-light)!important;background:rgba(217,119,87,.1)!important;}
@media(max-width:860px){ #navLinks.open{background:var(--bk-bone-raised)!important;border-color:var(--bk-rule)!important;} }

/* ---- buttons ---- */
.btn{border-radius:2px;}
.btn.gold{background:var(--bk-rust)!important;border-color:var(--bk-rust)!important;color:var(--bk-bone)!important;font-weight:600;}
.btn.gold:hover{background:#8F3624!important;border-color:#8F3624!important;}
.btn.ghost{border-color:var(--bk-ink)!important;color:var(--bk-ink)!important;}
.btn.ghost:hover{border-color:var(--bk-rust)!important;color:var(--bk-rust)!important;}

/* ---- article hero + banner card ---- */
.article-hero-card{border:1px solid var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}
.article-hero-card h1{color:var(--bk-ink);}
.article-hero .case-kicker{color:var(--bk-rust)!important;}
.article-hero p.dek{color:var(--bk-ink-soft)!important;}
/* Dropped: the dark watermark banner (ghost "AK" + chip) read as empty
   decorative filler once the card sat on a light background. The card now
   just ends cleanly after the byline. */
.hero-banner-panel{display:none!important;}
.article-hero-card .article-hero-pad{padding-bottom:40px!important;}
.article-banner{border-color:var(--bk-rule)!important;background:
    radial-gradient(circle at 28% 25%, rgba(168,65,42,0.16), transparent 55%),
    repeating-linear-gradient(0deg, rgba(28,24,21,0.05) 0 1px, transparent 1px 32px),
    repeating-linear-gradient(90deg, rgba(28,24,21,0.05) 0 1px, transparent 1px 32px),
    var(--bk-surface-dark)!important;}
.article-banner svg{color:var(--bk-rust-light)!important;}

/* ---- case-kicker, byline (shared with case study later) ---- */
.case-kicker{color:var(--bk-rust)!important;font-family:var(--bk-sans);}
.byline{border-top-color:var(--bk-rule)!important;}
.byline-avatar{border-color:var(--bk-rule)!important;}
.byline-name{color:var(--bk-ink);}
.byline-name a{color:var(--bk-rust)!important;}
.byline-role{color:var(--bk-ink-soft)!important;}

/* ---- sticky TOC ---- */
.article-layout{border-top-color:var(--bk-rule)!important;}
.toc-sticky .toc-label{color:var(--bk-rust)!important;font-family:var(--bk-sans);}
.toc-sticky a{color:var(--bk-ink-soft)!important;}
.toc-sticky a:hover{color:var(--bk-rust)!important;}
@media(max-width:880px){.toc-sticky{border-color:var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}}

/* ---- article body copy ---- */
.article-body h2,.article-body h3{color:var(--bk-ink);}
.article-body p{color:var(--bk-ink-soft)!important;}
.article-body p b,.article-body li b{color:var(--bk-ink)!important;}
.article-body ul,.article-body ol{color:var(--bk-ink-soft)!important;}
.article-body a{color:var(--bk-rust)!important;text-decoration-color:rgba(168,65,42,0.4)!important;}
.article-body :not(pre) > code{color:var(--bk-rust)!important;background:rgba(168,65,42,0.08)!important;}
.article-grid{grid-template-columns:216px minmax(0,1fr)!important;}
.article-body{min-width:0;}
.article-body pre{background:var(--bk-surface-dark)!important;border-color:rgba(242,238,230,.15)!important;width:100%;box-sizing:border-box;}
.article-body pre code{color:var(--bk-bone)!important;}

/* ---- callout boxes ---- */
.box{background:var(--bk-bone-raised)!important;}
.box.warn{border-color:var(--bk-rust-light)!important;}
.box.good{border-color:#5B7A52!important;}
.box.info{border-color:var(--bk-rust)!important;}
.box.warn .box-label{color:var(--bk-rust-light)!important;}
.box.good .box-label{color:#5B7A52!important;}
.box.info .box-label{color:var(--bk-rust)!important;}
.box p{color:var(--bk-ink)!important;}

.further-reading .box-label{color:var(--bk-rust)!important;}
.further-reading a{color:var(--bk-ink)!important;}
.further-reading a:hover{color:var(--bk-rust)!important;}
.further-reading a::before{color:var(--bk-rust)!important;}

.takeaway{border-color:var(--bk-rust)!important;background:rgba(168,65,42,0.04)!important;}
.takeaway .box-label{color:var(--bk-rust)!important;}
.takeaway p{color:var(--bk-ink)!important;}

/* ---- checklist (audit checklist page) ---- */
.checklist-item input.chk{border-color:var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}
.checklist-item input.chk:hover{border-color:var(--bk-rust)!important;}
.checklist-item input.chk:checked{background:var(--bk-rust)!important;border-color:var(--bk-rust)!important;}
.checklist-item input.chk:checked::after{border-color:var(--bk-bone)!important;}
.checklist-item input.chk:checked ~ span{color:var(--bk-ink-soft)!important;}
.self-check-progress{border-color:var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}
.self-check-progress .bar-track{background:var(--bk-rule)!important;}
.self-check-progress .bar-fill{background:var(--bk-rust)!important;}
.self-check-progress .bar-label{color:var(--bk-ink-soft)!important;}
.self-check-progress .bar-label b{color:var(--bk-ink)!important;}
.self-check-progress .bar-reset{border-color:var(--bk-rule)!important;color:var(--bk-ink-soft)!important;}
.self-check-progress .bar-reset:hover{border-color:var(--bk-rust)!important;color:var(--bk-rust)!important;}

/* ---- author strip + endcap ---- */
.author-strip{border-color:var(--bk-rule)!important;}
.author-strip img{border-color:var(--bk-rule)!important;}
.author-strip .name{color:var(--bk-ink);}
.author-strip .role{color:var(--bk-ink-soft)!important;}
.author-strip .role a{color:var(--bk-rust)!important;}

/* ---- process steps ---- */
.steps li{border-color:var(--bk-rule)!important;}
.steps li::before{color:var(--bk-rust)!important;}
.steps h3{color:var(--bk-ink)!important;font-family:var(--bk-serif);}
.steps p{color:var(--bk-ink-soft)!important;}

/* ---- faq ---- */
.faq details{border-color:var(--bk-rule)!important;}
.faq summary{color:var(--bk-ink)!important;font-family:var(--bk-serif);}
.faq summary::after{color:var(--bk-rust)!important;}
.faq .answer{color:var(--bk-ink-soft)!important;}
.faq .answer b{color:var(--bk-ink)!important;}

/* ---- contact section (shared footer block before </main>) ---- */
.contact .status{color:var(--bk-ink-soft)!important;}
.contact .status b{color:var(--bk-ink)!important;}

/* ---- footer ---- */
footer{background:var(--bk-surface-dark)!important;color:var(--bk-bone)!important;border-top:none!important;}
.footer-brand{font-family:var(--bk-serif)!important;color:var(--bk-bone)!important;font-size:18px!important;}
.footer-brand span{color:var(--bk-rust-light)!important;}
.footer-tagline{color:rgba(242,238,230,.62)!important;}
.footer-heading{color:var(--bk-rust-light)!important;}
.footer-col a{color:rgba(242,238,230,.75)!important;}
.footer-col a:hover{color:var(--bk-bone)!important;}
.social-icons a{color:rgba(242,238,230,.75)!important;border-color:rgba(242,238,230,.3)!important;}
.social-icons a:hover{color:var(--bk-rust-light)!important;border-color:var(--bk-rust-light)!important;}
.footer-bottom{border-top-color:rgba(242,238,230,.15)!important;}
.foot-line{color:rgba(242,238,230,.5)!important;}
.foot-line a{color:rgba(242,238,230,.7)!important;}

/* ---- resource hero (blog.html / guides.html / all-posts / all-guides) ---- */
.res-hero{background:transparent;}
.res-hero .case-kicker{color:var(--bk-rust)!important;}
.res-hero .dek{color:var(--bk-ink-soft)!important;}
.res-hero .dek a{color:var(--bk-rust)!important;}

/* ---- index cards (blog/guides listing) ---- */
.float-card{background:var(--bk-bone-raised)!important;border-color:var(--bk-rule)!important;box-shadow:0 10px 24px -14px rgba(28,24,21,.2)!important;}
.float-card:hover{border-color:var(--bk-rust-light)!important;box-shadow:0 16px 32px -14px rgba(28,24,21,.3)!important;}
.card-panel{
  background:
    radial-gradient(circle at 85% 15%, rgba(217,119,87,0.24), transparent 55%),
    linear-gradient(rgba(242,238,230,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,238,230,0.05) 1px, transparent 1px),
    linear-gradient(160deg, #3D3225 0%, var(--bk-surface-dark) 70%)!important;
  border-bottom-color:rgba(168,65,42,.3)!important;
}
.card-panel::after{background:linear-gradient(180deg, transparent 40%, rgba(20,15,11,0.55) 100%)!important;}
.card-panel.panel-alt{
  background:
    radial-gradient(circle at 85% 15%, rgba(143,175,134,0.24), transparent 55%),
    linear-gradient(rgba(242,238,230,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242,238,230,0.05) 1px, transparent 1px),
    linear-gradient(160deg, #2C3327 0%, var(--bk-surface-dark) 70%)!important;
}
.card-panel.panel-alt .panel-chip{color:#8FAF86!important;border-color:rgba(143,175,134,0.45)!important;}
.panel-chip{color:var(--bk-rust-light)!important;border-color:rgba(217,119,87,0.45)!important;}
.panel-mark{color:rgba(242,238,230,0.3)!important;}
.panel-title{color:var(--bk-bone)!important;font-family:var(--bk-serif);}
.card-body .card-excerpt{color:var(--bk-ink-soft)!important;}
.card-meta{color:var(--bk-ink-soft)!important;}
.card-meta .arrow{color:var(--bk-rust)!important;}

.res-pager{}
.pager-arrow{border-color:var(--bk-rule)!important;color:var(--bk-ink)!important;}
.pager-arrow:hover:not(:disabled){border-color:var(--bk-rust)!important;color:var(--bk-rust)!important;}
.pager-dot{background:var(--bk-rule)!important;}
.pager-dot.active{background:var(--bk-rust)!important;}
.res-viewall a{color:var(--bk-ink-soft)!important;border-color:var(--bk-rule)!important;}
.res-viewall a:hover{color:var(--bk-rust)!important;border-color:var(--bk-rust)!important;}

.archive-row{border-bottom-color:var(--bk-rule)!important;}
.archive-row:first-child{border-top-color:var(--bk-rule)!important;}
.archive-row a{color:var(--bk-ink)!important;}
.archive-row a:hover{color:var(--bk-rust)!important;}
.archive-meta{color:var(--bk-ink-soft)!important;}

/* ---- shared long-form report system (case-study.html + what-is-in-the-audit.html) ---- */
.case-hero{padding:72px 0 48px;border-top:none;}
.case-hero h1{font-family:var(--bk-serif);font-size:clamp(30px,4.6vw,46px);font-weight:600;max-width:820px;margin-bottom:20px;color:var(--bk-ink);}
.case-hero p.dek{color:var(--bk-ink-soft);font-size:18px;max-width:660px;margin-bottom:28px;}
.meta-pills{display:flex;flex-wrap:wrap;gap:10px;}
.pill{border:1px solid var(--bk-rule);padding:8px 16px;font-size:13.5px;color:var(--bk-ink-soft);font-family:var(--bk-sans);}
.pill b{color:var(--bk-ink);font-weight:600;}

.toc-bar{
  position:sticky;top:64px;z-index:8;
  background:rgba(242,238,230,0.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--bk-rule);border-top:1px solid var(--bk-rule);
}
.toc-list{display:flex;gap:24px;overflow-x:auto;padding:14px 0;list-style:none;}
.toc-list a{
  font-size:13.5px;color:var(--bk-ink-soft);text-decoration:none;white-space:nowrap;
  font-family:var(--bk-sans);letter-spacing:0.02em;
  padding-bottom:4px;border-bottom:2px solid transparent;transition:.15s;
}
.toc-list a:hover{color:var(--bk-rust);border-color:var(--bk-rust);}

.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:rgba(242,238,230,.14);border:1px solid rgba(242,238,230,.14);margin-top:32px;}
.stat-card{background:var(--bk-surface-dark);padding:26px 22px;min-width:0;}
.stat-card .n{font-family:var(--bk-serif);font-weight:600;font-size:clamp(22px,2.6vw,28px);color:var(--bk-bone);line-height:1.15;}
.stat-card .n.warn{color:var(--bk-rust-light);}
.stat-card .n.good{color:#8FAF86;}
.stat-card .label{font-size:13.5px;color:rgba(242,238,230,.62);margin-top:8px;}
@media(max-width:820px){.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:480px){.stat-grid{grid-template-columns:1fr;}}

.phase{padding:72px 0;border-top:1px solid var(--bk-rule);}
.phase-num{font-family:var(--bk-sans);font-size:13px;color:var(--bk-rust);letter-spacing:0.16em;text-transform:uppercase;margin-bottom:10px;}
.phase h2{font-family:var(--bk-serif);font-size:clamp(24px,3.4vw,32px);font-weight:600;margin-bottom:18px;color:var(--bk-ink);}
.phase p.lead{color:var(--bk-ink-soft);font-size:16.5px;max-width:680px;margin-bottom:28px;}

abbr.term{text-decoration:none;border-bottom:1px dotted var(--bk-rust);cursor:help;color:var(--bk-ink);}

/* ---- ask a question form ---- */
.form-card{border-color:var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}
.ask-sidebar{border-color:var(--bk-rule)!important;background:var(--bk-bone-raised)!important;}
.ask-sidebar .av{border-color:var(--bk-rule)!important;}
.ask-sidebar h3{color:var(--bk-ink);}
.ask-sidebar .role{color:var(--bk-ink-soft)!important;}
.ask-sidebar p{color:var(--bk-ink-soft)!important;}
.ask-sidebar li{color:var(--bk-ink-soft)!important;}
.ask-sidebar li::before{color:var(--bk-rust)!important;}
.ask-sidebar .sidebar-cta{border-color:var(--bk-rule)!important;color:var(--bk-ink)!important;}
.ask-sidebar .sidebar-cta:hover{border-color:var(--bk-rust)!important;color:var(--bk-rust)!important;}
.form-field label{color:var(--bk-rust)!important;}
.form-field input,.form-field textarea{border-color:var(--bk-rule)!important;color:var(--bk-ink)!important;background:var(--bk-bone)!important;}
.form-field input:focus,.form-field textarea:focus{border-color:var(--bk-rust)!important;}
.form-note{color:var(--bk-ink-soft)!important;}

/* ---- catch-all: old hardcoded inline colors baked into article HTML ----
   These predate this stylesheet and can't be overridden per-selector since
   they're inline `style="color:var(--x)"` attributes on arbitrary elements
   (bold lead-ins, source citations, inline links). Attribute selectors let
   one rule fix every instance across all 13 articles at once. */
[style*="color:var(--paper)"]{color:var(--bk-ink)!important;}
[style*="color:var(--dim)"]{color:var(--bk-ink-soft)!important;}
[style*="color:var(--gold)"]{color:var(--bk-rust)!important;}
