/* PathfoundHer blog: shared styles for /blog/ pages.
   Tokens, header and footer match index.html on the main site. */
:root{
  --paper:#FBF6EE;
  --paper-deep:#F4EBDD;
  --ink:#2B1B36;
  --ink-soft:#5C4A6B;
  --marigold:#DFA231;
  --marigold-deep:#B97F17;
  --berry:#1F7A8C;
  --rose:#C96A7E;
  --leaf:#22352B;
  --plum-tint:#F1E9F4;
  --gold-tint:#F8EFDC;
  --line:#E3D6C2;
  --radius:18px;
  --measure:68ch;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--paper);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:999;border-radius:0 0 8px 0}
.skip:focus{left:0}
:focus-visible{outline:2.5px solid var(--marigold-deep);outline-offset:3px;border-radius:4px}
[id]{scroll-margin-top:84px}

/* ---------- header (copied from index.html) ---------- */
header.site{position:sticky;top:0;z-index:100;background:rgba(251,246,238,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.head-in{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:.8rem 1.25rem;position:relative}
.wordmark{font-family:'Fraunces',serif;font-weight:600;font-size:1.35rem;text-decoration:none;line-height:1}
.wordmark small{display:block;font-family:'DM Sans',sans-serif;font-size:.58rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);margin-top:.35rem}
.logo-img{height:34px;width:auto;display:block}
nav.main{display:flex;gap:1.6rem;align-items:center}
nav.main a{font-size:.82rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft);padding:.35rem 0;border-bottom:2px solid transparent}
nav.main a:hover,nav.main a[aria-current]{color:var(--ink);border-bottom-color:var(--marigold)}
nav.main a.cta{background:var(--ink);color:var(--paper);padding:.55rem 1.15rem;border-radius:999px;border:none}
nav.main a.cta:hover{background:var(--marigold-deep)}
.menu-btn{display:none;background:none;border:1.5px solid var(--ink);border-radius:8px;padding:.4rem .7rem;font:inherit;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;color:var(--ink)}

/* ---------- shared bits ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 1.25rem}
.eyebrow{font-size:.72rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--marigold-deep);display:flex;align-items:center;gap:.8rem}
.eyebrow::before{content:"";width:34px;height:2px;background:var(--marigold)}
.crumbs{font-size:.8rem;color:var(--ink-soft);padding-top:1.6rem}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem}
.crumbs li+li::before{content:"›";margin-right:.4rem;color:var(--marigold-deep)}
.crumbs a{text-decoration:none;border-bottom:1px solid var(--line)}
.crumbs a:hover{border-bottom-color:var(--marigold)}
.cat{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--berry);text-decoration:none}

/* ---------- blog home ---------- */
.blog-hero{padding:3.2rem 0 2rem}
.blog-hero h1{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(2.3rem,5.4vw,3.8rem);line-height:1.05;letter-spacing:-.02em;margin:1rem 0 1rem;max-width:16ch}
.blog-hero h1 em{font-style:italic;color:var(--berry)}
.blog-hero p{max-width:56ch;color:var(--ink-soft);font-size:1.05rem}
.filters{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.6rem 0 .4rem}
.filters button{font:inherit;font-size:.8rem;font-weight:500;background:#fff;border:1px solid var(--line);color:var(--ink-soft);padding:.4rem .9rem;border-radius:999px;cursor:pointer}
.filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;padding:1.6rem 0 4.5rem}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 30px -14px rgba(43,27,54,.28)}
.card img{aspect-ratio:1200/630;object-fit:cover;width:100%;background:var(--paper-deep)}
.card-body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.card h2{font-family:'Fraunces',serif;font-weight:600;font-size:1.3rem;line-height:1.2}
.card h2 a{text-decoration:none}
.card h2 a::after{content:"";position:absolute;inset:0}
.card{position:relative}
.card p{color:var(--ink-soft);font-size:.95rem}
.card .meta{margin-top:auto;font-size:.78rem;color:var(--ink-soft)}
.card.featured{grid-column:1/-1;flex-direction:row}
.card.featured img{width:55%;aspect-ratio:auto;min-height:100%}
.card.featured .card-body{padding:2rem 2.2rem;justify-content:center}
.card.featured h2{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.empty{background:#fff;border:1px dashed var(--marigold);border-radius:var(--radius);padding:2.4rem 2rem;text-align:center;margin:1.6rem 0 4.5rem;color:var(--ink-soft)}
.empty strong{display:block;font-family:'Fraunces',serif;font-size:1.4rem;color:var(--ink);margin-bottom:.4rem}

/* ---------- post ---------- */
.post-head{max-width:var(--measure);margin:0 auto;padding:1.4rem 0 1.6rem}
.post-head h1{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.1;letter-spacing:-.015em;margin:.8rem 0 1.2rem}
.byline{display:flex;align-items:center;gap:.85rem;font-size:.86rem;color:var(--ink-soft)}
.byline img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--marigold);flex:none}
.byline a{color:var(--ink);font-weight:700;text-decoration:none}
.byline a:hover{text-decoration:underline}
.byline .dates{display:block}
.feature{max-width:980px;margin:0 auto 2.4rem}
.feature img{width:100%;border-radius:var(--radius);aspect-ratio:1200/630;object-fit:cover;background:var(--paper-deep)}
.feature figcaption{font-size:.78rem;color:var(--ink-soft);margin-top:.5rem;text-align:center}

