/* article-extras.css — shared styles for article enhancements */

/* Reading time meta */
.post-header .meta .read-time::before{content:"·";margin-right:8px;color:rgba(245,245,240,0.25)}

/* Author with avatar */
.post-header .author{display:flex;align-items:center;gap:12px;font-size:14px;color:rgba(245,245,240,0.6);margin-top:24px}
.post-header .author .avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}

/* Code block — wrapper for copy button */
.code-block{position:relative}
.code-block pre{padding-top:44px}
.code-copy-btn{position:absolute;top:12px;right:12px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);color:rgba(245,245,240,0.7);font-family:'Inter Tight',sans-serif;font-size:11px;font-weight:600;padding:6px 12px;border-radius:6px;cursor:pointer;transition:all 0.2s;letter-spacing:0.04em;text-transform:uppercase}
.code-copy-btn:hover{background:rgba(255,255,255,0.1);color:var(--paper)}
.code-copy-btn.copied{background:rgba(224,95,184,0.15);border-color:rgba(224,95,184,0.3);color:var(--pink)}

/* Author signature at end of body */
.post-signature{margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.08);font-size:14px;color:rgba(245,245,240,0.5);line-height:1.5}
.post-signature strong{color:var(--paper);font-weight:600;display:block;margin-bottom:2px;font-size:15px}

/* Share row */
.post-share{margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,0.08);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.post-share .share-label{font-size:11px;color:rgba(245,245,240,0.5);font-weight:600;letter-spacing:0.16em;text-transform:uppercase;margin-right:4px}
.post-body .post-share a, .post-share a, .post-share button{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);color:rgba(245,245,240,0.55);width:36px;height:36px;border-radius:50%;cursor:pointer;text-decoration:none;transition:all 0.2s;display:inline-flex;align-items:center;justify-content:center;padding:0;font-family:inherit}
.post-share a svg, .post-share button svg{transition:transform 0.2s}
.post-body .post-share a:hover, .post-share a:hover, .post-share button:hover{background:rgba(255,255,255,0.08);color:var(--paper);border-color:rgba(224,95,184,0.3)}
.post-share a:hover svg, .post-share button:hover svg{transform:scale(1.1)}
.post-share .copy-link.copied{background:rgba(224,95,184,0.15);color:var(--pink);border-color:rgba(224,95,184,0.3)}
.post-share .copy-link.copied::after{content:"Copied";position:absolute;margin-top:-46px;background:var(--paper);color:var(--near-black);padding:4px 10px;border-radius:4px;font-size:11px;font-weight:600;letter-spacing:0.02em;white-space:nowrap}

/* Related articles */
.post-related{background:rgba(255,255,255,0.02);border-top:1px solid rgba(255,255,255,0.06);padding:64px 6vw}
.post-related .inner{max-width:1080px;margin:0 auto}
.post-related .head{margin-bottom:32px}
.post-related .head .eyebrow{font-size:11px;font-weight:700;letter-spacing:0.24em;text-transform:uppercase;color:var(--pink);margin-bottom:8px}
.post-related .head h2{font-size:clamp(22px,2.4vw,28px);font-weight:600;letter-spacing:-0.015em;color:var(--paper);line-height:1.2}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.related-card{background:rgba(255,255,255,0.04);border-radius:12px;overflow:hidden;transition:transform 0.2s,background 0.2s}
.related-card:hover{transform:translateY(-3px);background:rgba(255,255,255,0.07)}
.related-card .thumb{aspect-ratio:16/9;overflow:hidden;background:rgba(255,255,255,0.03)}
.related-card .thumb img{width:100%;height:100%;object-fit:cover}
.related-card .info{padding:18px}
.related-card .info h3{font-size:15px;font-weight:600;color:var(--paper);line-height:1.3;letter-spacing:-0.005em;margin-bottom:6px}
.related-card .info .meta{font-size:11px;color:rgba(245,245,240,0.5);text-transform:uppercase;letter-spacing:0.08em}

@media (max-width:960px){
  .related-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .related-grid{grid-template-columns:1fr}
  .post-related{padding:48px 24px}
}

/* ── Newsletter capture (end-of-post) ─────────────────────────────── */
.nl-capture{border-top:1px solid rgba(255,255,255,0.08);margin-top:56px;padding:96px 6vw 104px;text-align:center}
.nl-capture .nlc-inner{max-width:520px;margin:0 auto}
.nl-capture h2{font-size:clamp(21px,2.4vw,26px);font-weight:600;letter-spacing:-0.015em;color:var(--paper,#F5F5F0);margin:0 0 10px;line-height:1.25;text-wrap:balance}
.nl-capture .nlc-line{font-size:14.5px;line-height:1.65;color:rgba(245,245,240,0.55);margin:0 0 32px;text-wrap:pretty}
.nl-capture form{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.nl-capture input[type=email]{flex:1;min-width:200px;max-width:330px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.14);border-radius:100px;padding:13px 22px;font-size:14px;color:var(--paper,#F5F5F0);font-family:inherit;outline:none;transition:border-color 0.2s}
.nl-capture input[type=email]:focus{border-color:rgba(224,95,184,0.5)}
.nl-capture input[type=email]::placeholder{color:rgba(245,245,240,0.5)}
.nl-capture button[type=submit]{background:var(--paper,#F5F5F0);color:var(--near-black,#0D0D0D);border:none;border-radius:100px;padding:13px 30px;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;transition:background 0.2s}
.nl-capture button[type=submit]:hover{background:var(--pink,#E05FB8)}
.nl-capture button[type=submit]:disabled{opacity:0.6;cursor:default}
.nl-capture .nlc-hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}
.nl-capture .nlc-trust{font-size:12.5px;color:rgba(245,245,240,0.5);margin-top:18px}
.nl-capture .nlc-err{display:none;font-size:13px;color:#E58BAF;margin-top:12px}
.nl-capture .nlc-err.show{display:block}
.nl-capture .nlc-ok{display:none;padding:8px 0 16px}
.nl-capture .nlc-ok.show{display:block}
.nl-capture .nlc-ok .nlc-check{font-size:17px;font-weight:600;color:var(--paper,#F5F5F0);margin-bottom:6px}
.nl-capture .nlc-ok p{font-size:14px;color:rgba(245,245,240,0.55);margin:0}
@media (max-width:560px){.nl-capture form{flex-direction:column;align-items:stretch}.nl-capture input[type=email]{max-width:none}}