/* Editorial blog — index + article. Inherits tokens from style.css. */

/* Nav ALWAYS solid/dark on blog pages (light bg, no dark hero) — CSS-driven so
   it never depends on JS/scroll state. Mirrors the .nav.scrolled look. */
.blog-page .nav{background:rgba(246,242,234,.94);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line),0 12px 30px -22px rgba(0,0,0,.4);padding:14px 0}
.blog-page .nav__brand-name{color:var(--ink)}
.blog-page .nav__brand-sub{color:var(--muted)}
.blog-page .nav__links a{color:var(--ink-soft)}
.blog-page .nav__cta{border-color:var(--ink);color:var(--ink)}
.blog-page .nav__cta:hover{background:var(--ink);color:var(--cream)}
.blog-page .nav__burger span{background:var(--ink)}

.bl-wrap{max-width:var(--container);margin:0 auto;padding:0 28px}
.bl-wrap--narrow{max-width:760px}

/* ---- index header ---- */
.bl-head{background:var(--cream-2, var(--surface, #eef0f2));border-bottom:1px solid var(--line);padding:64px 0 56px;text-align:center}
.blog-fixed .bl-head{padding-top:120px}  /* editorial's nav is position:fixed → extra offset */
.bl-eyebrow{font-size:.78rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--brass, var(--accent, var(--blue, #15776a)));margin-bottom:14px}
.bl-h1{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:clamp(2rem,4.6vw,3.1rem);line-height:1.08;letter-spacing:-.01em;color:var(--ink);max-width:20ch;margin:0 auto 14px}
.bl-intro{color:var(--muted);font-size:1.08rem;max-width:56ch;margin:0 auto}

/* ---- index grid ---- */
.bl-list{padding:56px 0 84px}
.bl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.bl-card{display:flex;flex-direction:column;background:var(--white, var(--bg, #fff));border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow-soft);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.bl-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.bl-card__media{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--cream-2, var(--surface, #eef0f2))}
.bl-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.bl-card:hover .bl-card__media img{transform:scale(1.05)}
.bl-card__ph{width:100%;height:100%;display:grid;place-items:center;font-family:var(--font-serif, var(--font, inherit));font-size:3rem;color:var(--brass, var(--accent, var(--blue, #15776a)));background:var(--cream-2, var(--surface, #eef0f2))}
.bl-card__cat{position:absolute;top:14px;left:14px;background:rgba(25,23,18,.82);color:#fff;font-size:.72rem;font-weight:600;letter-spacing:.04em;padding:.4em .9em;border-radius:100px}
.bl-card__body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.bl-card__title{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:1.32rem;line-height:1.2;color:var(--ink)}
.bl-card__excerpt{color:var(--muted);font-size:.96rem;line-height:1.55;flex:1}
.bl-card__meta{font-size:.82rem;color:var(--brass-dark, var(--accent-dark, var(--blue-dark, #0f5d53)));font-weight:600;letter-spacing:.02em}

/* ---- article ---- */
.bl-article{padding:60px 0 84px}
.blog-fixed .bl-article{padding-top:112px}
.bl-crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.84rem;color:var(--muted);margin-bottom:30px}
.bl-crumbs a{color:var(--brass-dark, var(--accent-dark, var(--blue-dark, #0f5d53)));text-decoration:none}
.bl-crumbs a:hover{text-decoration:underline}
.bl-crumbs__cur{color:var(--ink-soft)}
.bl-article__cat{display:inline-block;background:var(--cream-2, var(--surface, #eef0f2));color:var(--brass-dark, var(--accent-dark, var(--blue-dark, #0f5d53)));font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.4em .9em;border-radius:100px;margin-bottom:18px}
.bl-article__title{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:clamp(2rem,4.4vw,3rem);line-height:1.1;letter-spacing:-.01em;color:var(--ink);margin-bottom:22px}
.bl-article__meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.94rem;padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:30px}
.bl-article__meta b{color:var(--ink-soft)}
.bl-article__avatar img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.bl-article__lead{font-size:1.22rem;line-height:1.6;color:var(--ink-soft);font-weight:500;margin-bottom:28px}
.bl-cover{margin:0 0 34px;border-radius:var(--radius-lg);overflow:hidden}
.bl-cover img{width:100%;display:block}

/* ---- prose (article body from the editor) ---- */
.bl-prose{font-size:1.08rem;line-height:1.78;color:var(--ink-soft)}
.bl-prose>*+*{margin-top:1.2em}
.bl-prose h2{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:1.7rem;line-height:1.2;color:var(--ink);margin-top:1.9em}
.bl-prose h3{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:1.32rem;color:var(--ink);margin-top:1.6em}
.bl-prose a{color:var(--brass-dark, var(--accent-dark, var(--blue-dark, #0f5d53)));text-decoration:underline;text-underline-offset:2px}
.bl-prose ul,.bl-prose ol{padding-left:1.3em}
.bl-prose li{margin-top:.5em}
.bl-prose img{max-width:100%;height:auto;border-radius:var(--radius)}
.bl-prose blockquote{border-left:3px solid var(--brass, var(--accent, var(--blue, #15776a)));padding:.2em 0 .2em 1.2em;color:var(--ink);font-family:var(--font-serif, var(--font, inherit));font-size:1.25rem;font-style:italic}
.bl-prose strong{color:var(--ink)}

/* ---- FAQ (GEO/AEO) ---- */
.bl-faq{margin-top:54px;border-top:1px solid var(--line);padding-top:40px}
.bl-faq__h{font-family:var(--font-serif, var(--font, inherit));font-weight:500;font-size:1.6rem;color:var(--ink);margin-bottom:18px}
.bl-faq__item{border:1px solid var(--line);border-radius:var(--radius);padding:4px 18px;margin-bottom:12px;background:var(--white, var(--bg, #fff))}
.bl-faq__item summary{cursor:pointer;font-weight:600;color:var(--ink);padding:14px 0;list-style:none;display:flex;justify-content:space-between;align-items:center}
.bl-faq__item summary::after{content:"+";color:var(--brass, var(--accent, var(--blue, #15776a)));font-size:1.4rem;line-height:1}
.bl-faq__item[open] summary::after{content:"–"}
.bl-faq__a{padding:0 0 16px;color:var(--muted);line-height:1.65}

/* ---- author box + back ---- */
.bl-author{display:flex;gap:18px;align-items:center;margin-top:54px;padding:26px;background:var(--cream-2, var(--surface, #eef0f2));border-radius:var(--radius-lg)}
.bl-author__pic img{width:72px;height:72px;border-radius:50%;object-fit:cover}
.bl-author__name{font-family:var(--font-serif, var(--font, inherit));font-size:1.25rem;color:var(--ink)}
.bl-author__role{color:var(--muted);font-size:.94rem;margin:2px 0 12px}
.bl-back{margin-top:40px}
.bl-back a{color:var(--brass-dark, var(--accent-dark, var(--blue-dark, #0f5d53)));text-decoration:none;font-weight:600}
.bl-back a:hover{text-decoration:underline}

@media(max-width:900px){.bl-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.bl-grid{grid-template-columns:1fr}.bl-author{flex-direction:column;text-align:center}}