/* ==========================================================================
   BDG · Stewardship Briefs — shared stylesheet
   Reuses the site design system (navy/gold, Fraunces/Inter/IBM Plex Mono)
   plus editorial archive + article styles. Load with the Google Fonts link.
   ========================================================================== */
:root{--navy:#002241;--gold:#C7A163;--white:#FFFFFF;--steel:#5A6F8C;--navy-2:#042D54;--navy-deep:#001527;--tint:#F5F7FA;--steel-line:rgba(90,111,140,.2);--muted-navy:#AEBACB;--gold-2:#D9BC85;--ink:#002241;--muted:#5A6F8C;--maxw:1200px;--es:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--white);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Fraunces',Georgia,serif;font-weight:500;line-height:1.1;letter-spacing:-.015em;color:var(--navy)}
::selection{background:var(--gold);color:var(--navy)}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 40px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--steel);font-weight:500}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--gold)}
.eyebrow.on-navy{color:var(--gold-2)}.eyebrow.center{justify-content:center}
.cta{display:inline-flex;align-items:center;gap:10px;background:var(--gold);color:var(--navy);font-weight:600;font-size:16px;padding:16px 30px;border-radius:9px;cursor:pointer;border:none;box-shadow:0 14px 30px -14px rgba(199,161,99,.6);transition:transform .24s var(--es),box-shadow .24s}
.cta:hover{transform:translateY(-2px);box-shadow:0 20px 40px -14px rgba(199,161,99,.8)}
.cta .ar{transition:transform .24s var(--es)}.cta:hover .ar{transform:translateX(5px)}
.link-more{display:inline-flex;align-items:center;gap:8px;font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.06em;color:var(--navy);font-weight:500;text-transform:uppercase;border-bottom:2px solid rgba(199,161,99,.5);padding-bottom:3px;transition:gap .22s,border-color .22s}
.link-more:hover{gap:14px;border-color:var(--gold)}

/* header / nav (mirrors the site) — scoped to the page-level header so it
   does not bleed onto the semantic <header class="brief-head"> inside briefs */
