/* ============================================================
   Moola components. Faithful to the live brand site.
   ============================================================ */

/* ── Buttons ── */
.btn { position:relative; display:inline-flex; align-items:center; justify-content:center; gap:var(--s2); font-family:var(--font-body); font-weight:700; font-size:.95rem; letter-spacing:-0.01em; padding:14px 28px; border-radius:var(--radius-pill); border:1px solid transparent; cursor:pointer; overflow:hidden; transition:transform var(--t), box-shadow var(--t), border-color var(--t); }
.btn-sm { padding:10px 18px; font-size:.85rem; }
.btn-primary { background:var(--grad-brand); color:#fff; box-shadow:0 10px 34px -10px var(--glow-violet), inset 0 1px 0 rgba(255,255,255,.28); }
.btn-primary::after { content:""; position:absolute; inset:0; background:var(--grad-sheen); transform:translateX(-120%); transition:transform .7s cubic-bezier(.16,1,.3,1); }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 16px 44px -10px var(--glow-pink), inset 0 1px 0 rgba(255,255,255,.32); }
.btn-primary:hover::after { transform:translateX(120%); }
.btn-secondary { background:var(--glass-pill); border-color:var(--border-strong); color:var(--text-1); backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); }
.btn-secondary:hover { border-color:var(--border-hover); transform:translateY(-2px); }
.btn-green { background:var(--grad-green); color:#04140d; box-shadow:0 10px 34px -10px var(--glow-green); }
.btn-green:hover { transform:translateY(-2px); box-shadow:0 16px 44px -10px var(--glow-green); }

/* ── Header ── */
.site-header { position:sticky; top:0; z-index:50; background:var(--glass-nav); backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); border-bottom:1px solid var(--border-subtle); }
.nav { display:flex; align-items:center; justify-content:space-between; height:var(--nav-h); gap:var(--s5); }
.brand { display:inline-flex; align-items:center; }
.brand img { height:28px; width:auto; }
.nav-links ul { list-style:none; display:flex; gap:var(--s6); padding:0; }
.nav-links a { position:relative; color:var(--text-2); font-size:.95rem; font-weight:500; padding:4px 0; transition:color var(--t); }
.nav-links a::after { content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; border-radius:2px; background:var(--grad-brand-r); transform:scaleX(0); transform-origin:left; transition:transform var(--t-smooth); }
.nav-links a:hover { color:var(--text-1); }
.nav-links a:hover::after { transform:scaleX(1); }
.nav-actions { display:flex; align-items:center; gap:var(--s3); }
.nav-toggle { display:none; background:none; border:none; color:var(--text-1); font-size:1.4rem; cursor:pointer; line-height:1; }
@media (max-width:820px){
  .nav-links { position:absolute; top:var(--nav-h); left:0; right:0; background:var(--glass-nav); backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); border-bottom:1px solid var(--border-subtle); padding:var(--s5) var(--s6); display:none; }
  .nav-links.open { display:block; }
  .nav-links ul { flex-direction:column; gap:var(--s4); }
  .nav-toggle { display:block; }
}

/* ── Hero ── */
.hero { position:relative; z-index:0; overflow:clip; padding-block: var(--s10) var(--s9); }
.hero-glow { position:absolute; inset:-15% -10% auto -10%; height:130%; z-index:-1; pointer-events:none; background:var(--halo); filter:blur(var(--blur-lg)); opacity:.85; }
.hero-inner { max-width:880px; }
.hero-title { margin-top:var(--s4); font-size:clamp(2.8rem, 6vw, 5rem); line-height:1.0; font-weight:800; letter-spacing:var(--tracking-tight); }
.hero-sub { font-size:clamp(1.05rem,1.5vw,1.25rem); color:var(--text-2); margin-top:var(--s5); max-width:600px; line-height:1.6; }
.hero-actions { display:flex; gap:var(--s3); margin-top:var(--s7); flex-wrap:wrap; }
.hero-trust { display:flex; align-items:center; gap:var(--s3); margin-top:var(--s7); color:var(--text-3); font-size:.85rem; flex-wrap:wrap; }
.hero-trust .dot { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 14px var(--glow-green); }

