/* ── MomoEdge Blog (MOM-375) — public /blog, Concept C2 ──
   Shared by blog/index.html and the blog/<slug> lesson pages.
   Colors inherit from css/variables.css. Fonts match the production
   public site: Space Grotesk (display), Inter (body), JetBrains Mono (mono). */

:root{
  --b-display:'Space Grotesk','Inter',sans-serif;
  --b-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --b-mono:'JetBrains Mono',ui-monospace,monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--b-body);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
.frame{max-width:1180px;margin:0 auto;padding:0 24px;}

/* ── header / footer chrome ── */
/* full-bleed bar (edge-to-edge like index.html) while page content stays in .frame */
.bnav{display:flex;align-items:center;gap:18px;padding:18px 40px;border-bottom:1px solid var(--border2);
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}
.bnav-avatar{display:inline-flex;align-items:center;}
.bnav .brand{font-family:var(--b-display);font-weight:700;font-size:18px;letter-spacing:.5px;}
.bnav .brand i{color:var(--core);font-style:normal;}
.bnav .spacer{flex:1;}
.bnav .lk{color:var(--muted);font-size:13px;font-weight:600;letter-spacing:.3px;}
.bnav .lk:hover{color:var(--text);}
.bnav .lk.is-active{color:var(--text);}
.btn{font-family:var(--b-display);font-weight:700;font-size:13px;letter-spacing:.4px;border-radius:10px;
  padding:10px 18px;cursor:pointer;border:1px solid transparent;display:inline-flex;align-items:center;justify-content:center;gap:8px;}
