/* Ochinity 一覧と条件で探す 1.0.0 — カテゴリー（誌面）と /find/ の上部。色・書体は home.css（#ochy-mag）のトークンを使う */

/* ---- 共通：テーマのページ見出し・サイドバーを出さない（全幅は home.css の :has(#ochy-mag) が効く） */
.l-mainContent:has(#ochy-mag.ochy-br) .c-pageTitle,
.l-mainContent:has(#ochy-mag.ochy-br) .p-termNavigation,
.l-content:has(#ochy-mag.ochy-br) > #sidebar,
.l-content:has(#ochy-mag.ochy-br) > .l-sidebar{display:none !important}
#ochy-mag .vh,.ochy-find-res .vh{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* =========================================================
 * カテゴリー：見出し
 * ========================================================= */
#ochy-mag .cat-hero{background:var(--paper);border-bottom:1px solid var(--line)}
#ochy-mag .cat-hero .wrap{padding-block:clamp(36px,6vw,80px) 0}
#ochy-mag .ch-grid{display:grid;grid-template-columns:1fr auto;gap:clamp(20px,4vw,56px);align-items:end}
#ochy-mag .ch-up{margin:0 0 14px;font-size:12px;letter-spacing:.12em}
#ochy-mag .ch-up a{color:var(--ink-soft);border-bottom:1px solid var(--line-strong);padding-bottom:2px}
#ochy-mag .ch-up a::before{content:"← ";font-family:var(--serif-en)}
#ochy-mag .ch-up a:hover{color:var(--shu);border-color:var(--shu)}
#ochy-mag .ch-en{display:block;font-size:11px;color:var(--shu);letter-spacing:.3em;margin-bottom:12px}
#ochy-mag .cat-hero h1{font-size:clamp(34px,5.2vw,64px);line-height:1.2;letter-spacing:.06em}
#ochy-mag.l-en .cat-hero h1{font-family:var(--serif-en);font-weight:500;letter-spacing:.01em}
#ochy-mag .ch-desc{max-width:40em;margin:18px 0 0;color:var(--ink-soft)}
#ochy-mag .ch-count{margin:16px 0 0;font-size:12px;letter-spacing:.12em;color:var(--ink-faint)}
#ochy-mag .ch-count b{font-family:var(--serif-en);font-size:30px;font-weight:500;color:var(--kin);letter-spacing:0;margin-right:4px;vertical-align:-3px}
#ochy-mag.l-en .ch-count b{margin-right:6px}
#ochy-mag .ch-ill{margin:0;width:112px;height:112px;background:var(--surface-warm);position:relative}
#ochy-mag .ch-ill::after{content:"";position:absolute;inset:-8px;border:1px solid var(--line-strong);pointer-events:none}
#ochy-mag .ch-ill img{display:block;width:100%;height:100%;object-fit:cover}

/* 子カテゴリーのタブ */
#ochy-mag .ch-tabs{margin-top:clamp(28px,4vw,44px);overflow-x:auto;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent)}
#ochy-mag .ch-tabs::-webkit-scrollbar{display:none}
#ochy-mag .ch-tabs ul{display:flex;gap:0;list-style:none;margin:0;padding:0;min-width:max-content}
#ochy-mag .ch-tabs li{margin:0}
#ochy-mag .ch-tabs a,#ochy-mag .ch-tabs span{display:flex;align-items:baseline;gap:6px;padding:12px 16px 14px;font-size:13px;letter-spacing:.06em;color:var(--ink-soft);border-bottom:2px solid transparent;white-space:nowrap;transition:color .3s,border-color .3s}
#ochy-mag .ch-tabs b{font-family:var(--serif-en);font-weight:500;font-size:14px;color:var(--ink-faint)}
#ochy-mag .ch-tabs a:hover{color:var(--shu)}
#ochy-mag .ch-tabs .is-on{color:var(--ink);border-bottom-color:var(--shu);font-weight:500}
#ochy-mag .ch-tabs .is-on b{color:var(--shu)}
#ochy-mag .ch-tabs .is-zero{color:var(--ink-faint)}
#ochy-mag .ch-tabs .is-zero b{font-family:var(--sans);font-size:10px;letter-spacing:.08em;border:1px dashed var(--line-strong);padding:0 5px;border-radius:2px}

/* =========================================================
 * カテゴリー：一覧
 * ========================================================= */
#ochy-mag section.cat-list{padding-block:clamp(36px,5vw,72px) clamp(56px,8vw,110px);content-visibility:visible}
#ochy-mag .cl-narrow{display:grid;grid-template-columns:minmax(200px,.8fr) 2fr auto;gap:18px clamp(20px,3vw,40px);align-items:start;background:var(--surface);border:1px solid var(--line);border-top:2px solid var(--kin);padding:clamp(18px,2.6vw,28px);margin-bottom:clamp(32px,4.5vw,56px)}
#ochy-mag .cn-head h2{font-size:18px;letter-spacing:.06em}
#ochy-mag .cn-head p{margin:8px 0 0;font-size:12px;line-height:1.7;color:var(--ink-faint)}
#ochy-mag .cl-narrow dl{margin:0;display:grid;gap:12px}
#ochy-mag .cl-narrow dl > div{display:grid;grid-template-columns:7.5em 1fr;gap:10px;align-items:baseline}
#ochy-mag.l-en .cl-narrow dl > div{grid-template-columns:9em 1fr}
#ochy-mag .cl-narrow dt{font-size:11.5px;letter-spacing:.1em;color:var(--ink-soft)}
#ochy-mag .cl-narrow dd{margin:0;display:flex;flex-wrap:wrap;gap:6px}
#ochy-mag .nchip{display:inline-flex;align-items:baseline;gap:6px;font-size:12px;letter-spacing:.04em;padding:4px 11px;border:1px solid var(--line-strong);border-radius:999px;background:var(--card);color:var(--ink);transition:border-color .3s,color .3s,background .3s}
#ochy-mag .nchip b{font-family:var(--serif-en);font-weight:600;font-size:13px;color:var(--kin)}
#ochy-mag a.nchip:hover{border-color:var(--shu);color:var(--shu);background:var(--shu-pale)}
#ochy-mag .nchip.is-zero{color:var(--ink-faint);border-style:dashed;background:transparent}
#ochy-mag .nchip.is-zero b{color:var(--ink-faint)}
#ochy-mag .cl-narrow .cta{align-self:center;white-space:nowrap}
#ochy-mag .cl-order{margin:0 0 16px;font-size:11px;letter-spacing:.14em;color:var(--ink-faint)}
#ochy-mag .cl-order::before{content:"";display:inline-block;width:18px;height:1px;background:var(--kin);vertical-align:middle;margin-right:10px}
#ochy-mag .cat-list .cards{row-gap:clamp(30px,3.6vw,48px)}
#ochy-mag .cl-empty{padding:clamp(28px,5vw,56px);border:1px dashed var(--line-strong);text-align:center;color:var(--ink-soft)}
#ochy-mag .cl-empty p{margin:0 0 14px}
#ochy-mag .cl-empty .more{font-size:12px;letter-spacing:.12em;border-bottom:1px solid var(--ink);padding-bottom:3px}
#ochy-mag .cl-empty .more::after{content:" →";font-family:var(--serif-en)}
#ochy-mag .cl-note{margin:32px 0 0;font-size:11.5px;color:var(--ink-faint)}

/* ページ送り */
#ochy-mag .cl-pages{margin-top:clamp(40px,6vw,72px)}
#ochy-mag .cl-pages ul{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
#ochy-mag .cl-pages li{margin:0}
#ochy-mag .cl-pages .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 10px;font-family:var(--serif-en);font-size:17px;border:1px solid var(--line);background:var(--card);color:var(--ink-soft);transition:border-color .3s,color .3s}
#ochy-mag .cl-pages a.page-numbers:hover{border-color:var(--shu);color:var(--shu)}
#ochy-mag .cl-pages .page-numbers.current{background:var(--ink);border-color:var(--ink);color:var(--paper)}
#ochy-mag .cl-pages .page-numbers.dots{border:0;background:transparent}

@media (max-width:900px){
  #ochy-mag .cl-narrow{grid-template-columns:1fr}
  #ochy-mag .cl-narrow .cta{justify-self:start}
}
@media (max-width:600px){
  #ochy-mag .ch-grid{grid-template-columns:1fr auto;align-items:start}
  #ochy-mag .ch-ill{width:72px;height:72px}
  #ochy-mag .ch-ill::after{inset:-5px}
  #ochy-mag .ch-desc{font-size:13.5px;line-height:1.8}
  #ochy-mag .ch-tabs{margin-inline:calc(var(--gutter) * -1);padding-inline:var(--gutter)}
  #ochy-mag .ch-tabs a,#ochy-mag .ch-tabs span{padding:10px 12px 12px;font-size:12.5px}
  #ochy-mag .cl-narrow dl > div{grid-template-columns:1fr;gap:6px}
  #ochy-mag .cl-narrow .cta{justify-self:stretch;justify-content:center}
}

/* =========================================================
 * 条件で探す（/find/）
 * ========================================================= */
#ochy-mag.is-find #find{padding-block:clamp(36px,6vw,80px) clamp(40px,6vw,72px);content-visibility:visible}
#ochy-mag .pg-head{margin-bottom:clamp(18px,2.6vw,28px)}
#ochy-mag .pg-head .en{display:block;font-size:11px;color:var(--shu);letter-spacing:.3em;margin-bottom:12px}
#ochy-mag .pg-head h1{font-size:clamp(32px,4.6vw,56px);line-height:1.2;letter-spacing:.06em}
#ochy-mag.l-en .pg-head h1{font-family:var(--serif-en);font-weight:500;letter-spacing:.01em}

/* 新しいパネルが動いたら、従来の条件フォームは隠す（JSが動かないときは従来のまま使える） */
body:has(#find.finder-on) #ochy-sr-form{display:none !important}

/* 結果（従来の一覧）は誌面の幅にそろえる */
.ochy-find-res{max-width:1180px;margin-inline:auto;padding:clamp(36px,5vw,64px) clamp(16px,4vw,48px) clamp(56px,8vw,100px);scroll-margin-top:72px}
.ochy-find-res .res-head{margin-bottom:22px}
.ochy-find-res .res-head .en{display:block;font-family:"Cormorant Garamond","Didot","Times New Roman",serif;font-weight:500;font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:#C7361F;margin-bottom:8px}
.ochy-find-res .res-head h2{font-family:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho",serif;font-weight:600;font-size:clamp(22px,2.6vw,30px);line-height:1.35;letter-spacing:.04em;margin:0;padding:0;border:0;background:none;color:#241B16}
.ochy-find-res .res-head h2::before,.ochy-find-res .res-head h2::after{display:none !important;content:none !important}
.post_content:has(#ochy-mag.is-find) > .ochy-find-res{background:#F5EFE3}

/* 選択中の帯（画面の下に貼り付く）と、テーマの「ページの上へ」ボタンが重ならないように */
.ochy-fd-in .p-fixBtnWrap{transform:translateY(-88px);transition:transform .3s}
