/* VIDOCQ ブログ（記事一覧・記事詳細 共通） */
:root{
  --bg-darkest:#160d05;
  --bg-dark:#1a1008;
  --bg-brown:#2d1f0e;
  --sepia:#f0e6d3;
  --paper:#f7f0e2;
  --ink-on-dark:#ece0c8;
  --ink-on-dark-soft:#b7a682;
  --ink-on-light:#2c2010;
  --ink-on-light-soft:#6b5a3c;
  --gold:#C09A50;
  --gold-light:#d8b96e;
  --gold-deep:#a07f3a;
  --line-dark:rgba(192,154,80,.28);
  --line-light:rgba(44,32,16,.16);
  --font-serif:'Noto Serif JP',serif;
  --font-sans:'Noto Sans JP',sans-serif;
}
*{box-sizing:border-box;}
html{scroll-padding-top:88px;}
body{margin:0;background:var(--bg-dark);color:var(--ink-on-dark);font-family:var(--font-sans);line-height:1.8;-webkit-text-size-adjust:100%;overflow-x:clip;}
a{color:inherit;}
img{max-width:100%;height:auto;}

/* ヘッダー */
.b-header{position:sticky;top:0;z-index:50;background:rgba(22,13,5,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line-dark);}
.b-header-inner{max-width:1100px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.b-brand{text-decoration:none;display:flex;flex-direction:column;line-height:1.25;}
.b-brand-mark{font-family:var(--font-serif);font-weight:700;font-size:22px;letter-spacing:.16em;color:var(--gold-light);}
.b-brand-sub{font-size:11px;color:var(--ink-on-dark-soft);letter-spacing:.12em;}
.b-nav{display:flex;align-items:center;gap:22px;font-size:14px;}
.b-nav a{text-decoration:none;color:var(--ink-on-dark);}
.b-nav a:hover{color:var(--gold-light);}

/* ボタン */
.b-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 28px;border:1px solid var(--gold);border-radius:2px;font-weight:700;font-size:15px;letter-spacing:.06em;text-decoration:none;text-align:center;transition:background .2s,color .2s;}
.b-btn-primary{background:var(--gold);color:var(--bg-darkest);}
.b-btn-primary:hover{background:var(--gold-light);}
.b-btn-outline{background:transparent;color:var(--gold-deep);border-color:var(--gold-deep);}
.b-btn-outline:hover{background:var(--gold-deep);color:#fff;}
.b-btn-sm{min-height:40px;padding:8px 18px;font-size:13px;}
.b-btn:focus-visible,.b-nav a:focus-visible,.b-brand:focus-visible,.b-card a:focus-visible,.b-crumb a:focus-visible,.b-footer a:focus-visible{outline:2px solid var(--gold-light);outline-offset:3px;}

/* 下書き表示 */
.b-draft-banner{background:var(--bg-brown);border-bottom:1px solid var(--line-dark);color:var(--gold-light);text-align:center;font-size:13px;letter-spacing:.06em;padding:8px 16px;}
.b-draft-tag{display:inline-block;font-size:12px;letter-spacing:.08em;color:var(--gold-deep);border:1px solid var(--gold-deep);padding:1px 10px;border-radius:2px;}

/* 一覧 */
.b-hero{padding:72px 24px 56px;text-align:center;background:linear-gradient(180deg,var(--bg-darkest),var(--bg-dark));}
.b-eyebrow{font-size:14px;letter-spacing:.24em;color:var(--gold-light);margin:0 0 12px;}
.b-hero h1{letter-spacing:.2em;}
.b-hero h1{font-family:var(--font-serif);font-weight:700;font-size:34px;margin:0 0 16px;color:#fff;}
.b-hero p{margin:0 auto;max-width:34em;color:var(--ink-on-dark-soft);font-size:15px;}
.b-list{background:var(--sepia);color:var(--ink-on-light);padding:64px 24px 88px;}
.b-list-inner{max-width:760px;margin:0 auto;}
.b-card{background:var(--paper);border:1px solid var(--line-light);border-radius:2px;overflow:hidden;}
.b-card-thumb{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--bg-brown);}
.b-card-thumb img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 75%;}
.b-card-body{padding:28px 36px 32px;}
.b-thumb-cap{margin:14px 0 0;font-size:12px;color:var(--ink-on-light-soft);}
.b-figure{margin:28px 0 0;}
.b-figure img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:50% 78%;border:1px solid var(--line-dark);}
.b-figure figcaption{margin-top:8px;font-size:12px;letter-spacing:.08em;color:var(--ink-on-dark-soft);text-align:right;}
.b-card h2{font-family:var(--font-serif);font-weight:700;font-size:23px;line-height:1.6;margin:14px 0 12px;}
.b-card h2 a{text-decoration:none;}
.b-card h2 a:hover{color:var(--gold-deep);}
.b-card p{margin:0 0 18px;color:var(--ink-on-light-soft);font-size:15px;}
.b-more{font-weight:700;color:var(--gold-deep);text-decoration:none;font-size:14px;letter-spacing:.06em;}
.b-more:hover{text-decoration:underline;}

