/* ===========================================================
   構造の人 Lab — 共通デザイン土台 (正本: index.html 由来)
   全ページ(トップ / 記事)が <link> で読み込む単一のトークン+
   共通プリミティブ層。色・タイポ・余白の基準をここ1枚に集約し、
   ページ側インライン<style>での再定義(=ドリフト)を禁ずる。

   - ここに置くもの: デザイントークン(:root, ただし --wrap は除く)、
     base reset/body、署名モチーフ .eyebrow、ボタン .btn、
     フォーカス可視、prefers-reduced-motion。
   - ここに置かないもの: --wrap(ページ幅はページ毎に正当に異なる)、
     ヘッダー/フッターのレイアウト、各ページ固有コンポーネント。
   外部フォント/リモート読込/背景URLは一切なし。
   =========================================================== */

:root{
  --paper:#f6f3ec;       /* 紙色オフホワイト(温かい) */
  --paper-2:#fbf9f4;     /* カード/帯のわずかに明るい紙 */
  --ink:#1c1a17;         /* 温度のある黒(純黒は使わない) */
  --ink-soft:#3a352e;
  --muted:#7a7165;       /* 補助テキスト */
  --line:#d9d2c4;        /* ヘアライン罫 */
  --line-soft:#e8e2d6;
  --accent:#c65f08;      /* 事業色1点(朱系) */
  --accent-deep:#9f4a04;
  --serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;
  --sans:"Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","Noto Sans JP","Meiryo",system-ui,sans-serif;
  --en:Didot,"Bodoni 72",Baskerville,"Times New Roman",Georgia,serif;
  --ease:cubic-bezier(.22,1,.36,1);
  --motion-functional:200ms;   /* hover/トグル等の応答 */
  --motion-expressive:760ms;   /* 出現演出 */
  /* --wrap はページ毎に設定する(トップ=広い / 記事=狭い読み幅) */
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{width:min(var(--wrap),calc(100% - 48px));margin-inline:auto;}
a{color:inherit;}
img,svg{max-width:100%;height:auto;}

/* ── 眉(kicker)= 署名モチーフ。全セクション頭で同形に反復 ── */
.eyebrow{
  font-family:var(--en);font-size:12px;letter-spacing:.32em;text-transform:uppercase;
  color:var(--accent);font-weight:600;display:inline-flex;gap:12px;align-items:center;margin:0 0 18px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--accent);flex:0 0 auto;}

/* ── ボタン ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;
  padding:0 24px;text-decoration:none;font-size:14px;letter-spacing:.06em;border-radius:2px;
  transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);}
.btn-line{border:1px solid var(--ink);color:var(--ink);}
.btn-line:hover{background:var(--ink);color:var(--paper);}
.btn-accent{border:1px solid var(--accent);color:var(--accent-deep);}
.btn-accent:hover{background:var(--accent);color:var(--paper-2);border-color:var(--accent);}
.btn .arr{font-family:var(--en);}

/* ── フォーカス可視 + reduced motion ── */
a:focus-visible,button:focus-visible,input:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--accent);outline-offset:3px;border-radius:2px;
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;}
}
