/* /news */
/* ===== Hero ===== */
  .news-hero { padding: 96px 0 32px; }
  .news-hero .inner { max-width: 720px; }
  .news-hero h1 { letter-spacing: -0.03em; margin-top: 24px; }
  .news-hero h1 .accent { color: var(--primary-strong); font-style: italic; }
  [data-theme="dark"] .news-hero h1 .accent { color: var(--primary); }
  .news-hero .lede { margin-top: 28px; max-width: 52ch; }

  /* ===== Featured story ===== */
  .featured {
    margin-top: 56px;
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 0;
    background: var(--primary-soft);
    border-radius: var(--radius-xl);
    overflow: hidden;
    border: 1px solid transparent;
  }
  [data-theme="dark"] .featured { background: var(--surface-2); border-color: var(--border); }
  .featured .body {
    padding: 56px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .featured .meta {
    font-family: var(--font-mono);
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--primary-strong);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }
  [data-theme="dark"] .featured .meta { color: var(--primary); }
  .featured .meta .sep { width: 4px; height: 4px; border-radius: 999px; background: currentColor; opacity: 0.6; }
  .featured .meta .date { color: var(--on-primary-soft); opacity: 0.65; font-weight: 500; }
  [data-theme="dark"] .featured .meta .date { color: var(--muted); }
  .featured h2 {
    margin: 24px 0 0;
    font-size: clamp(28px, 3.2vw, 40px);
    line-height: 1.12;
    letter-spacing: -0.025em;
    color: var(--on-primary-soft);
    max-width: 18ch;
  }
  [data-theme="dark"] .featured h2 { color: var(--text); }
  .featured .dek {
    margin: 20px 0 0;
    font-size: 17px;
    line-height: 1.55;
    color: var(--on-primary-soft);
    opacity: 0.8;
    max-width: 46ch;
  }
  [data-theme="dark"] .featured .dek { color: var(--muted); opacity: 1; }
  .featured .read {
    margin-top: 32px;
    font-family: var(--font-sans);
    font-size: 15px;
    font-weight: 600;
    color: var(--primary-strong);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
  }
  [data-theme="dark"] .featured .read { color: var(--primary); }
  .featured .read i { transition: transform 0.18s ease; }
  .featured:hover .read i { transform: translateX(4px); }
  .featured .visual {
    position: relative;
    background:
      radial-gradient(130% 90% at 70% 20%, color-mix(in oklab, var(--primary-soft) 30%, white) 0%, var(--primary-soft) 55%, color-mix(in oklab, var(--primary-soft) 70%, #2a3a26) 100%);
    display: grid;
    place-items: center;
    overflow: hidden;
    min-height: 340px;
  }
  [data-theme="dark"] .featured .visual {
    background: radial-gradient(130% 90% at 70% 20%, color-mix(in oklab, var(--surface) 60%, var(--primary)) 0%, var(--surface) 72%);
  }
  .featured .visual .leaf {
    width: 52%;
    color: var(--primary-strong);
    opacity: 0.18;
  }
  [data-theme="dark"] .featured .visual .leaf { color: var(--primary); opacity: 0.22; }
  .featured .visual .tag {
    position: absolute;
    top: 20px; left: 22px;
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: 0.08em;
    color: var(--on-primary-soft);
    opacity: 0.55;
    text-transform: uppercase;
  }
  [data-theme="dark"] .featured .visual .tag { color: var(--muted); opacity: 0.8; }
  .featured-link { display: contents; }
  @media (max-width: 860px) {
    .featured { grid-template-columns: 1fr; }
    .featured .body { padding: 40px 32px; order: 2; }
    .featured .visual { order: 1; min-height: 200px; }
  }

  /* ===== Filter row ===== */
  .news-filters {
    margin-top: 80px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--border);
    padding-bottom: 20px;
  }
  .news-filters .label {
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
    margin-right: 8px;
  }
  .filter-pill {
    font-family: var(--font-mono);
    font-size: 11.5px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--text-soft);
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 7px 14px;
    cursor: pointer;
    transition: all 0.15s ease;
  }
  .filter-pill:hover { border-color: var(--border-strong); color: var(--text); }
  .filter-pill[aria-pressed="true"] {
    background: var(--primary-strong);
    border-color: var(--primary-strong);
    color: var(--primary-fg);
  }
  [data-theme="dark"] .filter-pill[aria-pressed="true"] {
    background: var(--primary);
    border-color: var(--primary);
    color: #10160f;
  }

  /* ===== Article index (rule list) ===== */
  .news-list { display: grid; gap: 0; }
  .news-item {
    display: grid;
    grid-template-columns: 220px 1fr auto;
    gap: 40px;
    align-items: baseline;
    padding: 32px 0;
    border-top: 1px solid var(--border);
    text-decoration: none;
    color: inherit;
    transition: background 0.15s ease;
  }
  .news-item:first-child { border-top: none; }
  .news-item:hover { background: color-mix(in oklab, var(--primary-strong) 4%, transparent); }
  .news-item .aside {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 4px;
  }
  .news-item .cat {
    font-family: var(--font-mono);
    font-size: 11px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--primary-strong);
    width: fit-content;
  }
  [data-theme="dark"] .news-item .cat { color: var(--primary); }
  .news-item .date {
    font-family: var(--font-mono);
    font-size: 12px;
    letter-spacing: 0.04em;
    color: var(--muted);
  }
  .news-item h3 {
    font-size: clamp(20px, 2vw, 25px);
    line-height: 1.22;
    letter-spacing: -0.018em;
    margin: 0;
    max-width: 30ch;
    transition: color 0.15s ease;
  }
  .news-item:hover h3 { color: var(--primary-strong); }
  [data-theme="dark"] .news-item:hover h3 { color: var(--primary); }
  .news-item .dek {
    margin: 10px 0 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--muted);
    max-width: 56ch;
  }
  .news-item .arrow {
    align-self: center;
    color: var(--muted);
    font-size: 16px;
    transition: transform 0.18s ease, color 0.15s ease;
  }
  .news-item:hover .arrow { color: var(--primary-strong); transform: translateX(4px); }
  [data-theme="dark"] .news-item:hover .arrow { color: var(--primary); }
  .news-item.is-hidden { display: none; }
  @media (max-width: 760px) {
    .news-item {
      grid-template-columns: 1fr;
      gap: 12px;
      padding: 28px 0;
    }
    .news-item .aside { flex-direction: row; align-items: center; gap: 14px; }
    .news-item .arrow { display: none; }
  }

  /* ===== Subscribe CTA ===== */
  .news-subscribe {
    margin-top: 72px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 48px;
    padding: 36px 44px;
    border-radius: var(--radius-xl);
    border: 1px solid var(--border);
    position: relative;
    overflow: hidden;
  }
  .news-subscribe .leaf-bg {
    position: absolute;
    top: 50%; right: 36px;
    transform: translateY(-50%) rotate(8deg);
    opacity: 0.05; pointer-events: none;
    color: var(--primary-strong);
  }
  [data-theme="dark"] .news-subscribe .leaf-bg { opacity: 0.07; color: var(--primary); }
  .news-subscribe .leaf-bg svg { width: 180px; height: auto; display: block; }
  .news-subscribe > * { position: relative; }
  .news-subscribe .intro { max-width: 44ch; }
  .news-subscribe .kicker {
    font-family: var(--font-mono);
    font-size: 12px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--primary-strong);
    margin-bottom: 10px;
  }
  [data-theme="dark"] .news-subscribe .kicker { color: var(--primary); }
  .news-subscribe h2 {
    font-size: clamp(22px, 2.4vw, 27px);
    letter-spacing: -0.022em;
    margin: 0;
    line-height: 1.18;
  }
  .news-subscribe p {
    margin: 8px 0 0;
    color: var(--muted);
    font-size: 15px;
    line-height: 1.5;
  }
  .news-subscribe .form {
    display: flex;
    gap: 8px;
    width: 400px;
    max-width: 100%;
  }
  .news-subscribe input {
    flex: 1;
    height: 44px;
    min-width: 0;
    border: 1px solid var(--border-strong);
    background: var(--surface);
    border-radius: var(--radius-md, 10px);
    padding: 0 16px;
    font-family: var(--font-sans);
    font-size: 15px;
    color: var(--text);
    outline: none;
  }
  .news-subscribe input:focus { border-color: var(--primary-strong); }
  [data-theme="dark"] .news-subscribe input:focus { border-color: var(--primary); }
  .news-subscribe .form .btn { height: 44px; white-space: nowrap; }
  @media (max-width: 760px) {
    .news-subscribe {
      grid-template-columns: 1fr;
      gap: 24px;
      padding: 32px;
    }
    .news-subscribe .form { width: 100%; }
    .news-subscribe .leaf-bg { display: none; }
  }
  @media (max-width: 440px) {
    .news-subscribe .form { flex-direction: column; }
  }
