.article{max-width:760px;margin-inline:auto;padding-block:clamp(2rem,4vw,3.2rem)}
  .a-head .meta{font-size:.86rem;color:var(--meta);font-weight:600;margin-bottom:.9rem}
  .a-head h1{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;letter-spacing:-.02em;line-height:1.25}
  .a-head .by{margin-top:1rem;padding-bottom:1.4rem;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--meta)}
  .a-fig{margin:1.8rem 0}
  .a-fig .media{position:relative;border-radius:0;overflow:hidden;aspect-ratio:16/9;background:#ece9e4}
  .a-fig .media img{width:100%;height:100%;object-fit:cover}
  .a-fig figcaption{margin-top:.6rem;font-size:.85rem;color:var(--meta);text-align:center}
  .a-body p{font-size:1.06rem;line-height:1.85;color:#2a2724;margin-top:1.2rem}
  .a-body h2{font-size:1.35rem;font-weight:800;letter-spacing:-.01em;margin-top:2.2rem}
  /* YouTube 자리 */
  .yt{position:relative;aspect-ratio:16/9;border-radius:0;background:var(--charcoal);display:grid;place-items:center;margin:1.8rem 0;overflow:hidden}
  .yt .play{width:66px;height:66px;border-radius:50%;background:var(--pine);display:grid;place-items:center}
  .yt .play svg{width:26px;height:26px;color:#fff;margin-left:3px}
  .yt .lab{position:absolute;left:14px;bottom:12px;color:#cfccc7;font-size:.82rem;font-weight:600}
  /* 첨부 */
  .attach{display:flex;align-items:center;gap:1rem;border:1px solid var(--line);border-radius:0;padding:1rem 1.2rem;margin-top:1.4rem;background:var(--alt)}
  .attach .ic{width:44px;height:44px;flex:none;border-radius:0;background:var(--pine-tint);color:var(--pine);display:grid;place-items:center}
  .attach .ic svg{width:22px;height:22px}
  .attach .t{font-weight:700}
  .attach .t small{display:block;color:var(--meta);font-weight:500;font-size:.82rem;margin-top:.15rem}
  .attach .dl{margin-left:auto;font-weight:700;color:var(--pine);white-space:nowrap;font-size:.9rem}
  .attach.link .ic{background:#eef0f3;color:#4a5a6a}
  /* nav */
  .a-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:2.6rem;padding-top:1.6rem;border-top:1px solid var(--line)}
  .a-nav a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--pine)}
  .a-nav .list{color:var(--ink)}
  @media (max-width:620px){ .a-nav{flex-direction:column;gap:.6rem} }

  .a-nav .pnav{display:flex;align-items:center;gap:1.4rem;flex-wrap:wrap}
  .crumb{padding-block:1.4rem .2rem}