/*
Theme Name: Focus Note Child
Template: cocoon-master
Description: Focus Note リデザイン用 Cocoon 子テーマ
Version: 1.0.0
*/

/* ===== 基本 ===== */
:root{
  --fn-paper:#f5f3ee;
  --fn-paper-2:#ece8df;
  --fn-ink:#1a1917;
  --fn-sub:#6b675e;
  --fn-line:#d6d1c6;
  --fn-accent:oklch(0.74 0.16 70);
  --fn-accent-light:oklch(0.82 0.14 75);
  --fn-accent-text:oklch(0.55 0.15 55);
  --fn-mincho:'Zen Old Mincho',serif;
  --fn-gothic:'Zen Kaku Gothic New',sans-serif;
  --fn-mono:'IBM Plex Mono',monospace;
}
body{background:var(--fn-paper)!important;color:var(--fn-ink);font-family:var(--fn-gothic)!important;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:hover{color:var(--fn-accent-text)}
.wrap{width:auto!important;max-width:1440px;padding-left:clamp(20px,4vw,56px);padding-right:clamp(20px,4vw,56px);box-sizing:border-box}
.main,.sidebar{background:transparent!important;border:none!important;box-shadow:none!important}
.main{width:100%!important;padding:0!important}
.content-in{display:block}
.breadcrumb{font-size:12px;color:var(--fn-sub)}

/* ===== ヘッダー ===== */
#header-container,.header-container{background:var(--fn-paper)!important;box-shadow:none!important;border-bottom:1px solid var(--fn-line)}
.header-container-in,#header-container-in{display:flex!important;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px 32px;max-width:1440px;margin:0 auto;padding:20px clamp(20px,4vw,56px);box-sizing:border-box}
#header,.header,#header .header-in,.header-in{background:transparent!important;min-height:0!important;width:auto!important;max-width:none!important;padding:0!important;margin:0!important;display:block}
#navi,.navi,.navi-in,.navi-in .wrap{background:transparent!important;width:auto!important;max-width:none!important;margin:0!important;padding:0!important;height:auto!important}
.tagline{display:none}
.logo-header{padding:0!important;margin:0!important;text-align:left!important;line-height:1}
.logo-header img{display:none!important}
.logo-header a{display:inline-block;text-decoration:none;font-size:0!important;line-height:1}
.logo-header .site-name-text,.logo-header .site-name{font-size:0!important}
.logo-header a ~ a,.logo-header + .logo-header,.fixed-header .logo-header{display:none!important}
.logo-header a::after{content:"Focus Note";font-family:var(--fn-mincho);font-weight:900;font-size:24px;letter-spacing:.02em;color:var(--fn-ink)}
.home .logo-header a::after{color:var(--fn-paper)}
.navi-in>ul{display:flex!important;flex-wrap:wrap;justify-content:flex-end;gap:clamp(16px,2.4vw,36px);height:auto!important}
.navi-in>ul>li{width:auto!important;height:auto!important;line-height:1.6!important}
.navi-in a{padding:0!important;height:auto!important;line-height:1.6!important;font-size:14px;font-weight:500;letter-spacing:.06em;color:var(--fn-ink)!important;background:transparent!important}
.navi-in a:hover{color:var(--fn-accent-text)!important}

/* トップページ：ヘッダーをヒーロー写真の上に重ねる */
.home #header-container{position:absolute;top:0;left:0;right:0;z-index:20;background:transparent!important;border:none}
.home .navi-in a{color:var(--fn-paper)!important}
.home .logo-header,.home #navi{position:relative;top:6px}

/* ===== ヒーロー（functions.phpで出力） ===== */
.fn-hero{position:relative;min-height:min(94vh,920px);display:flex;flex-direction:column;justify-content:flex-end;color:var(--fn-paper);overflow:hidden;background:#141311}
.fn-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fn-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,12,.55) 0%,rgba(15,14,12,0) 28%,rgba(15,14,12,0) 45%,rgba(15,14,12,.85) 100%)}
.fn-hero__inner{position:relative;z-index:1;padding:0 clamp(20px,4vw,56px) clamp(28px,4vw,48px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:32px;align-items:end}
.fn-hero__kicker{margin:0 0 12px;font-family:var(--fn-mono);font-size:12px;letter-spacing:.18em;color:var(--fn-accent-light)}
.fn-hero__title{margin:0;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(40px,6.4vw,92px);line-height:1.15;color:var(--fn-paper);text-wrap:balance}
.fn-hero__card{justify-self:end;max-width:440px;display:block;padding:20px 22px;background:rgba(20,19,17,.62);backdrop-filter:blur(10px);border-top:2px solid var(--fn-accent);color:var(--fn-paper)!important;text-decoration:none}
.fn-hero__card:hover{background:rgba(20,19,17,.8)}
.fn-hero__meta{display:flex;gap:12px;font-size:12px;letter-spacing:.08em;color:#d8d4ca;margin-bottom:6px}
.fn-hero__meta b{color:var(--fn-accent-light)}
.fn-hero__meta time{font-family:var(--fn-mono)}
.fn-hero__post{font-family:var(--fn-mincho);font-weight:700;font-size:21px;line-height:1.5}

/* ===== 3つのテーマ ===== */
.fn-section{max-width:1440px;margin:0 auto;padding:clamp(56px,8vw,112px) clamp(20px,4vw,56px) 0;box-sizing:border-box}
.fn-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.fn-head h2{margin:0;padding:0;border:none;background:none;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(28px,3.4vw,44px)}
.fn-head span{font-family:var(--fn-mono);font-size:12px;letter-spacing:.16em;color:var(--fn-sub)}
.fn-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.fn-cat{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:#2a2824;color:var(--fn-paper)!important;text-decoration:none}
.fn-cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.fn-cat:hover img{transform:scale(1.04)}
.fn-cat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,14,12,0) 40%,rgba(15,14,12,.82) 100%)}
.fn-cat__txt{position:absolute;left:24px;right:24px;bottom:22px;z-index:1}
.fn-cat__txt small{display:block;font-family:var(--fn-mono);font-size:12px;letter-spacing:.16em;color:var(--fn-accent-light)}
.fn-cat__txt strong{display:block;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(26px,2.6vw,34px);line-height:1.3;margin-top:4px}

