/* Skin Journal (blog). Loaded only on the two blog pages, after styles.css. Logical properties keep it right-to-left safe. */
.blog-list{padding-block:clamp(48px,6vw,96px)}
.blog-list > .wrap > .eyebrow{display:block;margin-bottom:22px;color:var(--bronze-text,#835E36)}
.blog-feature{position:relative;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);background:var(--ivory);border:1px solid var(--rule);overflow:hidden;transition:border-color .35s,transform .45s var(--ease)}
.blog-feature:hover{border-color:rgba(173,125,84,.45);transform:translateY(-3px)}
.bf-img{position:relative;min-height:360px;aspect-ratio:3/2;overflow:hidden;background:#2b2019}
.bf-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.blog-feature:hover .bf-img img{transform:scale(1.035)}
.bf-body{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,3.6vw,60px)}
.bf-meta{display:flex;flex-wrap:wrap;gap:6px 0;margin:0;font:500 10.5px/1.4 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-text,#835E36)}
.bf-meta span + span{position:relative;margin-inline-start:18px;padding-inline-start:18px}
.bf-meta span + span::before{content:"";position:absolute;inset-inline-start:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:var(--taupe)}
.bf-title{font-size:clamp(30px,3vw,46px);line-height:1.12;margin:18px 0 16px}
.bf-title a::after{content:"";position:absolute;inset:0;z-index:1}
.bf-title a:focus-visible{outline:2px solid var(--brown);outline-offset:6px}
.bf-excerpt{max-width:46ch;margin:0;font-size:15.5px;line-height:1.75}
.bf-body .card-link{margin-top:26px}
.blog-more{display:block;margin:clamp(40px,5vw,72px) 0 22px;color:var(--bronze-text,#835E36)}
.blog-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,2.4vw,36px)}
.blog-card{position:relative;display:flex;flex-direction:column;background:var(--ivory);border:1px solid var(--rule);overflow:hidden;transition:border-color .35s,transform .45s var(--ease)}
.blog-card:hover{border-color:rgba(173,125,84,.45);transform:translateY(-3px)}
.bc-img{position:relative;aspect-ratio:3/2;overflow:hidden;background:#2b2019}
.bc-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.blog-card:hover .bc-img img{transform:scale(1.035)}
.bc-body{display:flex;flex-direction:column;flex:1;padding:clamp(22px,2.4vw,36px)}
.bc-title{font-size:clamp(24px,2.1vw,32px);line-height:1.15;margin:14px 0 12px}
.bc-title a::after{content:"";position:absolute;inset:0;z-index:1}
.bc-title a:focus-visible{outline:2px solid var(--brown);outline-offset:6px}
.bc-excerpt{margin:0;font-size:15px;line-height:1.7}
.bc-body .card-link{margin-top:auto;padding-top:22px}
@media (max-width:700px){.blog-grid{grid-template-columns:minmax(0,1fr)}}
.blog-hero .ph-bg{object-position:80% 50%}
.blog-note{margin:clamp(32px,4vw,56px) 0 0;padding:26px 30px;border:1px dashed var(--taupe);text-align:center;color:var(--muted);font:italic 400 clamp(19px,1.8vw,23px)/1.5 var(--serif)}
/* article */
.page-hero.art-hero h1{font-size:clamp(34px,4.2vw,60px);max-width:22ch}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 0;margin:0;font:500 11px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:rgba(248,244,238,.82)}
.art-meta span + span{position:relative;margin-inline-start:20px;padding-inline-start:20px}
.art-meta span + span::before{content:"";position:absolute;inset-inline-start:0;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:rgba(232,203,164,.8)}
.art-body{padding-block:clamp(48px,6vw,96px)}
.art-col{max-width:740px;margin-inline:auto}
.art-col p{margin:0 0 18px;font-size:16.5px;line-height:1.85}
.art-lead{font:400 clamp(24px,2.4vw,31px)/1.4 var(--serif)!important;color:var(--brown);margin-bottom:26px!important}
.art-toc{margin:38px 0 0;padding:26px 30px 14px;background:var(--ivory);border:1px solid var(--rule)}
.art-toc h2{margin:0 0 6px;font:500 10.5px/1.4 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--bronze-text,#835E36)}
.art-toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.art-toc li{counter-increment:t}
.art-toc li:last-child a{border-bottom:0}
.art-toc a{display:flex;align-items:baseline;gap:16px;min-height:48px;padding:12px 0;border-bottom:1px solid var(--rule);font:400 20px/1.3 var(--serif);color:var(--brown);transition:color .25s,padding .3s var(--ease)}
.art-toc a::before{content:"0" counter(t);font:500 11px/1 var(--sans);letter-spacing:.18em;color:var(--bronze-text,#835E36)}
.art-toc a:hover{color:var(--bronze-deep);padding-inline-start:6px}
.art-sec{margin-top:clamp(56px,6vw,92px);scroll-margin-top:110px}
.art-num{display:block;margin-bottom:12px;font:500 11px/1 var(--sans);letter-spacing:.3em;color:var(--bronze-text,#835E36)}
.art-sec h2{margin:0 0 28px;font-size:clamp(30px,3.2vw,44px);line-height:1.12}
.art-fig{position:relative;margin:0 0 32px;aspect-ratio:3/2;overflow:hidden;background:#2b2019}
.art-fig img{width:100%;height:100%;object-fit:cover}
.art-sec h3{margin:34px 0 12px;font-size:clamp(23px,2.1vw,28px);line-height:1.2}
.art-tip{margin:28px 0;padding:22px 26px;background:var(--ivory);border:1px solid var(--rule);border-inline-start:3px solid var(--logo)}
.art-tip p{margin:0;font-size:16px;line-height:1.75}
.art-tip .art-tip-t{margin:0 0 10px;font:500 10.5px/1.4 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--bronze-text,#835E36)}
.art-tip ul{margin:0;padding-inline-start:22px;list-style:disc}
.art-tip li::marker{color:var(--logo)}
.art-tip li{margin:8px 0;font-size:16px;line-height:1.7}
.art-col p.art-take{margin:28px 0 0;padding-inline-start:22px;border-inline-start:2px solid var(--bronze);font:italic 400 clamp(22px,2.1vw,28px)/1.4 var(--serif);color:var(--brown)}
.art-col p.art-note{margin:clamp(56px,6vw,92px) 0 0;padding:24px 28px;background:var(--beige);font-size:14.5px;line-height:1.7;color:var(--text)}
.art-back{margin:28px 0 0!important}
/* right-to-left */
[dir="rtl"] .art-col p{font-size:17px;line-height:1.95}
[dir="rtl"] .art-lead{font-size:clamp(24px,2.3vw,29px)!important;line-height:1.7!important}
[dir="rtl"] .art-toc a{font-size:20px}
[dir="rtl"] .art-toc a::before,[dir="rtl"] .art-num{letter-spacing:0}
[dir="rtl"] .art-take{font-style:normal!important}
[dir="rtl"] .blog-note{font-style:normal}
[dir="rtl"] .bf-meta,[dir="rtl"] .art-meta{font-size:13px}
[dir="rtl"] .bf-title,[dir="rtl"] .art-sec h2{line-height:1.4}
[dir="rtl"] .bf-excerpt{font-size:16.5px;line-height:1.9}
/* phones and tablets */
@media (max-width:900px){
  .blog-feature{grid-template-columns:1fr}
  .bf-img{min-height:0}
}
@media (max-width:640px){
  .art-col p{font-size:16px}
  .art-toc{padding:22px 20px 8px}
  .art-tip{padding:18px 18px}
  .blog-note{padding:20px 18px}
}
@media (prefers-reduced-motion:reduce){
  .blog-feature,.bf-img img,.art-toc a{transition:none}
  .blog-feature:hover{transform:none}
}
@media (max-width:640px){
  .art-meta{flex-direction:column;gap:6px}
  .art-meta span + span{margin-inline-start:0;padding-inline-start:0}
  .art-meta span + span::before{display:none}
}