.post-body{max-width:var(--measure);margin:0 auto;font-size:1.08rem}
.post-body > *+*{margin-top:1.1rem}
.post-body h2{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(1.5rem,3vw,1.95rem);line-height:1.2;margin-top:2.8rem;padding-top:1.4rem;border-top:2px dashed var(--marigold)}
.post-body h3{font-family:'Fraunces',serif;font-weight:600;font-size:1.25rem;margin-top:1.8rem}
.post-body a{color:var(--berry);text-decoration-thickness:1px;text-underline-offset:3px}
.post-body a:hover{color:var(--ink)}
.post-body ul,.post-body ol{padding-left:1.4rem}
.post-body li+li{margin-top:.4rem}
.post-body li::marker{color:var(--marigold-deep)}
.post-body strong{color:var(--ink)}
.post-body blockquote{border-left:4px solid var(--marigold);background:var(--gold-tint);padding:1rem 1.25rem;border-radius:0 12px 12px 0;font-family:'Fraunces',serif;font-size:1.15rem}
.post-body .takeaway{background:var(--plum-tint);border-radius:12px;padding:1rem 1.25rem;font-weight:500}
.post-body .takeaway::before{content:"Takeaway";display:block;font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.25rem}
.post-body figure img{border-radius:12px}
.post-body figcaption{font-size:.8rem;color:var(--ink-soft);margin-top:.4rem}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:#fff}
.post-body table{width:100%;border-collapse:collapse;font-size:.95rem;min-width:420px}
.post-body th,.post-body td{text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--line);vertical-align:top}
.post-body th{background:var(--paper-deep);font-weight:700}
.post-body tr:last-child td{border-bottom:none}
.post-body .example{border:1px solid var(--line);background:#fff;border-radius:var(--radius);padding:1.3rem 1.4rem}
.post-body .example::before{content:attr(data-label);display:block;font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--berry);margin-bottom:.4rem}

.toc{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.4rem;font-size:.95rem}
.toc h2{all:unset;display:block;font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--marigold-deep);margin-bottom:.5rem}
.toc ol{padding-left:1.2rem}
.toc a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line)}
.toc a:hover{border-bottom-color:var(--marigold)}

.faq details{border-bottom:1px solid var(--line);padding:.9rem 0}
.faq summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--marigold-deep);font-size:1.3rem;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin-top:.6rem;color:var(--ink-soft)}