/* ── Section head ── */
.section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:var(--s4); margin-bottom:var(--s7); flex-wrap:wrap; }
.section-title { font-size:clamp(1.7rem,3vw,2.2rem); font-weight:800; }
.section-link { color:var(--text-1); font-size:.92rem; font-weight:600; display:inline-flex; align-items:center; gap:6px; transition:gap var(--t); }
.section-link:hover { gap:12px; }

/* ── Post card (signature glass + dual-glow on hover) ── */
.post-card { position:relative; background:var(--glass-card); border:1px solid var(--border-strong); border-radius:var(--radius-xl); overflow:hidden; backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); box-shadow:var(--shadow-soft); transition:transform var(--t-smooth), border-color var(--t-smooth), box-shadow var(--t-smooth); }
.post-card:hover { transform:translateY(-6px); border-color:var(--border-violet); box-shadow:var(--shadow-card); }
.card-link { display:flex; flex-direction:column; height:100%; }
.card-image { position:relative; aspect-ratio:16/9; overflow:hidden; background:var(--glass-tile); }
.card-video-badge { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; color:#fff; z-index:1; }
.card-video-badge::before { content:""; position:absolute; width:56px; height:56px; border-radius:50%; background:rgba(6,6,26,0.5); border:1px solid rgba(255,255,255,0.35); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.card-video-badge svg { position:relative; width:22px; height:22px; margin-left:3px; }
.post-card:hover .card-video-badge::before { background-image:var(--grad-brand); border-color:transparent; }
.card-image img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.post-card:hover .card-image img { transform:scale(1.06); }
.card-body { padding:var(--s6); display:flex; flex-direction:column; gap:var(--s3); flex:1; }
.card-tag { align-self:flex-start; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:var(--tracking-section); padding:6px 13px; border-radius:var(--radius-pill); color:#fff; background:var(--glass-pill); border:1px solid var(--border-strong); backdrop-filter:blur(var(--blur)); }
.card-tag[data-tag="academy"] { color:var(--green); border-color:rgba(52,211,153,.4); }
.card-title { font-size:1.35rem; line-height:1.18; color:var(--text-1); letter-spacing:-0.02em; }
.card-excerpt { color:var(--text-3); font-size:.95rem; line-height:1.55; }
.card-meta { display:flex; align-items:center; gap:var(--s2); margin-top:auto; padding-top:var(--s2); font-size:.8rem; color:var(--text-3); }

/* ── Featured spotlight ── */
.spotlight { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:0; background:var(--glass-card); border:1px solid var(--border-strong); border-radius:var(--radius-xl); overflow:hidden; margin-bottom:var(--s8); box-shadow:var(--shadow-card); transition:transform var(--t-smooth), border-color var(--t-smooth); }
.spotlight:hover { transform:translateY(-4px); border-color:var(--border-violet); }
.spotlight-image { position:relative; aspect-ratio:16/9; background:var(--glass-tile); overflow:hidden; }
.spotlight-image img { width:100%; height:100%; object-fit:cover; transition:transform .6s cubic-bezier(.16,1,.3,1); }
.spotlight:hover .spotlight-image img { transform:scale(1.04); }
.spotlight-badge { position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; color:#fff; z-index:1; }
.spotlight-badge::before { content:""; position:absolute; width:76px; height:76px; border-radius:50%; background:rgba(6,6,26,0.45); border:1px solid rgba(255,255,255,0.35); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.spotlight-badge svg { position:relative; width:30px; height:30px; margin-left:4px; }
.spotlight:hover .spotlight-badge::before { background-image:var(--grad-brand); border-color:transparent; }
.spotlight-body { padding:clamp(28px,4vw,56px); display:flex; flex-direction:column; justify-content:center; gap:var(--s4); }
.spotlight-title { font-size:clamp(1.9rem,2.8vw,2.6rem); line-height:1.05; color:var(--text-1); letter-spacing:var(--tracking-heading); }
.spotlight-excerpt { color:var(--text-2); font-size:1.05rem; line-height:1.6; }
.spotlight-meta { display:flex; align-items:center; gap:var(--s2); font-size:.85rem; color:var(--text-3); }
@media (max-width:820px){ .spotlight { grid-template-columns:1fr; } }

/* ── Tag chips ── */
.tag-list { display:flex; flex-wrap:wrap; gap:var(--s2); }
.tag-chip { display:inline-block; padding:8px 15px; border-radius:var(--radius-pill); background:var(--glass-pill); border:1px solid var(--border-strong); color:var(--text-2); font-size:.82rem; font-weight:600; transition:all var(--t); }
.tag-chip:hover { color:var(--text-1); border-color:var(--border-violet); transform:translateY(-1px); }

/* ── Pagination ── */
.pagination { display:flex; align-items:center; justify-content:space-between; gap:var(--s4); margin-top:var(--s9); }
.page-number { color:var(--text-3); font-size:.9rem; }
.pg-spacer { width:1px; }

/* ── Author bio ── */
.author-bio { display:flex; gap:var(--s5); align-items:flex-start; padding:var(--s6); margin-top:var(--s9); background:var(--glass-card); border:1px solid var(--border-strong); border-radius:var(--radius-lg); box-shadow:var(--shadow-soft); }
.author-bio h3 { font-family:var(--font-heading); font-weight:800; }
.author-bio p { color:var(--text-2); margin-top:var(--s2); font-size:.95rem; }

/* ── CTA / newsletter (gradient ring + glow) ── */
.cta-band { position:relative; text-align:center; padding:clamp(36px,5vw,64px) var(--s6); margin-top:var(--s9); background:var(--glass-card); border-radius:var(--radius-xl); overflow:hidden; box-shadow:var(--shadow-card); }
.cta-band::before { content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; background:var(--grad-brand); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; }
.cta-band h3 { font-family:var(--font-heading); font-weight:800; font-size:clamp(1.6rem,2.6vw,2.2rem); margin-top:var(--s3); }
.cta-band p { margin-top:var(--s3); color:var(--text-2); max-width:46ch; margin-inline:auto; }
.signup { display:flex; gap:var(--s2); justify-content:center; margin-top:var(--s6); flex-wrap:wrap; }
.signup input { background:rgba(6,6,26,.55); border:1px solid var(--border-strong); border-radius:var(--radius-pill); padding:14px 22px; color:var(--text-1); min-width:280px; font-family:var(--font-body); font-size:.95rem; transition:border-color var(--t); }
.signup input:focus { outline:none; border-color:var(--border-violet); }
.signup input::placeholder { color:var(--text-3); }
.cta-actions { display:flex; gap:var(--s3); justify-content:center; margin-top:var(--s6); flex-wrap:wrap; }
.cta-alt { margin-top:var(--s7); font-size:.9rem; color:var(--text-3); }
.btn-app svg { margin-right:2px; }
.footer-cta { margin-top:var(--s5); }

/* ── Academy strip (finance green) ── */
.academy-strip { position:relative; display:flex; align-items:center; justify-content:space-between; gap:var(--s6); flex-wrap:wrap; padding:clamp(28px,4vw,48px); background:var(--glass-tile); border:1px solid var(--border-strong); border-radius:var(--radius-xl); overflow:hidden; backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); transition:border-color var(--t-smooth), transform var(--t-smooth), box-shadow var(--t-smooth); }
.academy-strip::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--grad-green); }
.academy-strip::after { content:""; position:absolute; right:-10%; top:-50%; width:50%; height:200%; background:radial-gradient(circle, var(--glow-green), transparent 60%); filter:blur(50px); pointer-events:none; }
.academy-strip:hover { transform:translateY(-3px); border-color:rgba(52,211,153,.4); box-shadow:0 30px 70px -34px var(--glow-green); }
.academy-strip-title { font-size:clamp(1.6rem,2.4vw,2rem); font-weight:800; margin-top:var(--s2); }
.academy-strip-text p { color:var(--text-2); margin-top:var(--s3); max-width:48ch; }
.academy-strip-cta { color:var(--green); font-weight:800; white-space:nowrap; font-size:1.05rem; display:inline-flex; align-items:center; gap:8px; transition:gap var(--t); }
.academy-strip:hover .academy-strip-cta { gap:14px; }

/* ── Footer (large, brand purple, legal-ready) ── */
.site-footer {
  --footer-bg: #1B0A3C;
  --footer-grad: linear-gradient(90deg, #6200EE, #9F3AC9, #F98F93);
  --footer-heading-font: 'Clash Display', var(--font-heading), system-ui, sans-serif;
  --footer-text: rgba(255,255,255,0.72);
  --footer-text-strong: #ffffff;
  --footer-muted: rgba(255,255,255,0.48);
  position:relative;
  margin-top:var(--s10);
  background:var(--footer-bg);
  color:var(--footer-text);
  font-family:var(--font-body);
}
.site-footer::before { content:""; position:absolute; top:0; left:0; right:0; height:2px; background:var(--footer-grad); }
.site-footer a { color:var(--footer-text); transition:color var(--t); }
.site-footer a:hover { color:var(--footer-text-strong); }

/* top: brand + link columns */
.footer-top { display:grid; grid-template-columns:1.5fr 1fr; gap:var(--s8) var(--s9); padding-top:clamp(56px, 8vw, 104px); padding-bottom:var(--s8); }
.footer-logo img { height:30px; width:auto; }
.footer-tagline { margin-top:var(--s5); max-width:38ch; font-size:1rem; line-height:1.6; color:var(--footer-text); }

.footer-social { list-style:none; display:flex; gap:var(--s3); padding:0; margin-top:var(--s6); }
.footer-social a { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:var(--radius-pill); background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); color:var(--footer-text); transition:transform var(--t), border-color var(--t), background var(--t), color var(--t); }
.footer-social a:hover { color:#fff; transform:translateY(-2px); border-color:transparent; background-image:var(--footer-grad); }

.footer-cols { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--s7); }
.footer-heading { font-family:var(--footer-heading-font); font-weight:600; font-size:.8rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--footer-text-strong); }
.footer-col ul { list-style:none; padding:0; margin-top:var(--s4); display:flex; flex-direction:column; gap:var(--s3); }
.footer-col a { font-size:.95rem; line-height:1.4; }

/* legal links + disclaimer */
.footer-legal { padding-block:var(--s7); border-top:1px solid rgba(255,255,255,0.10); }
.footer-legal-links { list-style:none; display:flex; flex-wrap:wrap; gap:var(--s3) var(--s6); padding:0; }
.footer-legal-links a { font-size:.9rem; font-weight:500; color:var(--footer-text-strong); }
.footer-legal-links a:hover { text-decoration:underline; text-underline-offset:3px; }

.legal-disclaimer-placeholder { margin-top:var(--s5); }
.legal-disclaimer-placeholder p { max-width:none; font-size:.8rem; line-height:1.7; color:var(--footer-muted); }

/* bottom: copyright */
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:var(--s3); flex-wrap:wrap; padding-block:var(--s6); border-top:1px solid rgba(255,255,255,0.10); }
.footer-copy { font-size:.85rem; color:var(--footer-text); }
.footer-published { font-size:.8rem; color:var(--footer-muted); }