.btn--primary{background:var(--core);color:#021018;box-shadow:0 0 24px rgba(0,229,255,.28);}
.btn--ghost{background:transparent;border-color:var(--border);color:var(--text);}
.btn[disabled],.btn.is-disabled{opacity:.5;pointer-events:none;}

.bfoot{border-top:1px solid var(--border2);margin-top:56px;padding:28px 40px;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:12px;}
.bfoot a{color:var(--muted);}.bfoot a:hover{color:var(--text);}
.bfoot .links{display:flex;gap:18px;flex-wrap:wrap;}

.eyebrow{font-family:var(--b-display);font-weight:700;font-size:11px;letter-spacing:3px;color:var(--core);text-transform:uppercase;}

/* ── category chips ── */
.chip{font-family:var(--b-display);font-weight:700;font-size:10px;letter-spacing:1.5px;text-transform:uppercase;
  padding:4px 9px;border-radius:6px;display:inline-block;}
.chip--lesson{background:rgba(0,255,163,.12);color:var(--green);}
.chip--news{background:rgba(58,184,255,.14);color:var(--blue);}
.chip--recap{background:rgba(167,139,250,.14);color:var(--purple);}
.chip--note{background:rgba(255,179,0,.14);color:var(--amber);}
.date{color:var(--muted);font-size:12px;}

/* ════ INDEX (C2) ════ */
.b-head{display:flex;align-items:flex-end;justify-content:space-between;margin:46px 0 22px;gap:16px;flex-wrap:wrap;}
.b-head h1{font-family:var(--b-display);font-weight:700;font-size:38px;letter-spacing:-.5px;}
.b-head h1 em{font-style:normal;color:var(--core);}

.tabs{display:flex;gap:8px;margin-bottom:24px;flex-wrap:wrap;}
.tab{font-family:var(--b-display);font-weight:700;font-size:12.5px;letter-spacing:.4px;padding:8px 16px;border-radius:20px;
  border:1px solid var(--border);color:var(--muted);cursor:pointer;background:transparent;}
.tab:hover{color:var(--text);}
.tab.is-on{background:var(--core);color:#021018;border-color:var(--core);}

.b-feat{position:relative;display:block;background:radial-gradient(circle at 80% 26%,rgba(0,255,163,.18),transparent 55%),var(--panel);
  border:1px solid var(--border);border-radius:16px;padding:36px;margin-bottom:22px;overflow:hidden;transition:border-color .2s;}
.b-feat:hover{border-color:var(--glow-core);}
.b-feat .orb{position:absolute;top:34px;right:42px;width:128px;height:128px;border-radius:50%;
  background:radial-gradient(circle at 50% 42%,rgba(0,255,163,.9),rgba(0,255,163,.1) 60%,transparent 75%);
  border:1px solid rgba(0,255,163,.4);box-shadow:0 0 50px rgba(0,255,163,.4);}
.b-feat .meta{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.b-feat h2{font-family:var(--b-display);font-weight:700;font-size:30px;max-width:520px;line-height:1.12;}
.b-feat p{color:var(--muted);font-size:15px;line-height:1.6;max-width:600px;margin-top:12px;}
.b-feat .read{font-family:var(--b-display);font-weight:700;font-size:13px;color:var(--green);margin-top:18px;display:inline-block;}

.b-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.b-card{display:flex;flex-direction:column;gap:10px;background:var(--panel);border:1px solid var(--border);border-radius:14px;
  padding:22px;transition:border-color .2s,transform .2s;}
.b-card:hover{border-color:var(--glow-core);transform:translateY(-3px);}
.b-card .meta{display:flex;align-items:center;gap:8px;}
.b-card h3{font-family:var(--b-display);font-weight:700;font-size:18px;line-height:1.25;}
.b-card p{color:var(--muted);font-size:13px;line-height:1.5;flex:1;}
.b-card .ft{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border2);padding-top:12px;}
.b-card .ft .read{font-family:var(--b-display);font-weight:700;font-size:13px;}

/* empty state for not-yet-published categories */
.b-empty{grid-column:1/-1;text-align:center;border:1px dashed var(--border);border-radius:14px;padding:48px 24px;color:var(--muted);}
.b-empty h4{font-family:var(--b-display);font-weight:700;font-size:16px;color:var(--text);margin-bottom:8px;}
.b-empty p{font-size:13px;max-width:420px;margin:0 auto;line-height:1.6;}
[hidden]{display:none !important;}

/* ── newsletter band ── */
.b-news{margin-top:30px;background:linear-gradient(110deg,rgba(0,229,255,.1),transparent);
  border:1px solid var(--border);border-radius:16px;padding:28px 30px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.b-news .t{flex:1;min-width:240px;}
.b-news h4{font-family:var(--b-display);font-weight:700;font-size:20px;}
.b-news p{color:var(--muted);font-size:13.5px;margin-top:6px;}
.b-news form{display:flex;gap:8px;flex:none;}
.b-news input{background:rgba(0,229,255,.04);border:1px solid var(--border);border-radius:10px;padding:12px 14px;
  color:var(--text);font-family:var(--b-mono);font-size:13px;min-width:220px;}
.b-news input::placeholder{color:var(--muted);}
.b-news-msg{font-size:11.5px;color:var(--muted);margin-top:8px;min-height:1em;width:100%;}
.b-news-msg.is-ok{color:var(--green);}
.b-news-msg.is-err{color:var(--red);}

/* ════ LESSON READING PAGE ════ */
.post-wrap{max-width:760px;margin:0 auto;padding:46px 0 0;}
.post-back{font-family:var(--b-display);font-weight:700;font-size:12px;letter-spacing:.5px;color:var(--muted);}
.post-back:hover{color:var(--core);}
.post-head{margin:22px 0 8px;}
.post-head .meta{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.post-head h1{font-family:var(--b-display);font-weight:700;font-size:38px;line-height:1.1;letter-spacing:-.5px;}
.post-head .sub{color:var(--muted);font-size:16px;line-height:1.6;margin-top:14px;}
.post-body{font-size:16px;line-height:1.75;color:#c4d8ec;margin-top:26px;}
.post-body h2{font-family:var(--b-display);font-weight:700;font-size:22px;color:var(--text);margin:34px 0 12px;letter-spacing:-.2px;}
.post-body p{margin:0 0 18px;}
.post-body strong{color:var(--text);}
.post-body ul{margin:0 0 18px 22px;}.post-body li{margin-bottom:8px;}
.post-body .callout{background:var(--panel);border:1px solid var(--border);border-left:3px solid var(--core);
  border-radius:10px;padding:18px 20px;margin:22px 0;color:var(--text);}
.post-cta{margin:34px 0;background:linear-gradient(110deg,rgba(0,229,255,.1),transparent);
  border:1px solid var(--border);border-radius:14px;padding:24px 26px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;}
.post-cta .t{flex:1;min-width:220px;}
.post-cta h4{font-family:var(--b-display);font-weight:700;font-size:18px;}
.post-cta p{color:var(--muted);font-size:13px;margin-top:4px;}
.post-nav{display:flex;justify-content:space-between;gap:14px;border-top:1px solid var(--border2);padding:22px 0;margin-top:30px;}
.post-nav a{font-family:var(--b-display);font-weight:700;font-size:13px;color:var(--muted);}
.post-nav a:hover{color:var(--core);}

@media(max-width:880px){
  .b-grid{grid-template-columns:1fr;}
  .b-feat .orb{display:none;}
  .b-news{flex-direction:column;align-items:flex-start;}
  .b-news form{width:100%;}.b-news input{flex:1;min-width:0;}
  .post-head h1{font-size:30px;}
  .bnav,.bfoot{padding-left:20px;padding-right:20px;}
}

/* ════ CHANGELOG ════ */
.cl-list{max-width:760px;margin:0 auto;}
.cl-loading,.cl-empty{color:var(--muted);text-align:center;padding:40px 0;font-size:14px;}
.cl-entry{border-bottom:1px solid var(--border2);padding:26px 0;}
.cl-entry:last-child{border-bottom:0;}
.cl-entry .meta{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap;}
.cl-ver{font-family:var(--b-mono);font-size:12px;color:var(--muted);}
.cl-entry h2{font-family:var(--b-display);font-weight:700;font-size:21px;letter-spacing:-.2px;}
.cl-body{color:#c4d8ec;font-size:15px;line-height:1.7;margin-top:8px;}
.cl-body strong{color:var(--text);}
.cl-body a{color:var(--core);}
.chip--feature{background:rgba(0,255,163,.12);color:var(--green);}
.chip--ui{background:rgba(58,184,255,.14);color:var(--blue);}
.chip--perf{background:rgba(167,139,250,.14);color:var(--purple);}
.chip--fix{background:rgba(255,179,0,.14);color:var(--amber);}

/* ════ NEWSLETTER GATE (MOM-417) ════ */
.post-lead{color:#c4d8ec;font-size:16px;line-height:1.75;margin:0 0 22px;}
.post-gate{background:var(--panel);border:1px solid var(--border);border-radius:14px;
  padding:30px 26px;text-align:center;margin-top:8px;}
.post-gate-eyebrow{font-family:var(--b-mono);font-size:11px;letter-spacing:2px;color:var(--blue);
  font-weight:700;margin-bottom:10px;}
.post-gate h3{font-family:var(--b-display);font-weight:700;font-size:22px;color:var(--text);margin:0 0 10px;}
.post-gate p{color:var(--muted);font-size:15px;line-height:1.6;max-width:440px;margin:0 auto 18px;}