/* Editorial pages share the salon's Inter, cream and sampled gold tokens. */
.blog-intro{padding:clamp(3rem,7vw,6rem) 0 2.5rem;max-width:850px}
.blog-intro h1{max-width:19ch;font-size:clamp(2.2rem,4vw,3.65rem)}
.blog-intro .lede{font-weight:400;max-width:58ch}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;padding-bottom:4.5rem}
.blog-card{border:1px solid var(--line);padding:clamp(1.35rem,3vw,2.3rem);display:flex;flex-direction:column;align-items:flex-start}
.blog-card h2{font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.25;margin:.75rem 0}
.blog-card h2 a{text-decoration:none}
.blog-card h2 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.blog-card p{color:var(--muted);max-width:58ch}
.blog-card .tlink{margin-top:auto;padding-top:.8rem;line-height:1.5}
.blog-meta{display:flex;flex-wrap:wrap;gap:.25rem 1rem;align-items:center;font-size:.81rem;color:var(--muted);line-height:1.6}
.blog-category{color:var(--gold-deep);font-weight:650}
.article-layout{display:grid;grid-template-columns:minmax(0,760px) minmax(200px,280px);gap:clamp(2rem,6vw,6rem);align-items:start;padding:2rem 0 5rem}
.article-head{padding:clamp(2.5rem,6vw,5rem) 0 1.2rem;max-width:900px}
.article-head h1{font-size:clamp(2rem,4vw,3.45rem);line-height:1.12;max-width:25ch;margin:.8rem 0 1.2rem}
.article-head .lede{max-width:65ch;font-weight:400}
.article-byline{font-size:.87rem;color:var(--muted);margin:1.5rem 0 .3rem}
.article-prose{min-width:0;max-width:68ch;overflow-wrap:anywhere;font-size:1.065rem;line-height:1.85}
.article-prose section + section{margin-top:2.5rem}
.article-prose h2{font-size:clamp(1.5rem,2.5vw,2rem);line-height:1.25;margin-bottom:1rem;scroll-margin-top:110px}
.article-prose ul{padding-left:1.3rem;margin:1.2rem 0}
.article-prose li{padding-left:.3rem;margin-bottom:.65rem}
.article-aside{position:sticky;top:108px;border-top:2px solid var(--gold);padding-top:1.2rem;font-size:.9rem}
.article-aside h2{font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}
.article-aside ol{padding-left:1.2rem;margin:0}
.article-aside li{padding-left:.2rem;margin-bottom:.35rem}
.article-aside a{display:inline-block;padding:.35rem 0;line-height:1.5;text-decoration:none;color:var(--muted)}
.article-aside a:hover{text-decoration:underline;color:var(--ink)}
.article-services{border-top:1px solid var(--line);padding-top:2rem;margin-top:2.5rem}
.article-services a,.article-sources a{color:var(--gold-deep);text-decoration-thickness:1px;text-underline-offset:.18em;overflow-wrap:anywhere}
.article-call{padding:1.5rem;background:var(--sand);margin-top:2rem}
.article-call p{font-size:1rem;line-height:1.65}
.article-call .btn{white-space:normal;line-height:1.45;letter-spacing:.06em;padding:1rem 1.2rem}
.article-sources{margin-top:2.5rem;padding-top:2rem;border-top:1px solid var(--line);font-size:.9rem;line-height:1.7}
.article-sources h2{font-size:1.2rem}
.blog-return{padding:2rem 0;border-top:1px solid var(--line)}
@media(max-width:760px){
  .blog-grid{grid-template-columns:1fr;gap:1rem;padding-bottom:3rem}
  .article-layout{grid-template-columns:1fr;padding-top:1rem;gap:0}
  .article-aside{position:static;grid-row:1;padding:1.2rem 0 1.5rem;margin-bottom:1.5rem;border-bottom:1px solid var(--line)}
  .article-aside ol{columns:1}
  .article-prose{font-size:1.02rem;line-height:1.8}
  .article-head h1{max-width:none}
  .blog-intro .eyebrow{letter-spacing:.17em;line-height:1.4}
}