body>header{position:sticky;top:0;z-index:50;background:rgba(90,111,140,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(199,161,99,.2)}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px}
.brand{display:flex;align-items:center;gap:12px;--mp:#ffffff;--ma:var(--gold)}
.logo-mark{height:28px;width:auto;display:block;flex-shrink:0}
.logo-mark .bar-p{fill:var(--mp)}.logo-mark .bar-a{fill:var(--ma)}
.wordmark{display:flex;flex-direction:column;line-height:1}
.wordmark b{font-family:'Inter';font-weight:600;font-size:16px;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.nav-links{display:flex;align-items:center;gap:34px}
.nav-links a{font-size:14.5px;color:#E7ECF3;font-weight:500;transition:color .2s}
.nav-links a:hover,.nav-links a.active{color:#D9BC85;font-weight:600}
.nav-cta{display:inline-flex;align-items:center;gap:8px;background:var(--gold);color:var(--navy);font-weight:600;font-size:14px;padding:11px 20px;border-radius:8px;transition:transform .22s var(--es),box-shadow .22s}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(199,161,99,.8)}
.burger{display:none;background:none;border:none;color:#fff;font-size:20px;cursor:pointer}
.mnav{position:fixed;left:0;right:0;top:64px;z-index:70;background:#001527;border-bottom:1px solid rgba(199,161,99,.28);box-shadow:0 24px 48px -24px rgba(0,0,0,.5);opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .25s ease,transform .3s ease}
.mnav.open{opacity:1;transform:none;pointer-events:auto}
.mnav nav{display:flex;flex-direction:column;padding:6px 26px 18px}
.mnav a{color:#fff;font-size:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.mnav a:last-child{border-bottom:none}
.mnav a.mcta{color:#D9BC85;font-weight:600}
@media(min-width:1025px){.mnav{display:none}}

/* page hero (mirrors the site's image-behind-text .phero treatment) */
.phero{position:relative;background:var(--navy-deep);color:#fff;overflow:hidden;isolation:isolate}
.phero .wrap{padding:96px 0 90px;position:relative;z-index:1}
.phero-photo{position:absolute;inset:0;z-index:-3;background:url('images/hero-growth.jpg') center 46%/cover no-repeat;filter:brightness(.92) contrast(1.04) saturate(1.04)}
.phero-veil{position:absolute;inset:0;z-index:-2;background:linear-gradient(100deg,rgba(0,21,39,.93) 0%,rgba(0,21,39,.78) 40%,rgba(0,20,38,.52) 72%,rgba(0,20,38,.42) 100%)}
.phero::before{content:"";position:absolute;top:-140px;right:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(199,161,99,.14),transparent 62%);z-index:-1;pointer-events:none}
.crumb{font-family:'IBM Plex Mono';font-size:11.5px;color:#8493ab;letter-spacing:.08em;margin-bottom:22px}
.crumb a:hover{color:var(--gold-2)}
.phero h1{color:#fff;font-size:clamp(34px,5vw,58px);max-width:15em;margin-top:8px;text-shadow:0 2px 18px rgba(0,15,28,.5)}
.phero h1 em{font-style:italic;color:var(--gold-2)}
.phero .lede{font-size:18px;color:#e8edf3;max-width:38em;margin-top:22px;line-height:1.6;text-shadow:0 1px 12px rgba(0,15,28,.55)}

/* footer (mirrors the site) */
footer{background:var(--navy-deep);color:var(--muted-navy);padding:62px 0 34px}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}
.brand.footer{--mp:#ffffff;--ma:var(--gold)}.brand.footer .wordmark b{color:#fff}
.brand.footer .wordmark .desc{display:flex;align-items:center;gap:7px;margin-top:6px;font-family:'IBM Plex Mono';font-size:8px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted-navy)}
.brand.footer .wordmark .desc::before,.brand.footer .wordmark .desc::after{content:"";height:1px;width:16px;background:var(--gold);flex-shrink:0}
.foot-brand p{font-size:14px;max-width:24em;margin-top:16px}
.foot-col h5{font-family:'IBM Plex Mono';font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-2);margin-bottom:16px;font-weight:500}
.foot-col a{display:block;font-size:14px;margin-bottom:10px;color:var(--muted-navy);transition:color .2s}
.foot-col a:hover{color:#fff}
.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:50px;padding-top:24px;border-top:1px solid rgba(199,161,99,.16);font-size:12.5px;font-family:'IBM Plex Mono'}

/* ===================== ARCHIVE ===================== */
.archive{padding:clamp(56px,7vw,88px) 0}
.brief-intro{max-width:52em;margin:0 auto clamp(44px,5vw,60px);text-align:center}
.brief-intro p{font-size:18px;color:var(--steel);line-height:1.65;margin-top:16px}
.brief-list{display:flex;flex-direction:column;gap:20px;max-width:860px;margin:0 auto}
.brief-card{display:block;background:#fff;border:1px solid var(--steel-line);border-left:3px solid var(--gold);border-radius:14px;padding:clamp(26px,3vw,36px);transition:transform .3s var(--es),box-shadow .3s,border-color .3s}
.brief-card:hover{transform:translateY(-4px);box-shadow:0 26px 52px -34px rgba(0,34,65,.5)}
.brief-card .b-meta{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#9A7F3E;display:flex;flex-wrap:wrap;gap:6px 14px}
.brief-card h2{font-size:clamp(24px,2.6vw,32px);margin:14px 0 12px}
.brief-card .b-excerpt{font-size:16px;color:var(--steel);line-height:1.6;max-width:56ch}
.brief-card .b-read{margin-top:20px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);font-weight:600;display:inline-flex;align-items:center;gap:8px;border-bottom:2px solid rgba(199,161,99,.5);padding-bottom:3px;transition:gap .22s}
.brief-card:hover .b-read{gap:14px;color:#9A7F3E}
.archive-empty{text-align:center;color:var(--steel);font-size:16px;max-width:40em;margin:40px auto 0}

/* ===================== INDIVIDUAL BRIEF ===================== */
.brief-article{padding:clamp(48px,6vw,76px) 0 clamp(30px,4vw,48px)}
.brief-article .wrap{max-width:900px}
.brief-head{border-bottom:1px solid var(--steel-line);padding-bottom:clamp(28px,3.5vw,40px);margin-bottom:clamp(34px,4vw,48px)}
.brief-kicker{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:#9A7F3E;display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center}
.brief-kicker .dot{width:4px;height:4px;border-radius:50%;background:var(--gold)}
.brief-title{font-size:clamp(38px,6vw,64px);line-height:1.02;margin:18px 0 0}
.brief-byline{font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.06em;color:var(--steel);margin-top:20px}
.brief-body{font-size:18px;line-height:1.72;color:#28323f}
.brief-body p{margin-bottom:22px}
.brief-body .standfirst{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(19px,2.2vw,22px);line-height:1.5;color:var(--navy);margin-bottom:30px}
.brief-body h2{font-size:clamp(22px,2.5vw,27px);margin:38px 0 14px}
.brief-body blockquote{border-left:2px solid var(--gold);padding:4px 0 4px 24px;margin:8px 0 26px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(19px,2.2vw,23px);line-height:1.45;color:var(--navy)}
.brief-body blockquote cite{display:block;font-family:'IBM Plex Mono',monospace;font-style:normal;font-size:12px;letter-spacing:.04em;color:var(--steel);margin-top:12px;text-transform:none}
.brief-questions{background:var(--tint);border:1px solid var(--steel-line);border-radius:14px;padding:clamp(26px,3vw,34px);margin:34px 0 8px}
.brief-questions .q-label{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#9A7F3E;margin-bottom:18px}
.brief-questions ol{list-style:none;counter-reset:q;display:flex;flex-direction:column;gap:16px}
.brief-questions li{counter-increment:q;display:grid;grid-template-columns:auto 1fr;gap:15px;font-size:16.5px;color:#28323f;line-height:1.55}
.brief-questions li::before{content:counter(q,decimal-leading-zero);font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:16px;color:var(--gold);line-height:1.4}

/* published-document display (the brief shown in its designed form) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);border:0;white-space:normal}
.brief-crumb{margin-bottom:26px}
.brief-doc{margin:0 auto;max-width:820px}
.brief-doc .doc-link{display:block;border-radius:12px;overflow:hidden;border:1px solid var(--steel-line);box-shadow:0 34px 72px -36px rgba(0,34,65,.5);transition:transform .3s var(--es),box-shadow .3s}
.brief-doc .doc-link:hover{transform:translateY(-3px);box-shadow:0 46px 92px -40px rgba(0,34,65,.6)}
.brief-doc img{display:block;width:100%;height:auto}
.brief-docbar{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 24px;margin-top:26px}

/* prev / next + back */
.brief-nav{border-top:1px solid var(--steel-line);margin-top:clamp(40px,5vw,56px);padding-top:28px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.brief-nav a{display:block}
.brief-nav .nx{text-align:right}
.brief-nav .np-label{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--steel);margin-bottom:6px}
.brief-nav .np-title{font-family:'Fraunces',Georgia,serif;font-size:18px;color:var(--navy);transition:color .2s}
.brief-nav a:hover .np-title{color:#9A7F3E}
.brief-nav .np-empty .np-title{color:var(--steel-line)}
.brief-back{text-align:center;margin-top:34px}

/* subtle closing CTA */
.brief-cta{background:var(--tint);border-top:1px solid var(--steel-line)}
.brief-cta .wrap{max-width:720px;padding-top:clamp(44px,5vw,60px);padding-bottom:clamp(44px,5vw,60px);text-align:center}
.brief-cta h3{font-size:clamp(22px,2.6vw,28px);max-width:20em;margin:14px auto 0}
.brief-cta h3 em{font-style:italic;color:var(--gold)}
.brief-cta p{color:var(--steel);font-size:16px;max-width:34em;margin:14px auto 24px}

@media(max-width:1024px){.nav-links{display:none}.burger{display:block}.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.wrap{padding:0 22px}.brief-nav{grid-template-columns:1fr}.brief-nav .nx{text-align:left}.foot-grid{grid-template-columns:1fr}}