/* Shared styling for individual blog post pages */

.nav { position: sticky; top:0; z-index:50; background: var(--brand-navy); color: var(--brand-white); border-bottom: 1px solid rgba(255,255,255,0.08); }
.nav-inner { display:flex; align-items:center; justify-content:space-between; height:112px; }
.nav-logo { display:flex; align-items:center; gap:14px; text-decoration:none; }
.nav-monogram { height:56px; width:56px; border-radius:50%; }
.nav-logo-wordmark { height:96px; width:auto; display:block; }
.nav-links { display:none; gap:28px; font-family:var(--font-accent); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.nav-links a { color:rgba(255,255,255,.85); text-decoration:none; }
.nav-links a:hover, .nav-links a.current { color: var(--brand-gold); }
@media (min-width:1000px){ .nav-links{display:flex;} }

.post-masthead { background: var(--brand-navy); color: var(--brand-white); padding: 80px 0 60px; border-bottom: 4px solid var(--brand-gold); }
.post-masthead .container { max-width: 820px; }
.post-masthead .crumbs { font-family: var(--font-accent); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); margin-bottom: 28px; }
.post-masthead .crumbs a { color: var(--brand-gold); text-decoration: none; }
.post-masthead .crumbs a:hover { text-decoration: underline; }
.post-masthead .cat { font-family: var(--font-accent); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-gold); margin-bottom: 18px; }
.post-masthead h1 { font-family: var(--font-display); font-size: clamp(36px, 5vw, 64px); line-height: 1.05; letter-spacing: -0.02em; margin: 0 0 22px; text-wrap: balance; color: var(--brand-white); }
.post-masthead .dek { font-family: var(--font-display); font-style: italic; font-size: clamp(18px, 2vw, 22px); color: rgba(255,255,255,.85); line-height: 1.5; margin: 0 0 28px; max-width: 720px; }
.post-masthead .byline { font-family: var(--font-accent); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.post-masthead .byline strong { color: var(--brand-white); font-weight: 600; }

.post-body { background: var(--brand-white); padding: 70px 0 90px; }
.post-body .container { max-width: 720px; }
.post-body h2 { font-family: var(--font-display); font-size: clamp(26px, 3vw, 34px); line-height: 1.15; letter-spacing: -0.01em; margin: 56px 0 18px; color: var(--ink-900); text-wrap: balance; }
.post-body h3 { font-family: var(--font-display); font-size: 22px; line-height: 1.25; margin: 36px 0 14px; color: var(--ink-900); }
.post-body p { font-family: var(--font-body); font-size: 18px; line-height: 1.7; color: var(--ink-900); margin: 0 0 22px; }
.post-body p strong { color: var(--ink-900); font-weight: 600; }
.post-body ul, .post-body ol { font-family: var(--font-body); font-size: 18px; line-height: 1.7; color: var(--ink-900); margin: 0 0 26px; padding-left: 24px; }
.post-body li { margin-bottom: 10px; }
.post-body li::marker { color: var(--brand-gold); }
.post-body .lede { font-family: var(--font-display); font-style: italic; font-size: 22px; line-height: 1.5; color: var(--ink-700); border-left: 2px solid var(--brand-gold); padding-left: 22px; margin: 0 0 36px; }
.post-body hr { border: none; border-top: 1px solid var(--rule); margin: 56px 0; }
.post-body .callout { background: var(--paper-100); border-left: 3px solid var(--brand-gold); padding: 22px 26px; margin: 32px 0; }
.post-body .callout p:last-child { margin-bottom: 0; }
.post-body .signoff { font-family: var(--font-display); font-style: italic; font-size: 22px; color: var(--ink-700); margin-top: 40px; }
.post-body .footnote { font-size: 13px; color: var(--ink-500); margin-top: 32px; padding-top: 22px; border-top: 1px solid var(--rule); line-height: 1.6; }

/* CTA at end of post */
.post-cta { background: var(--paper-100); padding: 50px 0; margin: 70px 0 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); }
.post-cta .container { max-width: 720px; text-align: center; }
.post-cta h3 { font-family: var(--font-display); font-size: 28px; margin: 0 0 12px; letter-spacing: -0.01em; }
.post-cta p { color: var(--ink-700); font-size: 16px; margin: 0 0 24px; }
.post-cta .btn-row { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.post-cta a { display: inline-block; padding: 14px 26px; font-family: var(--font-accent); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; }
.post-cta a.primary { background: var(--brand-navy); color: var(--brand-white); }
.post-cta a.secondary { background: transparent; color: var(--brand-navy); border: 1px solid var(--brand-navy); }
.post-cta a:hover { background: var(--brand-gold); color: var(--brand-navy); border-color: var(--brand-gold); }

/* More-from-the-archive */
.post-more { background: var(--brand-white); padding: 70px 0 100px; }
.post-more .container { max-width: 1100px; }
.post-more h4 { font-family: var(--font-accent); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-500); margin: 0 0 28px; }
.post-more-grid { display: grid; grid-template-columns: 1fr; gap: 32px; }
@media (min-width: 700px) { .post-more-grid { grid-template-columns: 1fr 1fr; } }
.post-more-card { display: block; padding: 24px 0; border-top: 1px solid var(--rule); text-decoration: none; color: inherit; transition: transform 200ms ease; }
.post-more-card:hover { transform: translateX(4px); }
.post-more-card .cat { font-family: var(--font-accent); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--brand-gold); margin-bottom: 8px; display: block; }
.post-more-card h5 { font-family: var(--font-display); font-size: 22px; line-height: 1.25; margin: 0 0 8px; color: var(--ink-900); }
.post-more-card .meta { font-family: var(--font-accent); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-500); }

.footer { background: var(--brand-navy); color: rgba(255,255,255,.7); padding: 60px 0 40px; border-top: 1px solid rgba(255,255,255,.1);}
.footer-top { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:24px; padding-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,.1); margin-bottom: 24px;}
.footer-top img { height: 40px; }
.footer-back { color: var(--brand-gold); text-decoration: none; font-family: var(--font-accent); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }
.footer-social { display:flex; gap:10px; align-items:center; }
.footer-social a { width:36px; height:36px; border:1px solid rgba(255,255,255,0.15); border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:rgba(255,255,255,0.85); text-decoration:none; }