/* Shared editorial art direction for the resources index and every article. */
:root {
  --canvas:#f7f4ef; --cream:#f7f4ef; --surface:#fffdfa; --warm-white:#fffdfa;
  --surface-alt:#eee8e5; --paper:#fffdfa; --plum:#302a33; --plum-dark:#302a33;
  --plum-hover:#625160; --ink:#302a33; --charcoal:#302a33; --olive-charcoal:#302a33;
  --text:#514b50; --text-soft:#514b50; --muted:#746e72; --muted-txt:#746e72;
  --mist:#746e72; --mist-lt:#746e72; --slate:#514b50; --sage:#f2ede8;
  --sage-dark:#302a33; --sage-soft:#f2ede8; --accent:#765d70; --copper:#765d70;
  --copper-deep:#765d70; --gold:#765d70; --gold-light:#dcc0d1; --blush-soft:#eee8e5;
  --line:#ddd5d0; --border:#ddd5d0; --border-lt:#ddd5d0; --border-tone:#ddd5d0;
  --px:clamp(1.25rem,4.4vw,5rem);
}
body { background:var(--cream); color:var(--text); }
::selection { background:#dbcbd4; color:var(--ink); }
:focus-visible, a:focus-visible, button:focus-visible { outline:3px solid #9e7894; outline-offset:4px; }

/* Carry the homepage brand and navigation across the reading experience. */
#siteNav, #siteNav.scrolled {
  position:sticky; top:0; z-index:200; min-height:82px; padding:0 var(--px);
  background:rgba(247,244,239,.96); border:0; border-bottom:1px solid var(--line);
  box-shadow:none; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
}
.nav-logo { text-decoration:none; }
.companion-brand { color:var(--ink); }
.companion-brand .brand-mark { color:var(--accent); }
.companion-brand .brand-words { color:var(--ink); font-family:var(--serif); letter-spacing:-.035em; }
.companion-brand .brand-words small { color:var(--text); font-family:var(--sans); letter-spacing:.16em; }
.nav-links { gap:clamp(1rem,2.2vw,2.15rem); }
.nav-links a { color:var(--ink); font-size:.87rem; font-weight:500; letter-spacing:-.02em; text-transform:none; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color:var(--accent); }
.nav-cta { display:flex; align-items:center; gap:2rem; background:var(--plum-dark)!important; color:#fffdfa!important; border-radius:2px; padding:.85rem 1.2rem!important; box-shadow:none; font-size:.86rem!important; letter-spacing:0!important; font-weight:500!important; }
.nav-cta:hover { background:#625160!important; }
.nav-cta span { font-size:1.35rem; line-height:.65; font-weight:300; }
.nav-mobile { flex-direction:row; gap:0; align-items:center; justify-content:center; width:88px; height:44px; padding:0 16px; border:1px solid var(--line); border-radius:100px; }
.nav-mobile::before { content:'Menu'; margin-right:9px; color:var(--ink); font-size:.78rem; }
.nav-mobile span { width:18px; height:1px; background:var(--ink); }
.nav-mobile span:nth-of-type(1), .nav-mobile span:nth-of-type(3) { display:none; }
#mobileMenu { display:none; position:fixed; inset:0; z-index:999; flex-direction:column; justify-content:center; align-items:center; gap:1.15rem; padding:2rem; background:var(--cream); }
#mobileMenu::before { content:''; position:absolute; inset:0; z-index:-1; background:url('paper-line-hero.webp') center/cover no-repeat; opacity:.25; }
#mobileMenuClose { position:absolute; top:1.25rem; right:1.5rem; width:44px; height:44px; border:1px solid var(--line); border-radius:100px; background:var(--paper); color:var(--ink); font:300 1.35rem var(--sans); cursor:pointer; }
#mobileMenu .mob-link { color:var(--ink); text-decoration:none; font:300 clamp(1.45rem,5vw,2rem)/1.2 var(--serif); }
#mobileMenu .mob-cta { display:flex; justify-content:space-between; gap:2.5rem; margin-top:.8rem; padding:.9rem 1.2rem; background:var(--plum-dark); color:#fffdfa; font:500 .88rem var(--sans); }

/* The index opens like a quiet paper cover, then becomes an editorial list. */
.blog-hero { position:relative; display:block; min-height:620px; padding:0 var(--px); overflow:hidden; border-bottom:1px solid var(--line); background:#eae3da; text-align:left; }
.blog-hero::before { content:''; position:absolute; inset:0; background:url('paper-line-hero.webp') center 46%/cover no-repeat; opacity:.66; }
.blog-hero::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(247,244,239,.68),rgba(247,244,239,.27) 54%,rgba(247,244,239,.82)); }
.blog-hero-inner { position:relative; z-index:1; display:flex; flex-direction:column; min-height:620px; max-width:1380px; margin:0 auto; padding:21px 0 45px; }
.blog-topline { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; padding-top:13px; border-top:1px solid rgba(48,42,51,.42); color:var(--ink); font:600 .61rem/1.4 var(--sans); letter-spacing:.17em; }
.blog-topline span:nth-child(2) { text-align:center; }
.blog-topline span:last-child { text-align:right; }
.blog-hero .hero-title { max-width:1000px; margin:auto; padding:4rem 0; color:var(--ink); text-align:center; font:300 clamp(4rem,6.1vw,7.25rem)/1 var(--serif); letter-spacing:-.055em; }
.blog-hero .hero-title em { color:var(--accent); font-weight:300; }
.blog-hero-foot { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:end; gap:3rem; padding-top:20px; border-top:1px solid rgba(48,42,51,.4); }
.blog-hero .hero-desc { max-width:670px; margin:0; color:var(--ink); font:300 clamp(1.12rem,1.6vw,1.45rem)/1.4 var(--serif); letter-spacing:-.015em; }
.blog-hero .hero-meta { display:flex; flex-direction:column; align-items:flex-end; gap:.15rem; margin:0; color:var(--text); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.blog-hero .hero-meta strong { color:var(--ink); font:300 2.7rem/1 var(--serif); }
.blog-body { max-width:1380px; padding:clamp(4.5rem,8vw,8rem) var(--px) clamp(5rem,9vw,9rem); }
.section-label { display:flex; align-items:center; gap:1rem; margin:0 0 1.5rem; padding-top:12px; border-top:1px solid var(--ink); color:var(--accent); font-size:.67rem; font-weight:600; letter-spacing:.18em; }
.featured-card { grid-template-columns:1.08fr 1fr; min-height:420px; margin-bottom:clamp(5rem,8vw,8rem); border:0; border-bottom:1px solid var(--ink); border-radius:0; background:transparent; box-shadow:none; transition:none; }
.featured-card:hover { box-shadow:none; transform:none; }
.featured-media { min-height:420px; }
.featured-media img { transition:transform .5s ease; }
.featured-body { gap:1rem; padding:clamp(2rem,4vw,4rem); background:var(--surface-alt); }
.featured-label { color:var(--accent); font-size:.65rem; }
.featured-label::after { background:var(--accent); }
.featured-title { color:var(--ink); font-size:clamp(2rem,3vw,3.25rem); font-weight:300; letter-spacing:-.045em; line-height:1.12; }
.featured-excerpt { color:var(--text); font-size:.93rem; font-weight:400; }
.featured-foot { border-color:var(--line); }
.card-tag { padding:0; border-radius:0; background:none; color:var(--accent); font-size:.64rem; font-weight:600; letter-spacing:.16em; }
.card-read { color:var(--ink); }
.filter-row { gap:.55rem; margin-bottom:2.5rem; }
.filter-btn { padding:.58rem 1rem; border-color:var(--line); border-radius:2px; color:var(--ink); font-size:.68rem; font-weight:500; }
.filter-btn:hover { border-color:var(--accent); color:var(--accent); }
.filter-btn.active { border-color:var(--ink); background:var(--ink); color:var(--paper); }
.articles-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:3.7rem 1.7rem; }
.article-card { border:0; border-top:1px solid var(--ink); border-radius:0; background:transparent; box-shadow:none; transition:none; }
.article-card:hover { box-shadow:none; transform:none; }
.card-media { aspect-ratio:1.52; margin-top:14px; border-radius:2px; }
.card-body { gap:.82rem; padding:1.25rem 0 0; }
.card-title { color:var(--ink); font-size:clamp(1.45rem,1.8vw,1.95rem); font-weight:400; letter-spacing:-.04em; line-height:1.2; }
.card-excerpt { color:var(--text); font-size:.87rem; }
.card-footer { border-color:var(--line); }
.card-meta { color:var(--muted); }
.cta-strip { margin:0; padding:clamp(4.5rem,7vw,7rem) var(--px); background:var(--plum-dark); }
.cta-strip h2 { color:var(--paper); font-size:clamp(2.5rem,4.6vw,4.9rem); font-weight:300; letter-spacing:-.055em; }
.cta-strip h2 em { color:#dcc0d1; }
.cta-strip p { color:#ddd3da; }
.btn-cta { padding:1rem 1.6rem; border-radius:2px; background:var(--paper); color:var(--ink); box-shadow:none; }
.btn-cta:hover { background:#eadfe5; }

/* Article covers use the same typographic and paper vocabulary. */
#readProgress { height:2px; border-radius:0; background:var(--accent); }
.article-wrap { position:relative; padding-top:0; overflow:hidden; }
.article-wrap::before { content:''; position:absolute; inset:0 0 auto; height:760px; background:url('paper-line-hero.webp') center 32%/cover no-repeat; opacity:.19; pointer-events:none; }
.back-bar, .article-header, .hero-figure, .article-body, .article-end { position:relative; z-index:1; }
.back-bar { max-width:1320px; padding:30px var(--px) 0; }
.back-bar a { color:var(--ink); font-size:.76rem; text-transform:uppercase; letter-spacing:.12em; }
.article-header { max-width:1180px; padding:55px var(--px) 48px; }
.article-tag { display:block; margin:0 0 1.25rem; padding:0; border:0; border-radius:0; background:none; color:var(--accent); font-size:.68rem; letter-spacing:.18em; }
.article-header h1 { max-width:1100px; margin:0 auto 1.45rem; color:var(--ink); font-size:clamp(2.75rem,5.1vw,5.5rem); font-weight:300; letter-spacing:-.055em; line-height:1.08; }
.article-dek { max-width:780px; margin:0 auto 2rem; color:var(--text); font-size:clamp(1rem,1.35vw,1.16rem); font-weight:400; line-height:1.6; }
.article-byline { max-width:780px; margin:0 auto; padding:1.25rem 0 0; border-top:1px solid var(--line); gap:1.5rem; }
.art-author-av { width:46px; height:54px; border:2px solid var(--paper); border-radius:0; background:url('../victoria.webp') center 20%/cover no-repeat; box-shadow:0 6px 12px rgba(48,42,51,.12); font-size:0; }
.art-author-name { color:var(--ink); }
.art-author-label, .art-author-cred, .art-meta-item { color:var(--text); }
.art-meta-divider { background:var(--line); }
.hero-figure { max-width:1320px; }
.hero-figure .hero-frame { aspect-ratio:2.4; border:1px solid var(--line); border-radius:2px; background:var(--surface-alt); box-shadow:none; }
.hero-figure .hero-veil { background:linear-gradient(to top,rgba(48,42,51,.12),transparent 33%); }
.article-body { max-width:1320px; grid-template-columns:minmax(0,1fr) 290px; gap:clamp(3rem,6vw,7rem); padding-top:clamp(3.5rem,6vw,6rem); }
.article-content { max-width:730px; }
.article-content h2 { margin-top:3.2rem; padding-top:1.2rem; border-top:1px solid var(--line); color:var(--ink); font-size:clamp(2rem,2.7vw,2.7rem); font-weight:300; letter-spacing:-.04em; }
.article-content h2:first-child { margin-top:0; padding-top:0; border-top:0; }
.article-content h3 { color:var(--ink); font-weight:400; }
.article-content p, .article-content ul li, .article-content ol li { color:var(--text); font-weight:400; }
.article-content blockquote { border:0; border-left:2px solid var(--accent); border-radius:0; background:var(--surface-alt); box-shadow:none; }
.article-content a { color:var(--accent); text-decoration-color:var(--accent); }
.disclaimer { border:1px solid var(--line); border-radius:2px; background:var(--paper); }
.disclaimer strong { color:var(--ink); }
.article-sidebar { top:108px; gap:1.5rem; }
.sb-widget { padding:1.45rem; border:1px solid var(--line); border-radius:2px; background:var(--paper); box-shadow:none; }
.sb-widget-title { color:var(--accent); }
.sb-cta { border:0; background:var(--plum-dark); box-shadow:none; }
.sb-cta::before { display:none; }
.article-body .sb-cta .sb-widget-title { color:#dcc0d1; }
.sb-cta h3 { color:var(--paper); font-size:1.9rem; font-weight:300; letter-spacing:-.035em; }
.sb-cta h3 em { color:#dcc0d1; }
.article-body .sb-cta p, .article-body .sb-cta .sb-cta-note { color:#e4dbe1; font-weight:400; }
.sb-cta .sb-btn { background:var(--paper); color:var(--ink); border-color:var(--paper); }
.sb-cta .sb-btn:hover { background:#eadfe5; color:var(--ink); }
.sb-cta .sb-btn.dark { background:transparent; color:var(--paper); border-color:rgba(255,255,255,.65); }
.sb-cta .sb-btn.dark:hover { background:rgba(255,255,255,.12); color:var(--paper); border-color:var(--paper); }
.sb-btn { border-radius:2px; box-shadow:none; }
.sb-btn.dark { border-color:rgba(255,255,255,.4); }
.toc-list a { border-radius:0; }
.toc-list a.active { background:var(--surface-alt); border-color:var(--accent); color:var(--ink); }
.related-item a { border-radius:2px; }
.related-thumb { border-radius:2px; }
.article-end { max-width:1320px; padding-top:4rem; }
.end-cta { padding:clamp(2.5rem,5vw,5rem); border:0; border-radius:2px; background:var(--plum-dark); box-shadow:none; }
.end-cta::before { display:none; }
.end-cta-label, .end-cta h2 em { color:#dcc0d1; }
.end-cta h2 { color:var(--paper); font-size:clamp(2.25rem,3.6vw,3.8rem); font-weight:300; letter-spacing:-.05em; }
.end-cta p { color:#ddd3da; font-weight:400; }
.end-btn { border-radius:2px; box-shadow:none!important; }
.end-btn.primary { background:var(--paper); color:var(--ink); }
.end-btn.primary:hover { background:#eadfe5; }
.end-btn.ghost { color:var(--paper); border-color:rgba(255,255,255,.55); }
.end-btn.ghost:hover { border-color:var(--paper); }
.pn-card { border:0; border-top:1px solid var(--ink); border-radius:0; background:transparent; box-shadow:none; }
.pn-card:hover { box-shadow:none; }
.pn-title { font-weight:400; }

/* A consistent close across the index and article template. */
footer { margin-top:0; padding:clamp(3rem,5vw,5rem) var(--px) 0; background:var(--plum-dark); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:clamp(1.25rem,3.5vw,3rem); padding-bottom:3rem; border-bottom:1px solid rgba(255,255,255,.2); }
.footer-brand { display:block; width:max-content; margin-bottom:1rem; color:var(--paper); font:400 1.65rem/1 var(--serif); letter-spacing:-.035em; text-decoration:none; }
.footer-brand small { display:block; margin-top:.6rem; color:#cfc3ce; font:500 .55rem/1.4 var(--sans); letter-spacing:.17em; }
.footer-desc + .footer-desc { margin-top:1rem; }
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:.65rem; }
.footer-col ul a { text-decoration:none; }
.footer-brand span { color:#dcc0d1; }
.footer-col h4 { color:#dcc0d1; }
.footer-bottom { border-color:rgba(255,255,255,.22); }
.footer-copy, .footer-links a, .footer-crisis, .footer-desc, .footer-col ul a, .footer-col ul li span { color:#cfc3ce; }
.footer-links a:hover, .footer-col ul a:hover { color:var(--paper); }

@media(max-width:1050px) {
  .nav-links { gap:1rem; }
  .nav-links a { font-size:.77rem; }
  .nav-cta { gap:.7rem; padding:.75rem 1rem!important; }
  .articles-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:900px) {
  #siteNav, #siteNav.scrolled { min-height:70px; }
  .nav-links { display:none; }
  .nav-mobile { display:flex; }
  .article-body { grid-template-columns:1fr; }
  .article-sidebar { position:static; max-width:730px; width:100%; margin:0 auto; }
}
@media(max-width:700px) {
  html { scroll-behavior:auto; }
  .blog-hero, .blog-hero-inner { min-height:570px; }
  .blog-hero-inner { padding:17px 0 28px; }
  .blog-topline { display:flex; justify-content:space-between; font-size:.52rem; letter-spacing:.1em; }
  .blog-topline span:last-child { display:none; }
  .blog-hero .hero-title { padding:3rem 0; font-size:clamp(3.25rem,12vw,5rem); line-height:1.04; }
  .blog-hero-foot { grid-template-columns:1fr; gap:1rem; }
  .blog-hero .hero-meta { align-items:flex-start; flex-direction:row; gap:.45rem; align-items:baseline; }
  .blog-hero .hero-meta strong { font-size:1.55rem; }
  .blog-body { padding-top:4.5rem; }
  .featured-card { grid-template-columns:1fr; margin-bottom:5rem; }
  .featured-media { min-height:0; aspect-ratio:1.35; }
  .featured-body { padding:1.7rem; }
  .articles-grid { grid-template-columns:1fr; gap:3rem; }
  .card-title { font-size:1.8rem; }
  .article-header { padding:2.2rem var(--px) 2rem; }
  .article-header h1 { font-size:clamp(2.55rem,10vw,4rem); }
  .article-byline { justify-content:flex-start; }
  .art-meta-divider { display:none; }
  .hero-figure .hero-frame { aspect-ratio:1.25; }
  .article-body { padding-top:3rem; }
  .article-content h2 { font-size:2rem; }
  .article-end { padding-top:3rem; }
  .end-cta { text-align:left; }
  .end-cta p { margin-left:0; }
  .end-cta-btns { justify-content:flex-start; }
  .footer-grid { grid-template-columns:1fr; gap:1.75rem; }
}
@media(prefers-reduced-motion:reduce) {
  .featured-media img, .card-img, .end-btn, .btn-cta { transition:none!important; }
}