@media (max-width:820px){
  .footer-top { grid-template-columns:1fr; gap:var(--s8); }
}
@media (max-width:520px){
  .footer-cols { grid-template-columns:1fr; gap:var(--s6); }
  .footer-bottom { flex-direction:column; align-items:flex-start; }
}

/* ── Prose / Koenig ── */
.post-content { font-size:1.16rem; line-height:1.8; color:var(--text-2); }
.post-content > * + * { margin-top:var(--s5); }
.post-content h2 { font-size:clamp(1.6rem,2.4vw,2rem); margin-top:var(--s8); color:var(--text-1); font-weight:800; }
.post-content h3 { font-size:1.45rem; margin-top:var(--s7); color:var(--text-1); font-weight:800; }
.post-content a { color:#c2a6ff; text-decoration:underline; text-decoration-color:var(--border-violet); text-underline-offset:3px; transition:text-decoration-color var(--t), color var(--t); }
.post-content a:hover { color:var(--pink); text-decoration-color:var(--pink); }
.post-content blockquote { border-left:3px solid; border-image:var(--grad-brand) 1; padding-left:var(--s5); color:var(--text-1); font-style:italic; font-size:1.2rem; }
.post-content img, .post-content .kg-image { border-radius:var(--radius-lg); border:1px solid var(--border-subtle); }
.post-content figcaption { text-align:center; color:var(--text-3); font-size:.85rem; margin-top:var(--s3); }
.post-content ul, .post-content ol { padding-left:var(--s6); }
.post-content li + li { margin-top:var(--s2); }
.post-content li::marker { color:var(--accent-2); }
.post-content code { font-family:var(--font-mono); background:var(--glass-tile); border:1px solid var(--border-subtle); border-radius:var(--radius-sm); padding:2px 7px; font-size:.88em; color:var(--text-1); }
.post-content pre { background:var(--bg-deep); border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:var(--s5); overflow-x:auto; }
.post-content pre code { background:none; border:none; padding:0; }
.post-content hr { border:none; height:1px; background:var(--grad-line); margin-block:var(--s8); }

.kg-callout-card { display:flex; gap:var(--s4); background:var(--glass-card); border:1px solid var(--border-subtle); border-left:3px solid; border-image:var(--grad-brand) 1; border-radius:var(--radius-md); padding:var(--s5); }
.post-content .kg-card { margin-inline:auto; }
.post-content .kg-width-wide { position:relative; left:50%; transform:translateX(-50%); width:min(var(--content-wide), calc(100vw - var(--s6) * 2)); }
.post-content .kg-width-full { position:relative; left:50%; transform:translateX(-50%); width:min(1600px, calc(100vw - var(--s6) * 2)); }
.post-content .kg-width-full img { width:100%; }

.kg-bookmark-container { display:flex; min-height:148px; text-decoration:none; color:inherit; background:var(--glass-card); border:1px solid var(--border-subtle); border-radius:var(--radius-lg); overflow:hidden; transition:border-color var(--t), transform var(--t); }
.kg-bookmark-container:hover { border-color:var(--border-violet); transform:translateY(-2px); }
.kg-bookmark-content { flex:1 1 60%; padding:var(--s5); display:flex; flex-direction:column; }
.kg-bookmark-title { color:var(--text-1); font-weight:600; }
.kg-bookmark-description { color:var(--text-2); font-size:.92rem; margin-top:var(--s2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.kg-bookmark-metadata { color:var(--text-3); font-size:.82rem; margin-top:auto; padding-top:var(--s3); display:flex; align-items:center; gap:var(--s2); }
.kg-bookmark-icon { width:18px; height:18px; border:none; border-radius:0; margin:0; }
.kg-bookmark-thumbnail { flex:1 1 33%; max-width:200px; }
.kg-bookmark-thumbnail img { width:100%; height:100%; object-fit:cover; border:none; border-radius:0; }

.kg-button-card { display:flex; margin:var(--s8) 0; }
.kg-button-card.kg-align-center { justify-content:center; }
.kg-button-card.kg-align-left { justify-content:flex-start; }
.post-content .kg-button-card .kg-btn { display:inline-flex; align-items:center; justify-content:center; min-height:60px; padding:22px 42px; border-radius:var(--radius-pill); font-weight:700; font-size:1.08rem; background:var(--grad-brand); color:#fff; box-shadow:0 12px 36px -10px var(--glow-violet); transition:transform var(--t), box-shadow var(--t); }
.post-content .kg-button-card .kg-btn:hover { transform:translateY(-2px); box-shadow:0 18px 46px -10px var(--glow-pink); }

.kg-gallery-image img { border-radius:var(--radius-md); border:1px solid var(--border-subtle); }

/* Video: robust 16:9 responsive wrapper (used for the #video hero and inline videos) */
.video-embed { position:relative; width:100%; padding-bottom:56.25%; margin:var(--s6) 0 var(--s7); border-radius:var(--radius-xl); overflow:hidden; border:1px solid var(--border-subtle); box-shadow:0 40px 80px -40px rgba(123,47,255,0.4); background:#000; }
.video-embed iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
/* Koenig embeds (if used) stay centered and responsive */
.kg-embed-card { display:flex; flex-direction:column; align-items:center; margin:var(--s6) 0; }
.post-content .kg-embed-card iframe { width:100%; aspect-ratio:16/9; height:auto; border:0; border-radius:var(--radius-lg); }

.kg-toggle-card { background:var(--glass-card); border:1px solid var(--border-subtle); border-radius:var(--radius-md); padding:var(--s5); }
.kg-toggle-heading { display:flex; justify-content:space-between; align-items:center; gap:var(--s4); cursor:pointer; }
.kg-toggle-heading-text { color:var(--text-1); font-family:var(--font-heading); font-weight:800; font-size:1.1rem; }
.kg-toggle-card-icon { width:20px; height:20px; flex:0 0 20px; color:var(--text-3); transition:transform var(--t-smooth); }
.kg-toggle-content { max-height:0; overflow:hidden; transition:max-height var(--t-smooth); color:var(--text-2); }
.kg-toggle-card.kg-toggle-card-show .kg-toggle-content { max-height:1200px; margin-top:var(--s4); }
.kg-toggle-card.kg-toggle-card-show .kg-toggle-card-icon { transform:rotate(180deg); }

/* ── Ghost/text button ── */
.btn-ghost { background:transparent; border-color:transparent; color:var(--text-2); box-shadow:none; padding:8px 6px; }
.btn-ghost:hover { color:var(--text-1); transform:none; box-shadow:none; }

/* ── Topic filter bar ── */
.filter-bar { position:sticky; top:var(--nav-h); z-index:40; border-block:1px solid var(--border-subtle); background:rgba(6,6,26,0.55); backdrop-filter:blur(var(--blur)); -webkit-backdrop-filter:blur(var(--blur)); }
.filter-bar-inner { display:flex; gap:var(--s2); overflow-x:auto; padding-block:var(--s3); scrollbar-width:none; }
.filter-bar-inner::-webkit-scrollbar { display:none; }
.filter-pill { flex:0 0 auto; padding:8px 16px; border-radius:var(--radius-pill); border:1px solid var(--border-strong); background:var(--glass-pill); color:var(--text-2); font-size:.88rem; font-weight:600; white-space:nowrap; transition:color var(--t), border-color var(--t), background var(--t); }
.filter-pill:hover { color:var(--text-1); border-color:var(--border-violet); }
.filter-pill.is-active { color:#fff; background-image:var(--grad-brand); border-color:transparent; }

/* ── Reading progress ── */
.reading-progress { position:fixed; top:0; left:0; right:0; height:3px; z-index:60; pointer-events:none; }
.reading-progress > span { display:block; height:100%; width:0; background:var(--grad-brand-r); box-shadow:0 0 10px var(--glow-violet); transition:width .1s linear; }

/* ── Post share ── */
.post-share { display:flex; align-items:center; gap:var(--s2); margin-top:var(--s6); flex-wrap:wrap; }
.post-share-label { font-size:.72rem; color:var(--text-3); text-transform:uppercase; letter-spacing:var(--tracking-section); font-weight:700; margin-right:var(--s1); }
.share-btn { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:0; border-radius:var(--radius-pill); border:1px solid var(--border-strong); background:var(--glass-pill); color:var(--text-2); cursor:pointer; transition:color var(--t), border-color var(--t), background var(--t), transform var(--t); }
.share-btn:hover { color:#fff; border-color:transparent; background-image:var(--grad-brand); transform:translateY(-2px); }
.share-btn svg { width:17px; height:17px; }
.share-btn.copied { color:#04140d; border-color:transparent; background-image:var(--grad-green); }

/* ── Post two-column layout: article + sticky TOC rail ── */
.post-layout { display:grid; grid-template-columns:minmax(0, 720px) 240px; justify-content:center; gap:var(--s8); align-items:start; }
.post-primary { min-width:0; }
.post-secondary { position:sticky; top:calc(var(--nav-h) + var(--s5)); }
@media (max-width:1000px){
  .post-layout { grid-template-columns:minmax(0, 720px); }
  .post-secondary { display:none; }
}

/* ── Post table of contents (right rail) ── */
.post-toc { padding:var(--s5); background:var(--glass-card); border:1px solid var(--border-strong); border-radius:var(--radius-lg); max-height:calc(100vh - var(--nav-h) - var(--s8)); overflow:auto; }
.post-toc-title { display:block; font-family:var(--font-heading); font-weight:800; font-size:.74rem; text-transform:uppercase; letter-spacing:var(--tracking-section); color:var(--text-3); padding-bottom:var(--s4); border-bottom:1px solid var(--border-subtle); }
.post-toc ol { list-style:none; padding:0; margin:0; }
.post-toc li { padding:var(--s3) 0; border-bottom:1px solid var(--border-subtle); }
.post-toc li:last-child { border-bottom:none; padding-bottom:0; }
.post-toc a { color:var(--text-2); font-size:.95rem; line-height:1.4; text-transform:capitalize; transition:color var(--t); }
.post-toc a:hover { color:var(--accent-2); }
.post-toc .toc-h3 { padding-left:var(--s4); font-size:.9rem; }
.post-toc .toc-h3 a { color:var(--text-3); }
.post-toc .toc-h3 a:hover { color:var(--accent-2); }

/* keep the sticky filter bar clear of the reading progress bar */
@media (max-width:520px){ .filter-bar { position:static; } }