/* ReadyLift blog — Kinetic Obsidian (matches readyliftai.com). Dark HUD, no visible borders:
   separate blocks with surface tone, not lines. */
:root {
  --surface:#0e0e0e; --surfaceLow:#131313; --container:#1a1a1a; --high:#20201f; --highest:#262626;
  --onSurface:#ffffff; --muted:#adaaaa; --dim:#8a8888;
  --lime:#cafd00; --limeSoft:#f3ffca; --cyan:#00f4fe; --gold:#ffeea5;
  --head:'Space Grotesk',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  --body:'Manrope',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:var(--body); color:var(--onSurface); background:var(--surface); line-height:1.7; -webkit-font-smoothing:antialiased; }
img { max-width:100%; height:auto; display:block; }
a { color:var(--cyan); text-underline-offset:3px; }
.wrap { max-width:760px; margin:0 auto; padding:0 20px; }
.wrap-wide { max-width:1080px; margin:0 auto; padding:0 20px; }

/* Top bar */
.topbar { background:rgba(14,14,14,.92); position:sticky; top:0; z-index:10; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.topbar .wrap-wide { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:14px; padding-bottom:14px; }
.topbar .brand { display:inline-flex; align-items:center; gap:10px; color:var(--lime); text-decoration:none; font-family:var(--head); font-weight:900; font-style:italic; font-size:21px; letter-spacing:-.01em; text-transform:uppercase; }
.topbar .brand img { width:32px; height:32px; border-radius:9px; }
.topbar nav { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; gap:6px 18px; }
.topbar nav a { color:var(--muted); text-decoration:none; font-family:var(--head); font-size:14px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }
.topbar nav a:hover { color:#fff; }
.topbar nav a.get { background:var(--lime); color:#0e0e0e; padding:8px 14px; border-radius:4px; }
@media (max-width:520px) { .topbar nav a.hide-sm { display:none; } }

/* Breadcrumb */
.crumbs { font-size:14px; color:var(--dim); padding:24px 0 0; }
.crumbs a { color:var(--dim); text-decoration:none; }
.crumbs a:hover { color:#fff; text-decoration:underline; }
.crumbs span[aria-hidden] { margin:0 6px; opacity:.6; }

/* Article header */
.post-head { padding:18px 0 8px; }
.eyebrow { font-family:var(--head); font-size:13px; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--lime); margin-bottom:12px; }
.post-head h1 { font-family:var(--head); font-size:clamp(32px,5.4vw,50px); font-weight:800; line-height:1.06; letter-spacing:-.03em; margin-bottom:16px; }
.post-head .dek { font-size:19px; color:var(--muted); margin-bottom:18px; }
.byline { display:flex; flex-wrap:wrap; gap:6px 18px; font-size:14px; color:var(--muted); background:var(--surfaceLow); padding:12px 16px; border-radius:6px; }
.byline b { color:#fff; }

/* Body */
.post { padding:8px 0 24px; }
.post p, .post ul, .post ol { font-size:18px; margin:0 0 18px; color:#e9e7e7; }
.post ul, .post ol { padding-left:24px; }
.post li { margin-bottom:6px; }
.post li::marker { color:var(--lime); }
.post b, .post strong { color:#fff; }
.post h2 { font-family:var(--head); font-size:clamp(25px,3.8vw,32px); font-weight:700; line-height:1.18; letter-spacing:-.02em; margin:48px 0 14px; scroll-margin-top:80px; }
.post h3 { font-family:var(--head); font-size:21px; font-weight:700; line-height:1.3; margin:28px 0 10px; color:var(--limeSoft); }
.post .answer { font-size:19px; color:#fff; }

/* Key takeaways + TOC */
.takeaways { background:var(--container); border-radius:8px; padding:20px 22px; margin:26px 0; box-shadow:inset 3px 0 0 var(--lime); }
.takeaways h2 { font-size:18px; margin:0 0 10px; }
.takeaways ul { margin:0; padding-left:20px; }
.takeaways li { font-size:16.5px; }
.toc { background:var(--surfaceLow); border-radius:8px; padding:18px 22px; margin:0 0 24px; }
.toc summary { font-family:var(--head); font-weight:700; cursor:pointer; font-size:16px; letter-spacing:.02em; }
.toc ol { margin:12px 0 0; padding-left:22px; }
.toc li { font-size:15.5px; margin-bottom:5px; }
.toc a { color:var(--muted); text-decoration:none; }
.toc a:hover { color:var(--cyan); text-decoration:underline; }

/* Tables */
.table-wrap { overflow-x:auto; margin:0 0 22px; border-radius:8px; background:var(--surfaceLow); }
table { width:100%; border-collapse:collapse; font-size:15.5px; }
th, td { text-align:left; padding:11px 14px; vertical-align:top; }
thead th { font-family:var(--head); background:var(--high); color:var(--lime); font-size:13.5px; letter-spacing:.06em; text-transform:uppercase; }
tbody tr:nth-child(even) td { background:var(--container); }
td { color:#e2e0e0; }

/* Notes */
.note { background:var(--container); border-radius:8px; padding:16px 20px; margin:0 0 22px; }
.note.why { box-shadow:inset 3px 0 0 var(--cyan); }
.note.med { background:var(--surfaceLow); color:var(--muted); }
.note p { margin:0; }

/* FAQ */
.faq details { background:var(--surfaceLow); border-radius:8px; padding:14px 18px; margin:0 0 10px; }
.faq summary { font-family:var(--head); font-weight:700; cursor:pointer; font-size:17.5px; }
.faq details p { margin:10px 0 0; font-size:17px; }

/* Sources + author */
.sources ol { font-size:15px; color:var(--muted); }
.sources li { font-size:15px; }
.author-box { display:flex; gap:14px; align-items:flex-start; background:var(--container); border-radius:8px; padding:18px; margin:28px 0 0; }
.author-box img { width:48px; height:48px; border-radius:12px; flex:none; }
.author-box p { margin:0; font-size:15.5px; color:var(--muted); }

/* Related */
.related { padding:12px 20px 48px; }
.related h2 { font-family:var(--head); font-size:24px; margin:0 0 16px; }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.card { display:block; background:var(--container); border-radius:8px; padding:18px; text-decoration:none; color:#fff; transition:background .15s; }
.card:hover { background:var(--high); }
.card .tag { font-family:var(--head); font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--lime); }
.card h3 { font-family:var(--head); font-size:18px; line-height:1.25; margin:8px 0 6px; }
.card p { font-size:15px; color:var(--muted); margin:0; }

/* Bottom CTA */
.cta { background:linear-gradient(135deg,#1b2100 0%,#0e0e0e 55%,#002b2d 100%); padding:56px 0 60px; text-align:center; }
.cta .icon { width:68px; height:68px; border-radius:16px; margin:0 auto 16px; }
.cta h2 { font-family:var(--head); font-size:clamp(26px,4.4vw,38px); font-weight:800; letter-spacing:-.02em; line-height:1.12; margin:0 0 12px; }
.cta p { color:var(--muted); font-size:17.5px; max-width:560px; margin:0 auto 24px; }
.cta-row { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-bottom:16px; }
.btn { display:inline-flex; align-items:center; gap:10px; font-family:var(--head); font-weight:700; font-size:17px; text-decoration:none; padding:14px 22px; border-radius:6px; }
.btn svg { width:22px; height:22px; flex:none; }
.btn.primary { background:var(--lime); color:#0e0e0e; }
.btn.primary:hover { background:var(--limeSoft); }
.btn.secondary { background:var(--highest); color:#fff; }
.btn.secondary:hover { background:#333; }
.btn span small { display:block; font-family:var(--body); font-size:11px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; opacity:.75; line-height:1.1; }
.btn span b { display:block; font-size:18px; line-height:1.15; }
.cta .fine { font-size:14px; color:var(--dim); margin:0 auto; }

/* Blog hub */
.hub-head { padding:40px 0 18px; }
.hub-head h1 { font-family:var(--head); font-size:clamp(34px,6vw,56px); font-weight:900; letter-spacing:-.03em; line-height:1.02; text-transform:uppercase; margin-bottom:14px; }
.hub-head h1 em { color:var(--lime); }
.hub-head p { color:var(--muted); font-size:18.5px; max-width:640px; }
.post-list { list-style:none; padding:10px 0 40px; display:grid; gap:14px; }
.post-list a { display:block; background:var(--container); border-radius:8px; padding:22px 24px; text-decoration:none; color:#fff; transition:background .15s; }
.post-list a:hover { background:var(--high); }
.post-list .tag { font-family:var(--head); font-size:12px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--lime); }
.post-list h2 { font-family:var(--head); font-size:clamp(21px,3vw,26px); line-height:1.2; margin:8px 0 6px; }
.post-list p { color:var(--muted); font-size:16px; margin:0; }
.post-list time { display:block; color:var(--dim); font-size:13.5px; margin-top:10px; }

/* Footer */
footer { background:var(--surfaceLow); color:var(--dim); font-size:14px; text-align:center; padding:28px 20px 36px; }
footer .links { margin-bottom:8px; }
footer .links a { color:var(--muted); text-decoration:none; margin:0 8px; }
footer .links a:hover { color:#fff; }
