/* =====================================================================
   soundinjury.com · education pages · November 2026
   Loaded after ../site.css. Replaces the styles each education page
   used to carry inline. Same tokens, type and calm as the rest of the site.
   ===================================================================== */

/* old variable names still used in a few style="" attributes */
.edu{--brand:#5D9B9B;--brand-dark:#2F6B6B;--brand-btn:#3F7C7C;--brand-btn-hover:#2F6B6B;--bg:#FBF9F4;--card:#fff;--soft-blue:#EAF2F2;
  --stone-light:#CFE0E0;--stone-mid:#9EC3C3;--header-h:72px;--safe-top:0px;--si-teach:var(--serif)}
.edu .fade-up{opacity:1!important;transform:none!important}
.edu .container{max-width:1280px;margin:0 auto;padding:0 40px}
.stone-filter-def{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* reading progress: a thin teal line under the header */
.reading-progress{position:fixed;top:0;left:0;z-index:70;height:3px;width:0;background:var(--teal);pointer-events:none}

/* ---------- article top ---------- */
.article-hero{padding:44px 0 52px;border-bottom:1px solid var(--line)}
.article-header{max-width:52rem}
.phase-badge{display:inline-block;margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);text-decoration:none}
.phase-badge:hover{color:var(--ink)}
.phase-badge svg{display:none}
.read-time{margin:0 0 6px;font-size:14px;color:var(--muted)}
.article-hero h1{margin:6px 0 0;max-width:20ch;font-family:var(--serif);font-weight:300;font-size:clamp(2.3rem,1.15rem + 2.9vw,4rem);line-height:1.06;letter-spacing:-.02em;color:var(--ink)}
.article-hero h2{margin:18px 0 0;max-width:40rem;font-family:var(--sans);font-weight:400;font-style:normal;font-size:19px;line-height:1.6;color:var(--body)}

/* ---------- reading column + sidebar ---------- */
.layout{display:grid;grid-template-columns:268px minmax(0,1fr);gap:64px;align-items:start;padding:56px 0 40px}
.sidebar{position:sticky;top:96px;display:flex;flex-direction:column;gap:18px;max-height:calc(100vh - 116px);overflow:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;padding-right:2px}
.toc-card,.related-card,.case-card,.sidebar-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px 22px 22px}
.toc-card h3,.related-card h3,.case-card h3,.sidebar-card h3{margin:0 0 12px;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.toc,.related-card ul,.sidebar-card ul{margin:0;padding:0;list-style:none}
.toc li,.related-card li,.sidebar-card li{margin:0}
.toc a{display:block;padding:7px 0 7px 14px;border-left:2px solid var(--line);font-size:14.5px;line-height:1.4;color:var(--body);text-decoration:none}
.toc a:hover{color:var(--ink);border-left-color:var(--stone)}
.toc a.active{color:var(--ink);font-weight:600;border-left-color:var(--teal)}
.related-card a,.sidebar-card a{display:block;padding:7px 0;border-top:1px solid var(--line);font-size:14.5px;line-height:1.4;color:var(--ink);text-decoration:none}
.related-card li:first-child a,.sidebar-card li:first-child a{border-top:0;padding-top:0}
.related-card a:hover,.sidebar-card a:hover{color:var(--teal)}
.case-card p{margin:0 0 10px;font-size:14px;color:var(--body)}
.case-card figure{margin:0}
.case-card img{display:block;width:100%;height:auto;border-radius:10px;background:#fff}
.case-card figcaption{margin-top:8px;font-size:12.5px;color:var(--muted)}
.sidebar-cta{background:var(--ink);color:#DCE7EE;border-radius:16px;padding:22px 22px 24px}
.sidebar-cta h3{margin:0 0 8px;font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.25;color:#fff}
.sidebar-cta p{margin:0 0 16px;font-size:14px;line-height:1.55}
.side-btn{display:flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 14px;border-radius:999px;background:#fff;color:var(--ink);font-size:14px;font-weight:600;text-decoration:none;white-space:nowrap}
.side-btn:hover{background:var(--sand)}
.side-btn::after,.ans-btn-primary::after{content:"";width:16px;height:16px;flex:none;background:currentColor;-webkit-mask:var(--arrow) center/contain no-repeat;mask:var(--arrow) center/contain no-repeat;transition:transform .35s var(--glide)}
.side-btn:hover::after,.ans-btn-primary:hover::after{transform:translate(2px,-2px)}
.side-call{display:block;margin-top:12px;font-size:14px;color:#DCE7EE;text-align:center}
.side-call:hover{color:#fff}

/* ---------- article text ---------- */
.content{min-width:0;max-width:46rem;font-size:17px;line-height:1.7;color:var(--body)}
.content section{margin:0 0 64px}
.content>section:last-of-type{margin-bottom:40px}
.content section>*:last-child{margin-bottom:0}
.content section:first-of-type>p:first-of-type{font-size:19px;line-height:1.65;color:var(--ink)}
.content h3{margin:0 0 16px;font-family:var(--serif);font-weight:400;font-size:clamp(1.65rem,1.35rem + .8vw,2.15rem);line-height:1.18;letter-spacing:-.01em;color:var(--ink)}
.content h4{margin:32px 0 10px;font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.3;color:var(--ink)}
.content h5{margin:0 0 6px;font-family:var(--sans);font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.content h3::after,.content h4::after{content:none!important;display:none!important}
.content section>h4:first-child,.content section>div>h4:first-child{margin-top:0}
.content p{margin:0 0 1em}
.content ul,.content ol{margin:0 0 1.2em;padding:0}
.content ul{list-style:none}
.content ul>li{position:relative;margin:0 0 .5em;padding-left:22px}
.content ul>li::before{content:"";position:absolute;left:2px;top:.68em;width:8px;height:8px;border-radius:50%;background:var(--stone)}
.content ul>li[style*="flex"]{padding-left:0}
.content ul>li[style*="flex"]::before{content:none}
.content ol{padding-left:1.4em}
.content ol>li{margin:0 0 .5em;padding-left:4px}
.content li>p:last-child{margin-bottom:0}
.content a{color:var(--ink);text-decoration-color:var(--stone);text-underline-offset:3px}
.content a:hover{color:var(--teal)}
.content strong,.content b{color:var(--ink);font-weight:600}
.content em{font-style:italic}
.content .rule,.content hr{height:1px;margin:40px 0;border:0;background:var(--line)}
.content h4 svg,.content h3 svg{width:1em;height:1em;margin-right:6px;vertical-align:-.12em}
.text-link{font-weight:600;color:var(--teal)!important;text-decoration:none!important}
.text-link:hover{color:var(--ink)!important}
.content>p:last-child,.content>p[style*="margin-top"]{margin-top:8px!important}

/* panels: one calm vocabulary for all the callouts */
.content .boxed,.callout,.clarify-card,.layer-card,.feature-card,.content .note{margin:28px 0;padding:26px 28px;background:var(--tint);border:0;border-radius:18px}
.content .boxed.highlight,.anecdote-box{background:var(--sand)}
.content section.boxed,.content section.highlight,.content section.anecdote-box{padding:34px 36px}
.content .boxed h3,.content .boxed h4,.feature-card h4,.clarify-card h4,.layer-card h4,.callout h4{margin-top:0}
.feature-card h4,.clarify-card h4,.layer-card h4{font-size:21px}
.summary-callout{margin:28px 0;padding:18px 22px;background:var(--sand);border-left:3px solid #C9B791;border-radius:0 14px 14px 0;font-size:16px;line-height:1.65;color:#4A4436}
.summary-callout p{margin:0 0 .7em}
.summary-callout p:last-child{margin:0}
.summary-callout strong{color:var(--ink)}
.callout p:last-child,.feature-card p:last-child,.clarify-card p:last-child,.layer-card p:last-child,.content .note p:last-child{margin-bottom:0}
.pull-quote-card{margin:36px 0;padding:6px 0 6px 28px;border-left:2px solid var(--stone)}
.pull-quote-card p{margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(1.3rem,1.1rem + .6vw,1.65rem);line-height:1.45;color:var(--ink)}
.content [style*="color:#92400e"],.content [style*="color: #92400e"]{color:#6B5530!important}

/* ---------- figures ---------- */
.content figure{margin:32px 0}
.content figure img{display:block;max-width:100%;height:auto;margin:0 auto}
.content figure figcaption,.content .caption,.diagram-caption{margin-top:12px;font-family:var(--serif);font-style:italic;font-size:15px;line-height:1.5;color:var(--muted);text-align:center}
.content-figure img{border-radius:16px}
.hero-figure{margin:32px 0}
.hero-figure img{border-radius:16px}
.figure--cutout img,.figure--cutout{border-radius:0;background:transparent}
.lightbox-trigger,.thumb{cursor:zoom-in}
.visual-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:center;margin:40px 0}
.visual-split>div>h4:first-child{margin-top:0}
.visual-split figure{margin:0}
.visual-split figure img{border-radius:14px;background:#fff}
.cropped figure img{max-height:340px;width:100%;object-fit:cover}
.top-graphic{margin:0 0 40px}
.top-graphic svg{display:block;width:100%;height:auto}
.diagram,.diagram-container{margin:32px 0;padding:28px;background:#fff;border:1px solid var(--line);border-radius:18px}
.diagram-container svg{display:block;width:100%;height:auto}
.diagram-sep{height:1px;margin:14px 0;background:var(--line)}
.imgtile{margin:0!important;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;transition:box-shadow .2s}
.imgtile:hover{box-shadow:0 10px 26px rgba(0,45,79,.08)}
.imgtile img{width:100%;aspect-ratio:1/1;object-fit:contain;border-radius:8px}
.imgtile figcaption{margin-top:10px!important;font-family:var(--sans)!important;font-style:normal!important;font-size:14px!important;text-align:left!important;color:var(--body)!important}
.content section:has(> .imgtile),.thumb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}
.content section:has(> .imgtile)>h3,.content section:has(> .imgtile)>p,.content section:has(> .imgtile)>div:not(.imgtile){grid-column:1/-1}

/* ---------- small card grids ---------- */
.pain-grid,.mechanism-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:24px 0}
.pain-card{padding:20px 20px 22px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--c,#5D9B9B);border-radius:14px}
.pain-card:nth-child(2){--c:#9EC3C3}
.pain-card:nth-child(3){--c:#335772}
.pain-card p{margin:0;font-size:15px;line-height:1.55}
.pain-icon{margin-bottom:8px;color:var(--teal)}
.mechanism-flow{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line)}
.flow-step{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;padding:18px 0;border-bottom:1px solid var(--line)}
.step-num{font-family:var(--serif);font-weight:300;font-size:34px;line-height:1;color:var(--teal)}
.treatment-steps{margin:24px 0;border-top:1px solid var(--line)}
.t-step{padding:20px 0;border-bottom:1px solid var(--line)}
.t-step h4{margin:0 0 6px!important;font-size:20px}
.t-step p{margin:0}
.action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0}
.action-card{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:start;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:14px}
.action-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:var(--tint);font-size:20px}
.action-icon img{width:26px;height:26px;object-fit:contain}
.action-card h5{margin:2px 0 4px}
.action-card>h5:first-child,.action-card>p{grid-column:1/-1}
.action-card p{margin:0;font-size:15px;line-height:1.55}
.comparison-grid,.traffic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:24px 0}
.traffic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.compare-col,.traffic-card{padding:22px 22px 18px;background:#fff;border:1px solid var(--line);border-top:3px solid var(--c,#5D9B9B);border-radius:14px}
.compare-col h4,.traffic-card h4{margin:0 0 12px!important;font-size:20px}
.compare-col ul,.traffic-card ul{margin:0}
.compare-col li,.traffic-card li{font-size:15.5px}
.compare-col.good,.traffic-card.push,.compare-col.driver{--c:#5D9B9B}
.compare-col.bad,.traffic-card.help,.compare-col.victim{--c:#C8968E}
.traffic-card.hold{--c:#C9B791}
.compare-col.bad li::before,.traffic-card.help li::before,.compare-col.victim li::before{background:#E2BDB6}
.traffic-card.hold li::before{background:#DCCB9F}

/* ---------- handouts, table, references ---------- */
.pdf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:24px 0}
.pdf-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:14px;color:var(--ink);text-decoration:none!important;transition:box-shadow .2s}
.pdf-card:hover{box-shadow:0 10px 26px rgba(0,45,79,.08)}
.pdf-info h4{margin:0 0 4px!important;font-size:18px}
.pdf-info p{margin:0;font-size:14px;color:var(--muted)}
.pdf-icon{flex:none;width:22px;height:22px;fill:none;stroke:var(--teal);stroke-width:2}
.table-section{overflow-x:auto}
.table-section table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55}
.table-section th{padding:12px 14px;text-align:left;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);border-bottom:2px solid var(--ink)}
.table-section td{padding:16px 14px;vertical-align:top;border-bottom:1px solid var(--line)}
.table-section tr.featured td{background:var(--tint)}
.refs,ol.refs{margin:40px 0 0;padding-top:20px;border-top:1px solid var(--line);font-size:13.5px;line-height:1.55;color:var(--muted)}
.refs h3,.refs h4{font-size:18px!important;margin:0 0 10px!important}
.refs ol{padding-left:1.3em}
.refs li{margin:0 0 .45em}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.tag{display:inline-block;padding:4px 12px;border-radius:999px;background:var(--tint);font-size:12.5px;font-weight:600;color:var(--teal)}

/* ---------- end of article ---------- */
.article-cairn-complete{display:flex;align-items:center;justify-content:center;gap:12px;max-width:1200px;margin:40px auto 0;padding:0 40px;color:var(--muted);font-size:14px}
.article-cairn-complete svg{width:28px;height:auto;flex:none}
.article-cairn-complete p{margin:0}
.article-next-step{max-width:1200px;margin:24px auto 96px;padding:64px 40px;background:var(--ink);border-radius:28px;color:#DCE7EE;text-align:center}
.edu main>.article-next-step{width:calc(100% - 80px)}
.article-next-step h3{margin:0 auto;max-width:22ch;font-family:var(--serif);font-weight:300;font-size:clamp(2rem,1.3rem + 2vw,3rem);line-height:1.1;color:#fff}
.article-next-step p{margin:16px auto 0;max-width:38rem;font-size:17px;color:#DCE7EE}
.ans-btns{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 10px;margin-top:28px}
.ans-btn-primary,.ans-btn-ghost{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 28px;border-radius:999px;font-weight:600;text-decoration:none;border:1.5px solid transparent}
.ans-btn-primary{background:#fff;color:var(--ink)}
.ans-btn-primary:hover{background:var(--sand)}
.ans-btn-ghost{min-height:48px;padding:0 18px;gap:9px;border:0;color:#fff;font-weight:500;transition:background .25s}
.ans-btn-ghost:hover{background:var(--ghost-dark)}
.ans-btn-ghost[href^="tel:"]::before{content:"";width:17px;height:17px;flex:none;background:currentColor;-webkit-mask:var(--phone) center/contain no-repeat;mask:var(--phone) center/contain no-repeat}
@media (max-width:640px){.ans-btns{flex-direction:column;row-gap:4px}}
.article-next-step .handout-link{margin:22px auto 0!important;font-size:15px}
.article-next-step .handout-link a,.ans-related a{color:#fff}
.article-next-step .handout-link svg{width:15px;height:15px;margin-right:6px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:2}
.ans-related{margin:10px auto 0!important;font-size:14px;color:#AFC3D1!important}

/* ---------- the education library (education/index.html) ---------- */
.edu-kicker{font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--brand-dark); margin: 0 0 10px;}
.edu-kicker--onDark{color: var(--stone-light);}
.edu-phase__label{font-size: .78rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-dark); margin: 4px 0 10px;}
.edu-phase__blurb{font-size: clamp(1.02rem, 1rem + .3vw, 1.16rem); line-height: 1.62; color: var(--muted); margin: 0; max-width: 62ch;}
.edu-grid{display: grid; grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); gap: 20px;}
.edu-card{display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--brand); border-radius: 12px; padding: 24px 24px 22px; text-decoration: none; transition: box-shadow .18s ease, border-top-color .18s ease;}
.edu-card:nth-child(4n+2){border-top-color: var(--stone-mid, #668195);}
.edu-card:nth-child(4n+3){border-top-color: var(--stone-light);}
.edu-card:nth-child(4n+4){border-top-color: var(--brand-dark);}
.edu-card:hover{box-shadow: 0 8px 22px rgba(0,45,79,.09);}
.edu-card:focus-visible, .edu-pdf:focus-visible{outline: 3px solid var(--ink); outline-offset: 3px;}
.edu-card h3{font-family: var(--sans); font-size: 1.16rem; font-weight: 600; letter-spacing: -.012em; line-height: 1.3; color: var(--ink); margin: 0 0 10px;}
.edu-card p{font-size: .96rem; line-height: 1.6; color: var(--muted); margin: 0 0 18px; flex: 1;}
.edu-card__go{font-size: .84rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--brand-dark);}
.edu-card:hover .edu-card__go{color: var(--ink);}
@media (max-width: 1000px){.edu-grid{grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 660px){.edu-grid{grid-template-columns: 1fr;}}
.edu-handouts{padding: 56px 0 0; border-top: 1px solid var(--line); margin-top: 56px;}
.edu-handouts__head{margin-bottom: 28px;}
.edu-handouts__lede{font-size: clamp(1.04rem, 1rem + .32vw, 1.2rem); line-height: 1.62; color: var(--muted); margin: 0; max-width: 54ch;}
.edu-pdfgrid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;}
.edu-pdf{display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 14px 18px; background: #fff; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); text-decoration: none; font-size: .96rem; font-weight: 500; line-height: 1.4; transition: border-color .18s ease, box-shadow .18s ease;}
.edu-pdf svg{color: var(--brand); flex-shrink: 0;}
.edu-pdf:hover{border-color: var(--brand); box-shadow: 0 6px 16px rgba(0,45,79,.07); color: var(--ink);}
@media (max-width: 1000px){.edu-pdfgrid{grid-template-columns: repeat(2, 1fr);}}
@media (max-width: 620px){.edu-pdfgrid{grid-template-columns: 1fr;}}
.edu-essays{margin-top: 72px; padding: clamp(34px, 4vw, 52px); background: var(--ink); border-radius: 16px; display: flex; align-items: center; justify-content: space-between; gap: 32px; flex-wrap: wrap;}
.edu-essays h2{color: #fff; margin: 0 0 10px;}
.edu-essays p{color: #C2D4E0; font-size: 1.04rem; line-height: 1.6; margin: 0; max-width: 52ch;}
.edu-essays .edu-kicker{font-size: .78rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--stone-light); margin: 0 0 10px; max-width: none; line-height: 1.4;}
.edu-essays__btn{flex-shrink: 0; display: inline-flex; align-items: center; gap: 8px; min-height: 56px; padding: 16px 28px; background: var(--brand-btn); color: #fff; border: 2px solid var(--brand-btn); border-radius: 8px; font-size: 1rem; font-weight: 600; text-decoration: none; transition: background .18s ease, border-color .18s ease;}
.edu-essays__btn:hover{background: var(--brand-btn-hover); border-color: var(--brand-btn-hover); color: #fff;}
.hub-eyebrow{display: block; color: var(--stone-light); font-size: .74rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; margin-bottom: 10px;}
/* library: same look as the rest of the site */
.hub-eyebrow,.edu-kicker{display:block;margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--teal)}
.edu-handouts h2{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;color:var(--ink)}
.edu-handouts h2{margin:0 0 12px;font-size:clamp(1.8rem,1.4rem + 1.2vw,2.6rem);line-height:1.12}
.edu-card{border-top-width:3px;border-radius:14px}
.edu-card h3{font-family:var(--serif)!important;font-weight:400!important;font-size:21px!important;line-height:1.25!important;letter-spacing:0!important}
.edu-card p{color:var(--body)}
.edu-card__go{letter-spacing:.04em;text-transform:none;font-size:15px;font-weight:600;color:var(--teal)}
.edu-essays{border-radius:24px}
.edu-essays h2{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,1.4rem + 1.8vw,2.8rem);line-height:1.1}
.edu-essays .edu-kicker{color:#AFC3D1}
.edu-essays__btn{border-radius:999px;background:#fff;border-color:#fff;color:var(--ink)}
.edu-essays__btn:hover{background:var(--sand);border-color:var(--sand);color:var(--ink)}

/* ---------- essays (education/index-blog.html) ---------- */
.tags{margin-bottom: 24px;}
.tag{display:inline-block; font-size:.75rem; background:var(--soft-blue); color:var(--ink); border:1px solid #bae6fd; padding:.3rem .8rem; border-radius:50px; margin:0 8px 8px 0; font-weight:700; text-transform: uppercase; letter-spacing: 0.05em;}
.blog-layout{display: grid; grid-template-columns: 280px 1fr; gap: 64px; margin-top: 40px; align-items: start;}
.blog-sidebar{position: sticky; top: calc(var(--header-h) + var(--safe-top) + 32px);}
.blog-sidebar h3{font-size: 0.85rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin-bottom: 20px;}
.blog-nav{list-style: none; padding: 0; margin: 0; display: block !important; flex-direction: column;}
.blog-nav li{display: block; margin-bottom: 20px;}
.blog-nav a{display: block; text-decoration: none; transition: all 0.2s ease;}
.blog-nav .nav-title{display: block; font-size: 0.95rem; font-weight: 600; color: var(--ink); margin-bottom: 4px; line-height: 1.3;}
.blog-nav .nav-date{display: block; font-size: 0.8rem; color: var(--muted); letter-spacing: 0.02em;}
.blog-nav a:hover .nav-title{color: var(--brand);}
.blog-nav-mobile{display: none;}
.blog-nav-mobile select{width: 100%; padding: 14px 16px; border: 1.5px solid var(--stone-light); border-radius: 12px; font-size: 16px; font-weight: 500; color: var(--ink); background: white; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%235D9B9B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 20px; padding-right: 44px;}
.blog-nav-mobile select:focus{outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px rgba(93, 155, 155, 0.1);}
.essays-layout{padding: 32px 24px; border-radius: 20px; background: var(--card); border: 1px solid var(--line); box-shadow: 0 4px 6px -1px rgba(0, 45, 79, 0.04);}
.essay-card + .essay-card{margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--line);}
.essay-meta{font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); margin-bottom: 6px;}
.essay-subtitle{font-size: 1rem; color: var(--muted); margin-top: 0; margin-bottom: 20px; font-style: italic;}
.essay-body p{margin: 0 0 16px; font-size: 1.03rem; color: var(--muted);}
.essay-body p:last-child{margin-bottom: 0;}
.essay-body em{font-family: var(--si-teach); font-style: italic;}
.essay-center{text-align: center;}
@media(max-width: 900px){.blog-layout{grid-template-columns: 1fr; gap: 40px;}
.blog-sidebar{position: static; order: -1; padding-bottom: 32px; border-bottom: 1px solid var(--line);}}
@media(max-width: 640px){.blog-nav{display: none !important;}
.blog-nav-mobile{display: block;}}

.blog-layout{margin-top:48px;padding-bottom:96px}
.essays-layout{padding:40px 44px;border-radius:24px;box-shadow:none}
.essay-card h3{margin:0 0 6px;font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,1.4rem + .8vw,2.2rem);line-height:1.15;color:var(--ink)}
.essay-body p{font-size:17px;line-height:1.75;color:var(--body)}
.essay-subtitle{font-family:var(--serif);font-size:17px}
.article-hero .tags{margin:0 0 14px}
.tag{border:0!important;background:var(--tint)!important;color:var(--teal)!important;letter-spacing:.1em!important}
@media (max-width:760px){.essays-layout{padding:26px 20px}}

/* ---------- picture viewer ---------- */
.lightbox{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:28px;background:rgba(0,30,54,.88)}
.lightbox.active{display:flex}
.lightbox-inner{position:relative;max-width:min(1100px,94vw);text-align:center}
.lightbox img{display:block;max-width:100%;max-height:80vh;margin:0 auto;border-radius:12px;background:#fff}
.lightbox .caption{margin-top:14px;font-family:var(--serif);font-style:italic;font-size:16px;color:#DCE7EE}
.lb-close{position:absolute;top:-46px;right:0;padding:8px 14px;border:1px solid rgba(255,255,255,.6);border-radius:999px;background:transparent;color:#fff;font:600 14px var(--sans);cursor:pointer}
.lb-close:hover{background:rgba(255,255,255,.1)}

/* ---------- tablets and phones ---------- */
@media (max-width:1024px){
  .layout{grid-template-columns:1fr;gap:40px;padding-top:40px}
  .sidebar{position:static;max-height:none;overflow:visible;order:2}
  .toc-card{display:none}
  .content{max-width:none}
}
@media (max-width:760px){
  .edu .container{padding:0 22px}
  .article-hero{padding:28px 0 36px}
  .article-hero h2{font-size:17.5px}
  .pain-grid,.action-grid,.comparison-grid,.traffic-grid,.visual-split{grid-template-columns:1fr}
  .visual-split{gap:20px}
  .content section{margin-bottom:52px}
  .content .boxed,.callout,.clarify-card,.layer-card,.feature-card,.content .note{padding:22px}
  .content section.boxed,.content section.highlight,.content section.anecdote-box{padding:26px 22px}
  .article-next-step{padding:48px 22px;border-radius:22px;margin-bottom:64px}
  .edu main>.article-next-step{width:calc(100% - 44px)}
  .table-section thead{display:none}
  .table-section tr{display:block;padding:14px 0;border-bottom:1px solid var(--line)}
  .table-section td{display:block;padding:4px 0;border:0}
  .table-section td::before{content:attr(data-h);display:block;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
  .table-section tr.featured{background:var(--tint);padding:14px;border-radius:12px}
  .table-section tr.featured td{background:transparent}
}
@media print{
  .sidebar,.article-next-step,.reading-progress,.lightbox{display:none!important}
  .layout{display:block;padding:0}
}

/* ---------- November 2026: the library organised by the three stones, and the consolidated guides ---------- */
.lib{margin-top:48px;padding-bottom:96px}
.lib-start{padding:28px 32px;background:var(--sand);border-radius:20px}
.lib-start .edu-kicker{color:#7a5a3a;margin-bottom:14px}
.lib-chips{display:flex;flex-wrap:wrap;gap:10px}
.lib-chips a{display:inline-flex;align-items:center;min-height:44px;padding:9px 18px;background:#fff;border:1px solid var(--line);border-radius:999px;color:var(--ink);font-size:15px;font-weight:500;text-decoration:none;transition:border-color .18s,box-shadow .18s}
.lib-chips a:hover{border-color:var(--teal);box-shadow:0 4px 12px rgba(0,45,79,.08)}
.lib-chips a:focus-visible,.lib-basics a:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.lib-group{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,56px);align-items:start;padding:56px 0 0;margin-top:56px;border-top:1px solid var(--line);scroll-margin-top:calc(var(--header-h,100px) + 20px)}
.lib-start+.lib-group{border-top:0;margin-top:8px}
.lib-head{display:grid;grid-template-columns:58px 1fr;gap:22px;align-items:start}
.lib-cairn{width:58px;height:auto;display:block;margin-top:2px}
.lib-group h2{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;color:var(--ink);margin:0 0 12px;font-size:clamp(1.7rem,1.35rem + 1.1vw,2.35rem);line-height:1.14;text-wrap:balance}
.lib-head .edu-phase__label{margin:2px 0 10px}
.lib-head .edu-phase__blurb{font-size:17px;color:var(--body)}
.lib-basics{margin:18px 0 0;font-size:15px;line-height:1.9;color:var(--muted)}
.lib-basics span:first-child{display:block;font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;line-height:1.4;margin-bottom:2px}
.lib-basics a{color:var(--teal);font-weight:500;text-decoration:none;border-bottom:1px solid rgba(47,107,107,.3)}
.lib-basics a:hover{border-bottom-color:var(--teal)}
.lib-group .edu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.lib-group .edu-grid--one{grid-template-columns:minmax(0,1fr)}
.lib-group .edu-card{border-top-color:var(--teal)}
.maps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:20px 0 28px}
.maps figure{margin:0;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px}
.content .maps img{display:block;max-width:100%;max-height:280px;width:auto;height:auto;margin:0 auto;cursor:zoom-in}
.content .maps figcaption{margin-top:12px;font-family:var(--sans);font-style:normal;font-size:14.5px;line-height:1.5;color:var(--body);text-align:left}
.table-section--compare td.rowh{width:20%;font-weight:600;color:var(--ink)}
.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:20px 0 24px}
.stages figure{margin:0;padding:16px;background:#fff;border:1px solid var(--line);border-radius:14px}
.content .stages figcaption{margin:0;font-family:var(--sans);font-style:normal;font-size:15px;color:var(--body);text-align:left}
.content .stages img{display:block;width:100%;height:170px;object-fit:contain;border-radius:10px;cursor:zoom-in}
.stages h4{margin:14px 0 6px!important;font-size:19px;font-style:normal}
.stages p{margin:0;font-size:15px;line-height:1.55;color:var(--body)}
.traffic-grid--3,.action-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.maps figure{display:flex;flex-direction:column;justify-content:space-between}
.figure--narrow img{display:block;max-width:560px;margin:0 auto}
.content-figure--photo img{width:100%;aspect-ratio:3/2;object-fit:cover}
.content-figure--small img{display:block;max-width:360px;margin:0 auto}
.action-card>div:only-child{grid-column:1/-1}
.refs-fold{margin:48px 0 0;border-top:1px solid var(--line);border-bottom:0}
.refs-fold summary{cursor:pointer;list-style:none;position:relative;padding:18px 36px 18px 0;font-family:var(--serif);font-size:20px;line-height:1.3;color:var(--ink)}
.refs-fold summary span{font-family:var(--sans);font-size:14px;color:var(--muted)}
.refs-fold summary::-webkit-details-marker{display:none}
.refs-fold summary::after{content:"+";position:absolute;right:4px;top:14px;font-family:var(--sans);font-size:24px;color:var(--teal)}
.refs-fold[open] summary::after{content:"–"}
.refs-fold .refs{margin:0;padding:0 0 8px 1.3em;border-top:0}
@media (max-width:1000px){.lib-group{grid-template-columns:1fr}}
@media (max-width:760px){.maps,.stages,.traffic-grid--3,.action-grid--3{grid-template-columns:1fr}
.table-section--compare td.rowh{width:auto;font-family:var(--serif);font-size:19px;font-weight:400}}
@media (max-width:660px){.lib-start{padding:22px 20px}
.lib-chips{gap:8px}
.lib-chips a{font-size:14px;padding:7px 14px;min-height:40px}
.lib-head{grid-template-columns:44px 1fr;gap:16px}
.lib-cairn{width:44px}
.lib-group .edu-grid{grid-template-columns:1fr}}