.related{list-style:none;padding:0!important}
.related li{background:#fff;border:1px solid var(--line);border-radius:12px;padding:.9rem 1.1rem}
.related li+li{margin-top:.6rem}
.related a{font-weight:700;color:var(--ink)!important;text-decoration:none}
.related a:hover{text-decoration:underline}
.related span{display:block;font-size:.92rem;color:var(--ink-soft)}

.sources{font-size:.92rem;color:var(--ink-soft)}
.sources li{word-break:break-word}

.close{background:var(--leaf);color:#E9EFE7;border-radius:var(--radius);padding:1.6rem 1.6rem}
.close h2{all:unset;display:block;font-family:'Fraunces',serif;font-weight:600;font-size:1.4rem;color:#fff;margin-bottom:.5rem}
.close p+p{margin-top:.8rem}
.close .reflect{font-family:'Fraunces',serif;font-style:italic;font-size:1.15rem;color:var(--marigold)}
.close a{color:#fff}

.bio{display:flex;gap:1.1rem;align-items:flex-start;border-top:1px solid var(--line);padding-top:1.6rem;margin-top:2.6rem!important}
.bio img{width:72px;height:72px;border-radius:50%;object-fit:cover;flex:none;border:2px solid var(--marigold)}
.bio h2{all:unset;display:block;font-family:'Fraunces',serif;font-weight:600;font-size:1.15rem}
.bio p{font-size:.95rem;color:var(--ink-soft);margin-top:.3rem}
.bio a{color:var(--berry)}
.post-end{height:4.5rem}

/* ---------- author page ---------- */
.author{max-width:var(--measure);margin:0 auto;padding:2rem 0 4.5rem}
.author-top{display:flex;gap:1.6rem;align-items:center;margin-bottom:1.6rem}
.author-top img{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--marigold);flex:none}
.author h1{font-family:'Fraunces',serif;font-weight:600;font-size:clamp(2rem,4.4vw,2.8rem);line-height:1.1}
.author .role{color:var(--ink-soft);margin-top:.3rem}
.author .prose > *+*{margin-top:1rem}
.author .prose h2{font-family:'Fraunces',serif;font-size:1.4rem;margin-top:2rem}
.author .prose a{color:var(--berry)}
.author .prose ul{padding-left:1.3rem}

/* ---------- footer (copied from index.html) ---------- */
footer{background:var(--ink);color:#C9B8D6;padding:2.4rem 1.25rem;font-size:.82rem}
.foot-in{max-width:1180px;margin:0 auto;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:center}
.logo-img-foot{height:30px;width:auto;display:block;margin-bottom:.6rem;opacity:.95}
footer nav{display:flex;gap:1.4rem;flex-wrap:wrap}
footer nav a{text-decoration:none;color:#C9B8D6}
footer nav a:hover{color:#fff}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .post-list{grid-template-columns:1fr 1fr}
  .card.featured{flex-direction:column}
  .card.featured img{width:100%;aspect-ratio:1200/630;min-height:0;height:auto}
  .card.featured .card-body{padding:1.4rem}
}
@media (max-width:700px){
  .logo-img{height:28px}
  nav.main{display:none;position:absolute;top:100%;right:0;left:0;background:var(--paper);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:1rem 1.25rem;gap:.4rem}
  nav.main.open{display:flex}
  nav.main a{padding:.7rem .2rem;border-bottom:1px solid var(--line)}
  nav.main a.cta{text-align:center;margin-top:.6rem;border-bottom:none}
  .menu-btn{display:block}
  .blog-hero{padding-top:2rem}
  .post-list{grid-template-columns:1fr}
  .post-body{font-size:1.02rem}
  .author-top{flex-direction:column;align-items:flex-start}
  .bio{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}
@media print{header.site,footer,.toc,.filters{display:none}.post-body a::after{content:" (" attr(href) ")";font-size:.8em}}