/* ======== Blog index page ======== */
  .blog-hero{
    padding:64px 0 32px;
    border-bottom:1px solid var(--lineStrong);
  }
  .blog-hero .row{
    display:grid; grid-template-columns:1.3fr 0.7fr; gap:48px;
    align-items:end;
  }
  .blog-hero h1{
    font-size:clamp(48px, 6.4vw, 88px);
    font-weight:800; letter-spacing:-0.035em; line-height:0.98;
    margin:18px 0 0; text-wrap:balance;
  }
  .blog-hero h1 em{ font-style:normal; color:var(--mint) }
  .blog-hero .meta-side{
    display:flex; flex-direction:column; gap:14px;
    font-size:13.5px; color:var(--ink2); line-height:1.6;
  }
  .blog-hero .meta-side p{ margin:0; max-width:32ch }
  .blog-hero .stat-row{
    display:flex; gap:32px; margin-top:8px;
    padding-top:14px; border-top:1px dashed var(--lineStrong);
  }
  .blog-hero .stat-row .s b{
    display:block; font-size:24px; font-weight:800; color:var(--ink);
    letter-spacing:-0.02em; line-height:1;
  }
  .blog-hero .stat-row .s b em{ font-style:normal; color:var(--mint) }
  .blog-hero .stat-row .s span{
    display:block; margin-top:6px;
    font-family:var(--mono); font-size:9.5px; letter-spacing:1.6px;
    text-transform:uppercase; color:var(--ink3);
  }
  @media (max-width:780px){
    .blog-hero .row{ grid-template-columns:1fr; gap:24px }
  }

  /* topic chips */
  .topic-bar{
    margin:32px 0 48px;
    display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  }
  .topic-bar .label{
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.8px;
    text-transform:uppercase; color:var(--ink3);
    margin-right:8px;
  }
  .chip{
    display:inline-flex; align-items:center; gap:6px;
    padding:7px 14px; border-radius:var(--r-pill);
    background:transparent; border:1px solid var(--lineStrong);
    font-size:13px; color:var(--ink2); font-weight:500;
    cursor:pointer; transition:all .15s;
  }
  .chip:hover{ color:var(--ink); border-color:var(--ink) }
  .chip.on{ background:var(--ink); color:#fff; border-color:var(--ink) }
  .chip .ct{
    font-family:var(--mono); font-size:10px; letter-spacing:0.5px;
    color:var(--ink3); padding-left:4px; border-left:1px solid var(--lineStrong);
  }
  .chip.on .ct{ color:rgba(255,255,255,0.55); border-left-color:rgba(255,255,255,0.2) }
  .topic-bar .spacer{ flex:1 }
  .topic-bar .sort{
    font-family:var(--mono); font-size:11px; letter-spacing:1.4px;
    text-transform:uppercase; color:var(--ink2);
    display:inline-flex; align-items:center; gap:6px;
    border:1px solid var(--lineStrong);
    padding:7px 12px; border-radius:var(--r-pill);
    background:transparent; cursor:pointer;
  }
  .topic-bar .sort svg{ width:12px; height:12px }

  /* ===== featured post ===== */
  .feature-post{
    display:grid; grid-template-columns:1.05fr 0.95fr;
    gap:0; margin-bottom:64px;
    background:var(--card);
    border:1px solid var(--line);
    border-radius:var(--r-2xl);
    overflow:hidden;
    transition:transform .25s, box-shadow .25s;
  }
  .feature-post:hover{ transform:translateY(-3px); box-shadow:0 30px 50px -28px rgba(20,24,28,0.22) }
  .feature-post .cover-big{
    position:relative;
    background:linear-gradient(135deg, #0E1220 0%, #06080F 100%);
    min-height:420px;
    overflow:hidden;
    display:flex; align-items:center; justify-content:center;
  }
  .feature-post .cover-big::before{
    content:''; position:absolute; inset:0;
    background:
      radial-gradient(ellipse at 80% 100%, rgba(20,184,138,0.36), transparent 55%),
      radial-gradient(ellipse at 0% 0%, rgba(201,184,255,0.22), transparent 55%);
  }
  .feature-post .cover-big .stars-bg{
    position:absolute; inset:0;
  }
  .feature-post .cover-big .stars-bg span{
    position:absolute; background:#fff; border-radius:50%;
    box-shadow:0 0 6px rgba(255,255,255,0.7);
  }
  .feature-post .cover-big .ring{
    position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:78%; aspect-ratio:1; border-radius:50%;
    border:1px dashed rgba(255,255,255,0.16);
  }
  .feature-post .cover-big .ring.r2{ width:54%; border-color:rgba(20,184,138,0.3) }
  .feature-post .cover-big .planet{
    position:relative; z-index:1;
    width:46%; max-width:240px; aspect-ratio:1; border-radius:50%;
    background:radial-gradient(circle at 35% 30%, #2BD6A3, #0E9A73 60%, #06402F);
    box-shadow:0 30px 60px -10px rgba(20,184,138,0.45), inset -20px -30px 50px rgba(0,0,0,0.35);
  }
  .feature-post .cover-big .planet::before{
    content:''; position:absolute; left:14%; top:32%;
    width:36%; height:8%; border-radius:50%;
    background:rgba(255,255,255,0.18); transform:rotate(-18deg);
  }
  .feature-post .cover-big .planet::after{
    content:''; position:absolute; left:24%; top:60%;
    width:22%; height:5%; border-radius:50%;
    background:rgba(0,0,0,0.18); transform:rotate(-22deg);
  }
  .feature-post .cover-big .stamp-row{
    position:absolute; top:20px; left:24px; right:24px;
    display:flex; justify-content:space-between; align-items:center;
    z-index:2;
  }
  .feature-post .cover-big .stamp{
    background:var(--mint); color:#06201A;
    padding:6px 12px; border-radius:var(--r-pill);
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.6px;
    text-transform:uppercase; font-weight:700;
  }
  .feature-post .cover-big .num{
    font-family:var(--mono); font-size:11.5px; letter-spacing:1.6px;
    color:rgba(255,255,255,0.75); font-weight:500;
  }
  .feature-post .body{
    padding:48px;
    display:flex; flex-direction:column; justify-content:center;
  }
  .feature-post .body .eye{ margin-bottom:18px }
  .feature-post .body h2{
    font-size:clamp(28px, 3.2vw, 40px);
    font-weight:800; letter-spacing:-0.025em; line-height:1.1;
    margin:0 0 16px; text-wrap:balance;
  }
  .feature-post .body h2 em{ font-style:normal; color:var(--mint) }
  .feature-post .body .lede{
    font-size:15px; line-height:1.7; color:var(--ink2);
    margin:0 0 24px; max-width:46ch;
  }
  .feature-post .body .meta{
    display:flex; align-items:center; gap:14px;
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.4px;
    text-transform:uppercase; color:var(--ink3); margin-bottom:24px;
  }
  .feature-post .body .meta .author{
    display:inline-flex; align-items:center; gap:8px;
    color:var(--ink); font-weight:600; letter-spacing:0;
    text-transform:none; font-family:var(--sans); font-size:13px;
  }
  .feature-post .body .meta .author .av{
    width:24px; height:24px; border-radius:50%;
    background:var(--mint); color:#06201A;
    display:flex; align-items:center; justify-content:center;
    font-weight:800; font-size:11px;
  }
  .feature-post .body .meta .vert-rule{ width:1px; height:14px; background:var(--lineStrong) }
  .feature-post .body .more{
    display:inline-flex; align-items:center; gap:8px;
    align-self:flex-start;
    background:var(--ink); color:#fff;
    padding:11px 20px; border-radius:var(--r-pill);
    font-size:13.5px; font-weight:600;
    transition:background .15s, transform .15s;
  }
  .feature-post .body .more:hover{ background:var(--mint); color:#06201A; transform:translateY(-1px) }
  .feature-post .body .more svg{ width:14px; height:14px }
  @media (max-width:900px){
    .feature-post{ grid-template-columns:1fr }
    .feature-post .cover-big{ min-height:280px }
    .feature-post .body{ padding:32px }
  }

  /* ===== posts list (mixed grid) ===== */
  .posts-section{
    padding:8px 0 24px;
  }
  .section-label{
    display:flex; align-items:end; justify-content:space-between;
    margin-bottom:24px; padding-bottom:14px;
    border-bottom:1px solid var(--lineStrong);
  }
  .section-label h3{
    font-size:22px; font-weight:700; letter-spacing:-0.018em;
    margin:0; line-height:1.2;
  }
  .section-label h3 em{ font-style:normal; color:var(--mint) }
  .section-label .count{
    font-family:var(--mono); font-size:11px; letter-spacing:1.6px;
    text-transform:uppercase; color:var(--ink3);
  }

  /* post variants */
  .post .cover.c1{ background:linear-gradient(135deg, #14B88A 0%, #0B5C45 100%) }
  .post .cover.c2{ background:linear-gradient(135deg, #FFD43B 0%, #E8A100 100%) }
  .post .cover.c3{ background:linear-gradient(135deg, #C9B8FF 0%, #6D5BB8 100%) }
  .post .cover.c4{ background:linear-gradient(135deg, #FFB5C5 0%, #C0526E 100%) }
  .post .cover.c5{ background:linear-gradient(135deg, #0E1220 0%, #06080F 100%) }
  .post .cover.c6{ background:linear-gradient(135deg, #2BD6A3 0%, #0E1220 100%) }

  /* horizontal "list" style post entries (after the grid) */
  .post-list{
    display:flex; flex-direction:column;
    margin-top:8px;
    border-top:1px solid var(--line);
  }
  .post-list .item{
    display:grid; grid-template-columns:80px 120px 1fr auto;
    gap:24px; align-items:center;
    padding:22px 0;
    border-bottom:1px solid var(--line);
    transition:background .15s;
  }
  .post-list .item:hover{ background:rgba(20,184,138,0.03) }
  .post-list .item .num{
    font-family:var(--mono); font-size:11px; letter-spacing:1.6px;
    color:var(--ink3); font-weight:500;
  }
  .post-list .item .date{
    font-family:var(--mono); font-size:11px; letter-spacing:1.4px;
    color:var(--ink2);
  }
  .post-list .item .date em{ font-style:normal; color:var(--mint); font-weight:500 }
  .post-list .item .title-block{
    min-width:0;
    display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  }
  .post-list .item .title-block .tag{
    font-family:var(--mono); font-size:9.5px; letter-spacing:1.4px;
    text-transform:uppercase; padding:3px 8px; border-radius:4px;
    background:var(--mintSoft); color:var(--mintInk); font-weight:600;
    flex-shrink:0;
  }
  .post-list .item .title-block .tag.b{ background:var(--banana); color:var(--bananaInk) }
  .post-list .item .title-block .tag.l{ background:#EFE9FF; color:#3D2B7A }
  .post-list .item .title-block .tag.p{ background:#FFE8EE; color:#7A1F38 }
  .post-list .item .title-block .ttl{
    font-size:15.5px; font-weight:600; letter-spacing:-0.012em;
    line-height:1.4; color:var(--ink);
  }
  .post-list .item .read{
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.4px;
    color:var(--ink3); white-space:nowrap;
  }
  .post-list .item:hover .ttl{ color:var(--mint) }
  @media (max-width:780px){
    .post-list .item{ grid-template-columns:90px 1fr; row-gap:8px }
    .post-list .item .num{ display:none }
    .post-list .item .read{ grid-column:2; justify-self:start }
    .post-list .item .title-block{ grid-column:1 / span 2 }
  }

  /* ===== newsletter strip ===== */
  .news-strip{
    margin:64px 0 16px;
    background:var(--panel); color:#fff;
    border-radius:var(--r-2xl);
    padding:48px 56px;
    display:grid; grid-template-columns:1.1fr 0.9fr; gap:40px;
    align-items:center;
    position:relative; overflow:hidden;
  }
  .news-strip::before{
    content:''; position:absolute; inset:0; pointer-events:none;
    background:
      radial-gradient(ellipse at 100% 100%, rgba(20,184,138,0.28), transparent 55%),
      radial-gradient(ellipse at 0% 0%, rgba(201,184,255,0.14), transparent 50%);
  }
  .news-strip > *{ position:relative; z-index:1 }
  .news-strip h3{
    font-size:clamp(28px, 3vw, 40px);
    font-weight:800; letter-spacing:-0.025em; line-height:1.1;
    margin:0 0 12px; text-wrap:balance;
  }
  .news-strip h3 em{ font-style:normal; color:var(--mint) }
  .news-strip p{
    font-size:14.5px; color:rgba(255,255,255,0.6);
    margin:0; line-height:1.6; max-width:38ch;
  }
  .news-form{
    display:flex; gap:0; background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.12);
    border-radius:var(--r-pill);
    padding:6px;
    backdrop-filter:blur(8px);
  }
  .news-form input{
    flex:1; background:transparent; border:none; outline:none;
    color:#fff; font:inherit; font-size:14px;
    padding:10px 18px;
  }
  .news-form input::placeholder{ color:rgba(255,255,255,0.4) }
  .news-form button{
    background:var(--mint); color:#06201A;
    border:none; cursor:pointer;
    padding:11px 22px; border-radius:var(--r-pill);
    font-size:13.5px; font-weight:700;
    display:inline-flex; align-items:center; gap:6px;
    transition:transform .15s;
  }
  .news-form button:hover{ transform:translateY(-1px) }
  .news-form button svg{ width:13px; height:13px }
  .news-strip .meta-row{
    margin-top:18px;
    display:flex; gap:24px; flex-wrap:wrap;
    font-family:var(--mono); font-size:10.5px; letter-spacing:1.6px;
    text-transform:uppercase; color:rgba(255,255,255,0.45);
  }
  .news-strip .meta-row b{ color:#fff; font-weight:500 }
  @media (max-width:900px){
    .news-strip{ grid-template-columns:1fr; padding:36px 28px }
  }

  /* archive footer */
  .archive-bar{
    display:flex; align-items:center; justify-content:space-between;
    padding:28px 0; margin-top:24px;
    border-top:1px dashed var(--lineStrong);
    font-size:13.5px; color:var(--ink2);
  }
  .archive-bar .pages{ display:flex; gap:6px }
  .archive-bar .pages a{
    width:34px; height:34px; border-radius:50%;
    display:inline-flex; align-items:center; justify-content:center;
    font-family:var(--mono); font-size:12px; color:var(--ink2);
    border:1px solid var(--lineStrong);
  }
  .archive-bar .pages a.cur{ background:var(--ink); color:#fff; border-color:var(--ink) }
  .archive-bar .pages a:hover:not(.cur){ color:var(--ink); border-color:var(--ink) }