/* ===== 記事一覧（Cocoonのエントリーカード） ===== */
.home #main::before{content:"新着記事";display:block;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(28px,3.4vw,44px);margin:clamp(56px,8vw,112px) 0 28px}
.list{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:clamp(24px,3vw,40px) 24px}
.list .entry-card-wrap,.list .a-wrap{display:block;margin:0!important;padding:0!important;background:transparent!important;width:auto!important;box-shadow:none!important;border:none!important}
.list .a-wrap:hover{background:transparent!important}
.entry-card{display:flex!important;flex-direction:column;gap:14px}
.entry-card-thumb{width:100%!important;float:none!important;margin:0!important;aspect-ratio:3/2;overflow:hidden;background:#dedad1}
.entry-card-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.a-wrap:hover .entry-card-thumb img{transform:scale(1.04)}
.entry-card-content{margin:0!important;padding:0!important}
.entry-card-title{font-family:var(--fn-mincho)!important;font-weight:700!important;font-size:21px!important;line-height:1.55!important;margin:0 0 8px!important;text-wrap:pretty}
.entry-card-snippet{display:none}
.entry-card-meta,.entry-card .post-date{font-family:var(--fn-mono);font-size:12px;color:var(--fn-sub)}
.cat-label{position:static!important;display:inline-block;background:none!important;border:none!important;padding:0!important;color:var(--fn-accent-text)!important;font-weight:700;font-size:12px;letter-spacing:.06em;font-family:var(--fn-gothic)}
.entry-card-thumb .cat-label{position:absolute!important;left:0;top:0;padding:4px 10px!important;background:var(--fn-ink)!important;color:var(--fn-paper)!important}

/* トップ：4件目以降は画像なしの番号付きリストに */
.home .list{counter-reset:fn-no;row-gap:0!important}
.home .list>.a-wrap:nth-child(-n+3){margin-bottom:clamp(24px,3vw,40px)!important}
.home .list>.a-wrap{counter-increment:fn-no}
.home .list>.a-wrap:nth-child(n+4){grid-column:1/-1;border-bottom:1px solid var(--fn-line)!important;padding:10px 0!important}
.home .list>.a-wrap:nth-child(4){margin-top:clamp(16px,2vw,24px)!important;border-top:1px solid var(--fn-ink)!important}
.home .list>.a-wrap:nth-child(n+4):hover{background:var(--fn-paper-2)!important}
.home .list>.a-wrap:nth-child(n+4) .entry-card{display:grid!important;grid-template-columns:56px minmax(0,1fr);gap:0 16px;align-items:baseline}
.home .list>.a-wrap:nth-child(n+4) .entry-card-thumb,.home .list>.a-wrap:nth-child(n+4) .entry-card-content,.home .list>.a-wrap:nth-child(n+4) .entry-card-meta{margin:0!important;padding:0!important;min-height:0!important;height:auto!important;line-height:1.5}
.home .list>.a-wrap:nth-child(n+4) .entry-card::before{content:counter(fn-no,decimal-leading-zero);grid-row:1/span 2;font-family:var(--fn-mono);font-size:12px;color:#8a857a}
.home .list>.a-wrap:nth-child(n+4) .entry-card-thumb{aspect-ratio:auto;background:none;overflow:visible;position:static}
.home .list>.a-wrap:nth-child(n+4) .entry-card-thumb img{display:none}
.home .list>.a-wrap:nth-child(n+4) .entry-card-thumb .cat-label{position:static!important;padding:0!important;background:none!important;color:var(--fn-accent-text)!important}
.home .list>.a-wrap:nth-child(n+4) .entry-card-content{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 24px}
.home .list>.a-wrap:nth-child(n+4) .entry-card-title{font-size:clamp(16px,1.5vw,18px)!important;line-height:1.5!important;margin:0!important}

/* ページ送り */
.pagination-next-link{display:inline-block;padding:14px 32px;border:1px solid var(--fn-ink);background:transparent!important;color:var(--fn-ink)!important;font-weight:700;letter-spacing:.1em;border-radius:0}
.pagination-next-link:hover{background:var(--fn-ink)!important;color:var(--fn-paper)!important}
.page-numbers{border-radius:0!important;border-color:var(--fn-line)!important;font-family:var(--fn-mono)}
.page-numbers.current{background:var(--fn-ink)!important;color:var(--fn-paper)!important}

/* ===== トップ：サイドバーを下段の黒帯に ===== */
.home .sidebar{width:auto!important;float:none!important;margin:clamp(64px,9vw,128px) calc(-1*clamp(20px,4vw,56px)) 0!important;padding:clamp(56px,7vw,96px) clamp(20px,4vw,56px)!important;background:var(--fn-ink)!important;color:var(--fn-paper);display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:clamp(48px,6vw,96px)}
.home .sidebar .widget{margin:0}
.home .sidebar .widget-sidebar-title,.home .sidebar h2,.home .sidebar h3{background:none!important;border:none!important;padding:0!important;margin:0 0 24px!important;color:var(--fn-paper)!important;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(26px,3vw,40px)}
.home .sidebar a{color:var(--fn-paper)!important}
.home .sidebar a:hover{color:var(--fn-accent-light)!important}
.home .sidebar .a-wrap,.home .sidebar li{background:transparent!important;border:none!important;border-top:1px solid #3a3833!important;padding:14px 0!important;margin:0!important}
.home .sidebar .widget-entry-card-thumb,.home .sidebar .search-box,.home .sidebar .author-box{display:none}
.home .sidebar .widget-entry-card-title,.home .sidebar .new-entry-card-title,.home .sidebar .popular-entry-card-title{font-size:17px;font-weight:500;line-height:1.6}
.home .sidebar .widget_categories,.home .sidebar .widget_archive{display:none!important}
.home .sidebar .post-date{font-family:var(--fn-mono);font-size:11px;color:#9a958a}

/* 記事ページ：サイドバーを非表示 */
.single .sidebar,.page .sidebar{display:none!important}

/* ===== 記事ページ ===== */
.single .article,.page .article{max-width:1100px;margin:0 auto;padding:0!important;background:transparent!important}
.single .entry-title,.page .entry-title{font-family:var(--fn-mincho)!important;font-weight:900!important;font-size:clamp(26px,3.6vw,46px)!important;line-height:1.35!important;max-width:960px;margin:48px auto 16px!important;text-wrap:pretty;word-break:normal;overflow-wrap:anywhere}
html,body{overflow-x:clip}
.single .eye-catch-wrap{max-width:960px;margin:32px auto 0!important;padding:0!important;display:block}
.single .eye-catch{display:block!important;position:relative;width:100%;margin:0 auto!important;padding:0!important}
.single .eye-catch img{display:block;width:100%!important;height:auto;aspect-ratio:3/2;max-height:640px;margin:0 auto;object-fit:cover;object-position:center}
.single .eye-catch .cat-label{position:absolute!important;left:clamp(20px,4vw,56px);bottom:20px;top:auto;padding:4px 12px!important;background:var(--fn-ink)!important;color:var(--fn-paper)!important}
.date-tags{font-family:var(--fn-mono);font-size:12px;color:var(--fn-sub);justify-content:flex-start}

.entry-content{max-width:780px;margin:56px auto 0!important;font-size:16.5px;line-height:1.95}
.entry-content p{margin:0 0 .8em}
.entry-content h2,.article h2{background:none!important;border:none!important;border-radius:0!important;padding:0!important;margin:72px 0 24px!important;color:var(--fn-ink)!important;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(26px,3vw,34px);line-height:1.4}
.entry-content h2{display:flex;align-items:center;gap:16px}
.entry-content h2::before{content:"";flex:none;width:28px;height:2px;background:var(--fn-accent)}
.entry-content h3,.article h3{background:none!important;border:none!important;border-left:3px solid var(--fn-accent)!important;border-radius:0!important;padding:0 0 0 14px!important;margin:48px 0 16px!important;font-family:var(--fn-mincho);font-weight:700;font-size:22px;line-height:1.4}

/* 写真は本文より広く */
/* 写真は本文と同じ幅 */
.entry-content .wp-block-image,.entry-content figure.wp-block-image{margin:36px auto!important;max-width:100%}
.entry-content .wp-block-image img{max-width:100%;height:auto;display:block;margin:0 auto}
.entry-content .wp-block-image figure,.entry-content figure.wp-block-image{display:block!important;margin-left:auto!important;margin-right:auto!important}
/* 横写真：揃え方に関係なく同じ幅 */
.entry-content figure.fn-landscape,.entry-content .wp-block-image.fn-landscape,.entry-content .wp-block-image .fn-landscape{width:min(960px,100vw - 40px)!important;max-width:none!important;margin-left:calc(50% - min(480px,50vw - 20px))!important;margin-right:0!important;transform:none!important}
.entry-content .fn-landscape img{width:100%!important}
/* 縦写真：中央に、高さを制限 */
.entry-content .fn-portrait{width:fit-content!important;max-width:100%!important}
.entry-content .fn-portrait img{width:auto!important;max-height:820px}
.entry-content figcaption{display:block!important;caption-side:initial}
body .article .entry-content figcaption,body .article .entry-content .wp-element-caption,body .article .entry-content .blocks-gallery-caption,body .article .entry-content figure figcaption.wp-element-caption{text-align:center!important;margin-left:auto!important;margin-right:auto!important;width:100%}
.entry-content .fn-portrait figcaption{width:0;min-width:100%;box-sizing:border-box}
.entry-content figcaption{margin:10px 0 0!important;text-align:left!important;font-size:13px;line-height:1.7;color:var(--fn-sub)}

/* 目次 */
.toc{display:block!important;width:auto!important;border:none!important;border-top:1px solid var(--fn-ink)!important;border-bottom:1px solid var(--fn-line)!important;background:transparent!important;padding:20px 0!important;margin:0 0 56px!important;font-size:15px}
.toc-title{text-align:left!important;font-size:0!important;line-height:0;margin-bottom:12px}
.toc-title::before{content:"CONTENTS\3000目次";display:block;font-family:var(--fn-mono);font-size:12px;line-height:1.6;letter-spacing:.16em;color:var(--fn-sub)}
.toc-title::after{display:none!important}
.toc-content ol,.toc-content ul{padding-left:1.4em}
.toc a{color:var(--fn-ink)}

/* Spot Data：ブロックの「追加CSSクラス」に spot-data を指定 */
.spot-data{background:var(--fn-paper-2);padding:22px 24px!important;margin:28px 0 56px!important;border:none!important;border-radius:0!important;font-size:14px;line-height:1.8}
.spot-data::before{content:"SPOT DATA";display:block;font-family:var(--fn-mono);font-size:11px;letter-spacing:.18em;color:var(--fn-accent-text);margin-bottom:6px}
.spot-data strong:first-child,.spot-data p:first-child{font-family:var(--fn-mincho);font-size:19px}

/* タグ・著者・関連記事 */
.tag-link,.entry-categories a{border-radius:0!important;background:transparent!important;border:1px solid #c9c3b6!important;color:var(--fn-ink)!important;font-size:13px;padding:6px 14px!important}
.author-box{max-width:720px;margin:48px auto!important;border:none!important;border-top:1px solid var(--fn-ink)!important;border-bottom:1px solid var(--fn-line)!important;border-radius:0!important;background:transparent!important;padding:28px 0!important}
.author-box .author-name{font-family:var(--fn-mincho);font-weight:900}
.related-entry-heading,.comment-title{background:none!important;border:none!important;padding:0!important;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(26px,3vw,38px)}
.related-list{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));column-gap:48px;border-top:1px solid var(--fn-ink)}
.related-list .a-wrap{margin:0!important;padding:18px 0!important;border-bottom:1px solid var(--fn-line)!important;background:transparent!important;width:auto!important}
.related-entry-card-thumb,.related-entry-card-snippet{display:none!important}
.related-entry-card-content{margin:0!important}
.related-entry-card-title{font-family:var(--fn-mincho);font-weight:700;font-size:18px;line-height:1.5}
.pager-post-navi a{background:var(--fn-ink)!important;color:var(--fn-paper)!important;border:none!important}
.pager-post-navi a:hover{color:var(--fn-accent-light)!important}
.pager-post-navi img{display:none}

/* ===== プロフィール（トップ下部） ===== */
.fn-profile{max-width:1100px;margin:0 auto;padding:clamp(64px,9vw,128px) clamp(20px,4vw,56px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:clamp(32px,5vw,72px);align-items:center;box-sizing:border-box}
.fn-profile__img{justify-self:center;width:min(100%,280px);aspect-ratio:1;border-radius:50%;overflow:hidden;background:#dedad1}
.fn-profile__img img{width:100%;height:100%;object-fit:cover;display:block}
.fn-profile__en{font-family:var(--fn-mono);font-size:12px;letter-spacing:.16em;color:var(--fn-sub)}
.fn-profile__name{margin:6px 0 20px!important;padding:0!important;border:none!important;background:none!important;font-family:var(--fn-mincho);font-weight:900;font-size:clamp(28px,3.4vw,44px);color:var(--fn-ink)}
.fn-profile p{margin:0 0 12px;font-size:16px;line-height:2}
.fn-profile__link{display:inline-block;margin-top:12px;font-size:14px;font-weight:700;letter-spacing:.1em;border-bottom:2px solid var(--fn-accent);padding-bottom:4px;text-decoration:none;color:var(--fn-ink)}

/* ===== フッター ===== */
#footer,.footer{background:var(--fn-paper)!important;border-top:1px solid var(--fn-line);color:var(--fn-ink)!important}
.footer a{color:#4a473f!important}
.copyright{font-size:12px;color:var(--fn-sub)}

/* SNSシェアなどの色を落ち着かせる */
.sns-share-buttons a,.sns-follow-buttons a{border-radius:0!important}