/* 記事 */
.b-article-head{padding:56px 24px 40px;background:linear-gradient(180deg,var(--bg-darkest),var(--bg-dark));}
.b-article-head-inner{max-width:760px;margin:0 auto;}
.b-crumb{font-size:13px;color:var(--ink-on-dark-soft);margin:0 0 20px;}
.b-crumb a{text-decoration:none;}
.b-crumb a:hover{color:var(--gold-light);}
.b-article-head h1{font-family:var(--font-serif);font-weight:700;font-size:32px;line-height:1.6;margin:12px 0 0;color:#fff;}
.b-article-wrap{background:var(--sepia);padding:56px 24px 72px;}
.b-article{max-width:700px;margin:0 auto;color:var(--ink-on-light);font-size:17px;line-height:2.05;}
.b-article p{margin:0 0 1.6em;}
.b-article .b-lead{font-size:18px;padding-bottom:1.6em;border-bottom:1px solid var(--line-light);}
.b-article h2{font-family:var(--font-serif);font-weight:700;font-size:23px;line-height:1.6;margin:2.4em 0 .9em;padding-left:16px;border-left:3px solid var(--gold);}
.b-article .b-note{background:var(--paper);border:1px solid var(--line-light);padding:20px 24px;font-size:15px;color:var(--ink-on-light-soft);margin:2em 0 0;}
.b-cta{margin-top:3.2em;padding:36px 28px;background:var(--bg-brown);color:var(--ink-on-dark);text-align:center;border-top:2px solid var(--gold);}
.b-cta h2{font-family:var(--font-serif);font-size:21px;line-height:1.7;margin:0 0 14px;padding:0;border:0;color:#fff;}
.b-cta p{font-size:15px;line-height:1.9;color:var(--ink-on-dark-soft);margin:0 0 22px;}
.b-cta-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}
.b-cta .b-btn-outline{color:var(--gold-light);border-color:var(--gold);}
.b-cta .b-btn-outline:hover{background:var(--gold);color:var(--bg-darkest);}
.b-back{max-width:700px;margin:40px auto 0;font-size:14px;}
.b-back a{color:var(--gold-deep);font-weight:700;text-decoration:none;}
.b-back a:hover{text-decoration:underline;}

/* フッター */
.b-footer{background:var(--bg-darkest);border-top:1px solid var(--line-dark);padding:40px 24px 28px;font-size:13px;color:var(--ink-on-dark-soft);}
.b-footer-inner{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;gap:24px 48px;justify-content:space-between;}
.b-footer p{margin:0 0 6px;}
.b-footer a{text-decoration:none;color:var(--ink-on-dark);}
.b-footer a:hover{color:var(--gold-light);}
.b-copy{max-width:1100px;margin:28px auto 0;padding-top:18px;border-top:1px solid var(--line-dark);font-size:12px;}

@media (max-width:640px){
  .b-header-inner{padding:10px 16px;}
  .b-brand-mark{font-size:19px;}
  .b-nav{gap:12px;font-size:13px;}
  .b-nav-home{display:none;}
  .b-hero{padding:48px 20px 40px;}
  .b-hero h1{font-size:27px;}
  .b-eyebrow{font-size:13px;}
  .b-list{padding:40px 16px 64px;}
  .b-card-body{padding:22px 20px 26px;}
  .b-figure{margin-top:22px;}
  .b-figure img{aspect-ratio:3/2;object-position:50% 50%;}
  .b-card h2{font-size:20px;}
  .b-article-head{padding:36px 20px 28px;}
  .b-article-head h1{font-size:24px;}
  .b-article-wrap{padding:40px 20px 56px;}
  .b-article{font-size:16px;line-height:2;}
  .b-article .b-lead{font-size:16.5px;}
  .b-article h2{font-size:20px;}
  .b-cta{padding:28px 20px;}
  .b-cta-actions .b-btn{width:100%;}
  .b-footer{padding:32px 20px 24px;}
}

/* HQ提案: JOURNAL一覧の記事カードの間隔と枠線 */
.b-card{border-color:rgba(122,88,46,.38);}
.b-card + .b-card{margin-top:32px;}
@media (max-width:640px){
  .b-card + .b-card{margin-top:24px;}
}