/* SAKENJOY — 酒間拾記 hub (/editorial/). Stage 4 LocalWP.
 * Palette follows the 酒間拾記 article styles (Code Snippet #23).
 * max-width/margins carry !important: Astra's page-builder template rules
 * override them on .entry-content children otherwise. */

.sjh-landing{max-width:1120px !important;margin-left:auto !important;margin-right:auto !important;padding:56px 20px 96px;box-sizing:border-box;color:#2B2723;}

/* Hero: text then image in DOM order, so mobile stacks text first. */
.sjh-hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center;margin:0 0 64px;}
.sjh-hero__text{min-width:0;}
.sjh-hero__eyebrow{margin:0 0 18px;font-size:13px;line-height:1.4;letter-spacing:.16em;color:#5C564C;}
.sjh-hero__title{word-break:keep-all;overflow-wrap:anywhere;font-family:"Noto Serif TC",serif;font-weight:500;font-size:40px;line-height:1.4;margin:0 0 20px;padding:0;border:0;color:#2B2723;}
.sjh-landing__intro{color:#5C564C;margin:0;line-height:1.9;}
.sjh-hero__media{margin:0 !important;min-width:0;}
.sjh-hero__media img{display:block;width:100%;height:auto;border-radius:2px;}
.sjh-landing__back{margin:56px 0 0;}
.sjh-landing__back a{color:#003070;text-decoration:none;border-bottom:1px solid rgba(0,48,112,.35);}

.sjh-eyebrow{display:block;margin:0 0 10px;font-size:13px;line-height:1.4;letter-spacing:.12em;color:#5C564C;}
.sjh-meta{display:block;margin:0;font-size:13px;letter-spacing:.04em;color:#5C564C;}
.sjh-meta__sep{margin:0 .4em;color:#B8AE9C;}
.sjh-section-title{font-family:"Noto Serif TC",serif;font-weight:500;font-size:22px;line-height:1.4;margin:0;padding:0;border:0;color:#2B2723;}
.sjh-img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;}

/* 主要選讀 */
.sjh-primary{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:center;padding:0 0 56px;border-bottom:1px solid #DCD3C2;}
.sjh-primary__media{display:block;aspect-ratio:3/2;overflow:hidden;background:#EFE9DD;border-radius:2px;}
.sjh-primary__title{font-family:"Noto Serif TC",serif;font-weight:500;font-size:30px;line-height:1.45;margin:0 0 14px;padding:0;border:0;}
.sjh-primary__title a{color:#2B2723;text-decoration:none;}
.sjh-primary__excerpt{margin:18px 0 0;line-height:1.9;}
.sjh-more{margin:24px 0 0;font-size:15px;}
.sjh-more a{color:#003070;text-decoration:none;border-bottom:1px solid rgba(0,48,112,.35);padding-bottom:2px;}

/* 本週推薦 */
.sjh-picks{padding:48px 0 56px;border-bottom:1px solid #DCD3C2;}
.sjh-picks .sjh-section-title{margin-bottom:24px;}
.sjh-picks__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;}
.sjh-card{margin:0;min-width:0;}
.sjh-card__link{display:flex;flex-direction:column;height:100%;color:#2B2723;text-decoration:none;}
.sjh-card__media{display:block;aspect-ratio:3/2;overflow:hidden;background:#EFE9DD;border-radius:2px;margin:0 0 16px;}
.sjh-card__title{display:block;font-family:"Noto Serif TC",serif;font-weight:500;font-size:19px;line-height:1.55;margin:0 0 10px;}
.sjh-card .sjh-eyebrow{margin-bottom:8px;}

/* 其他文章 */
.sjh-index{padding:48px 0 0;}
.sjh-index__head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px 32px;margin:0 0 8px;}
.sjh-filter{position:relative;}
.sjh-filter__toggle{display:none;}
.sjh-filter__menu{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;}
.sjh-filter__menu li{margin:0;}
.sjh-filter__opt{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border:1px solid #DCD3C2;border-radius:20px;font-size:14px;line-height:1.3;color:#2B2723;text-decoration:none;background:#fff;}
.sjh-filter__count{font-size:12px;color:#5C564C;}
.sjh-filter__opt[aria-current="true"]{background:#003070;border-color:#003070;color:#FAF7F1;}
.sjh-filter__opt[aria-current="true"] .sjh-filter__count{color:#CFD9E8;}
@media (hover:hover){.sjh-filter__opt:hover{border-color:#003070;}}
.sjh-filter__opt:focus-visible,.sjh-filter__toggle:focus-visible{outline:2px solid #003070;outline-offset:2px;}
.sjh-index__status{margin:16px 0 8px;font-size:13px;color:#5C564C;}
.sjh-list{list-style:none;margin:0;padding:0;border-top:1px solid #DCD3C2;columns:2;column-gap:56px;}
.sjh-list__item{margin:0;break-inside:avoid;border-bottom:1px solid #DCD3C2;}
.sjh-list__item[hidden]{display:none;}
.sjh-list__link{display:block;padding:16px 0 18px;color:#2B2723;text-decoration:none;}
.sjh-list__title{display:block;font-family:"Noto Serif TC",serif;font-weight:500;font-size:18px;line-height:1.55;margin:0 0 6px;}
.sjh-list__meta{display:block;font-size:13px;letter-spacing:.03em;color:#5C564C;}

@media (hover:hover){
 .sjh-primary__title a:hover,.sjh-card__link:hover .sjh-card__title,.sjh-list__link:hover .sjh-list__title{color:#003070;text-decoration:underline;text-underline-offset:3px;}
}
.sjh-primary__title a:focus-visible,.sjh-card__link:focus-visible,.sjh-list__link:focus-visible,.sjh-more a:focus-visible{outline:2px solid #003070;outline-offset:3px;}

@media (max-width:1023px){
 .sjh-hero{gap:36px;}
 .sjh-hero__title{font-size:32px;}
 .sjh-primary{gap:32px;}
 .sjh-primary__title{font-size:26px;}
 .sjh-picks__grid{gap:20px;}
 .sjh-card__title{font-size:17px;}
}

@media (max-width:767px){
 .sjh-landing{padding:32px 20px 64px;}
 .sjh-hero{grid-template-columns:minmax(0,1fr);gap:24px;margin-bottom:40px;}
 .sjh-hero__eyebrow{margin-bottom:12px;font-size:12px;}
 .sjh-hero__title{font-size:28px;margin-bottom:14px;}
 /* 主要選讀 mobile order: 眉標 → 標題 → 日期｜分類 → 圖片 → 閱讀全文 (desktop unchanged).
    The body wrapper dissolves into the grid so its children can sit around the image. */
 .sjh-primary{grid-template-columns:minmax(0,1fr);gap:0;padding-bottom:40px;}
 .sjh-primary__body{display:contents;}
 .sjh-primary .sjh-eyebrow{order:1;}
 .sjh-primary__title{order:2;font-size:23px;margin-bottom:10px;}
 .sjh-primary .sjh-meta{order:3;margin-bottom:16px;}
 .sjh-primary__excerpt{order:4;margin:0 0 16px;}
 .sjh-primary__media{order:5;}
 .sjh-primary .sjh-more{order:6;margin-top:16px;}
 .sjh-picks{padding:36px 0 40px;}
 .sjh-picks .sjh-section-title{margin-bottom:18px;}
 .sjh-picks__grid{grid-template-columns:minmax(0,1fr);gap:28px;}
 /* 本週推薦 card mobile order: 推薦位置 → 圖片 → 標題 → 日期. */
 .sjh-card__body{display:contents;}
 .sjh-card .sjh-eyebrow{order:1;margin-bottom:10px;}
 .sjh-card__media{order:2;margin-bottom:12px;}
 .sjh-card__title{order:3;font-size:18px;margin-bottom:6px;}
 .sjh-card .sjh-meta{order:4;}
 .sjh-index{padding-top:36px;}
 .sjh-index__head{display:block;}
 .sjh-index__head .sjh-section-title{margin-bottom:14px;}
 .sjh-list{columns:1;}
 .sjh-list__title{font-size:17px;}

 /* Mobile filter: collapsed menu (JS adds .sjh-js; without JS the pills stay visible). */
 .sjh-js .sjh-filter__toggle{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;padding:0 16px;border:1px solid #DCD3C2;border-radius:3px;background:#fff;color:#2B2723;font:inherit;font-size:15px;text-align:left;cursor:pointer;}
 .sjh-filter__label{font-size:12px;letter-spacing:.08em;color:#5C564C;}
 .sjh-filter__current{flex:1;}
 .sjh-filter__chev{width:8px;height:8px;border-right:1.5px solid #2B2723;border-bottom:1.5px solid #2B2723;transform:translateY(-2px) rotate(45deg);transition:transform .15s ease;}
 .sjh-filter__toggle[aria-expanded="true"] .sjh-filter__chev{transform:translateY(2px) rotate(-135deg);}
 .sjh-js .sjh-filter__menu{display:none;position:absolute;z-index:20;left:0;right:0;top:calc(100% + 4px);flex-direction:column;gap:0;padding:6px 0;background:#fff;border:1px solid #DCD3C2;border-radius:3px;box-shadow:0 8px 24px rgba(43,39,35,.12);}
 .sjh-js .sjh-filter.is-open .sjh-filter__menu{display:flex;}
 .sjh-js .sjh-filter__opt{display:flex;justify-content:space-between;width:100%;min-height:46px;padding:0 16px;border:0;border-radius:0;box-sizing:border-box;}
 .sjh-js .sjh-filter__opt[aria-current="true"]{background:#F3EFE7;color:#003070;font-weight:600;}
 .sjh-js .sjh-filter__opt[aria-current="true"] .sjh-filter__count{color:#5C564C;}
}