/*
Theme Name: BAJ Theme v6
Theme URI: https://brandarchitects.jp
Author: Brand Architects Japan
Author URI: https://brandarchitects.jp
Description: Brand Architects Japan Official WordPress Theme — 白ベース・完全モノクロ（紙質感／エディトリアル × 戦略ファーム）
Version: 6.0.0
Requires at least: 6.0
Tested up to: 7.0
Requires PHP: 8.0
License: Proprietary
Text Domain: baj-theme
*/

/* ============================================================================
   BAJ Theme v6 — style.css
   レイヤ順： tokens → base → 共通パーツ → フレーム12種 → セクション個別
             → WordPress コンテンツ → 下層ページ → レスポンシブ

   絶対ルール（design-brief v12）
   1. 純白 #FFFFFF / 純黒 #000000 は使わない
   2. 有彩色は使わない（旧オレンジ #E8510A は全廃）
   3. gap:1px + グリッド背景グレーの罫線パターンは使わない → 子要素に border
   4. セクションの濃淡は背景色で塗らない → rgba(var(--tint),.13/.24) の重ね
   5. 半透明の白は紙色に追従させる → rgba(var(--paper-rgb),...)
   6. エンボスの lighting-color は暖色（R−B = +10〜+13）
   7. 300ウェイトは使わない。コンテンツ最小15px（絶対下限12px）
   ========================================================================== */


/* ============================================================
   L1. TOKENS
   ============================================================ */
:root{
  /* --- 色 --- */
  --paper:#FBF9F2;          /* 紙 */
  --paper-rgb:251,249,242;
  --ink:#14130F;            /* 墨 */
  --ink-rgb:20,19,15;
  --ink-sub:#46443F;        /* 本文 */
  --meta:#78746D;           /* ラベル・メタ */
  --rule:#C3BEB2;           /* hairline 1px：内部の区切り */
  --rule2:#918B81;          /* hairline 1px（強）：枠・境界 */
  --rule3:#57534C;          /* 構造罫線 2px：表の天板・グループの起点 */
  --tint:184,176,161;       /* セクション濃淡（rgba で使う） */
  --card:255,253,246;       /* 紙面・カードの暖色寄りの白 */

  /* --- 書体 --- */
  --serif-en:'Cinzel',serif;
  --serif:'Noto Serif JP',serif;
  --sans:'Inter','Noto Sans JP',sans-serif;

  /* --- レイアウト --- */
  --pad-y:170px;
  --pad-x:44px;
  --w-text:960px;
  --w-wide:1280px;
  --nav-h:58px;
}

/* テーマオプション：罫線の強さ */
body.rules-soft{--rule:#D4D0C7;--rule2:#A8A39A;--rule3:#6F6B64}


/* ============================================================
   L2. BASE
   ============================================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--nav-h) + 12px);
  -webkit-text-size-adjust:100%;
  overflow-x:clip;
}

body{
  background-color:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  font-weight:400;
  line-height:1.9;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* 画像・埋め込みは絶対に親を超えない（横スクロール防止の要） */
img,svg,video,canvas,iframe,embed,object{max-width:100%;height:auto;display:block}
iframe,embed,object{max-width:100%}

a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}

:focus{outline:none}
:focus-visible{outline:2px solid var(--rule3);outline-offset:3px}

::selection{background:rgba(var(--ink-rgb),.88);color:var(--paper)}

.screen-reader-text{
  position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);clip-path:inset(50%);white-space:nowrap;
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:999;
  background:var(--ink);color:var(--paper);padding:12px 20px;font-size:15px;
}
.skip-link:focus{left:8px;top:8px}

/* 長い日本語・URL が横に溢れないための保険
   anywhere ではなく break-word を使う。anywhere は min-content 幅の計算に効くため、
   grid / table のセル幅が狭いと英単語まで途中で折り返してしまう。 */
h1,h2,h3,h4,p,li,td,th,blockquote,figcaption{overflow-wrap:break-word;word-break:normal;line-break:strict}
.entry a,.entry code,.entry pre{overflow-wrap:anywhere}


/* ============================================================
   L2-b. PAPER TEXTURE（body_class で切替）
   SVG feTurbulence + feDiffuseLighting。光源は暖色（青み防止）。
   ============================================================ */
body.tex-off{--paper:#F9F7F3;--paper-rgb:249,247,243;background-image:none}

/* ---- ナチュラル紙系（暖色光源）---- */
body.tex-nat-white{
  --paper:#FCFAF5;--paper-rgb:252,250,245;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.030'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.50' numOctaves='4' seed='11' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23FFF4DC' surfaceScale='1.1'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23f)' opacity='0.20'/%3E%3C/svg%3E");
}
body.tex-nat-fine{ /* ★既定：微エンボス */
  --paper:#FBF9F2;--paper-rgb:251,249,242;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.035'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='4' seed='11' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23FFF8E6' surfaceScale='1.2'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23f)' opacity='0.24'/%3E%3C/svg%3E");
}
body.tex-nat-near{
  --paper:#FDFCF8;--paper-rgb:253,252,248;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.025'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.45' numOctaves='4' seed='11' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23FFF2D2' surfaceScale='1.0'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23f)' opacity='0.16'/%3E%3C/svg%3E");
}
body.tex-nat-mid{
  --paper:#FBF9F2;--paper-rgb:251,249,242;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.030'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='340'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.14' numOctaves='3' seed='11' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23FFF8E6' surfaceScale='1.4'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='340' height='340' filter='url(%23f)' opacity='0.24'/%3E%3C/svg%3E");
}

/* ---- クール系（参考・本番非推奨。光源が無彩色で青みが出る）---- */
body.tex-fine{
  --paper:#F9F7F3;--paper-rgb:249,247,243;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.045'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.55' numOctaves='4' seed='11' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23ffffff' surfaceScale='1.2'%3E%3CfeDistantLight azimuth='235' elevation='58'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23f)' opacity='0.26'/%3E%3C/svg%3E");
}
body.tex-mid{
  --paper:#F9F7F3;--paper-rgb:249,247,243;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.035'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='340' height='340'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.14' numOctaves='3' seed='5' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23ffffff' surfaceScale='1.5'%3E%3CfeDistantLight azimuth='225' elevation='55'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='340' height='340' filter='url(%23f)' opacity='0.26'/%3E%3C/svg%3E");
}
body.tex-coarse{
  --paper:#F9F7F3;--paper-rgb:249,247,243;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.04'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='440' height='440'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.05' numOctaves='2' seed='5' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23ffffff' surfaceScale='1.9'%3E%3CfeDistantLight azimuth='225' elevation='52'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='440' height='440' filter='url(%23f)' opacity='0.22'/%3E%3C/svg%3E");
}
body.tex-press{
  --paper:#F9F7F3;--paper-rgb:249,247,243;
  background-image:
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23g)' opacity='0.03'/%3E%3C/svg%3E"),
   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.28' numOctaves='4' seed='19' stitchTiles='stitch' result='n'/%3E%3CfeDiffuseLighting in='n' lighting-color='%23ffffff' surfaceScale='1.5'%3E%3CfeDistantLight azimuth='230' elevation='56'/%3E%3C/feDiffuseLighting%3E%3C/filter%3E%3Crect width='320' height='320' filter='url(%23f)' opacity='0.30'/%3E%3C/svg%3E");
}

/* 低速回線・省データ時は質感を落とす */
@media (prefers-reduced-data:reduce){
  body[class*="tex-"]{background-image:none!important}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* ============================================================
   L3. 共通パーツ
   ============================================================ */
.inner{max-width:var(--w-text);margin:0 auto;width:100%}
.inner-wide{max-width:var(--w-wide);margin:0 auto;width:100%}

section{padding:var(--pad-y) var(--pad-x);position:relative}
.tone-a{background-color:rgba(var(--tint),.13)}
.tone-b{background-color:rgba(var(--tint),.24)}
.hair-top{border-top:1px solid var(--rule)}

.label{
  font-family:var(--sans);font-size:15px;font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--meta);
}
h1,h2,h3,h4,h5,h6{font-family:var(--serif);font-weight:600}
h2.sec{font-size:clamp(31px,3.6vw,47px);line-height:1.42;letter-spacing:.04em}
h3{font-size:21px;line-height:1.6;letter-spacing:.03em}
p{letter-spacing:.02em;font-weight:400;color:var(--ink-sub)}
p strong,strong{font-weight:700;color:var(--ink)}
.lead{
  font-family:var(--serif);font-size:21px;line-height:1.9;letter-spacing:.05em;
  color:var(--ink);font-weight:500;
}
.lead.cond{
  max-width:900px;margin:0 0 34px;padding-left:20px;
  border-left:2px solid var(--rule3);
  font-size:22px;font-weight:600;letter-spacing:.04em;line-height:1.75;
}

/* テキストリンク */
.tlink{
  font-size:16px;font-weight:500;letter-spacing:.05em;color:var(--ink);
  border-bottom:1.5px solid var(--ink);padding-bottom:5px;
  display:inline-block;transition:opacity .2s;
}
.tlink:hover{opacity:.55}
.tlink.ghost{border-color:var(--rule2);color:var(--ink-sub)}
.tlink.ghost:hover{border-color:var(--ink);color:var(--ink);opacity:1}

/* ボタン */
.btn{
  display:inline-block;font-family:var(--sans);font-size:18px;font-weight:500;
  letter-spacing:.05em;padding:16px 34px;border:1.5px solid var(--ink);
  color:var(--ink);text-align:center;transition:background .25s,color .25s;
}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.sm{font-size:16px;padding:15px 30px}
.btn.fill{background:var(--ink);color:var(--paper)}
.btn.fill:hover{background:transparent;color:var(--ink)}

/* セクション見出しの並び */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:56px}
.sec-head .label{display:block;margin-bottom:16px}
.sec-head>div{min-width:0}

.fig-cap{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.12em;color:var(--meta)}
.table-note{margin-top:22px;font-size:15px;font-weight:500;letter-spacing:.04em;color:var(--meta)}

/* 表の横スクロール保険（狭い端末で表が潰れないように） */
.tscroll{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.tscroll>table{min-width:0}

/* FRAME ラベル（検証用） */
.fr{
  position:absolute;left:12px;top:12px;font-family:var(--sans);font-size:13px;
  letter-spacing:.14em;color:#B8B2A8;display:none;
}
body.show-frames .fr{display:block}
body.show-frames section{outline:1px dashed rgba(180,172,158,.5);outline-offset:-1px}


/* ============================================================
   L4. NAV（sticky 58px ＋ モバイルドロワー）
   ============================================================ */
.site-nav{
  position:sticky;top:0;z-index:100;height:var(--nav-h);padding:0 var(--pad-x);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:rgba(var(--paper-rgb),.88);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rule2);
}
.nav-mark{
  font-family:var(--serif-en);font-size:15px;font-weight:500;
  letter-spacing:.22em;color:var(--ink);white-space:nowrap;flex:0 0 auto;
}
.nav-mark .nav-logo-img{display:none}
.nav-menu{display:flex;gap:30px;align-items:center;min-width:0}
.nav-menu li{min-width:0}
.nav-menu a{
  font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:.06em;
  color:var(--ink-sub);white-space:nowrap;transition:color .2s;
}
.nav-menu a:hover,.nav-menu .current-menu-item>a{color:var(--ink)}
.nav-cta{
  font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:.06em;
  border:1.5px solid var(--ink);padding:9px 18px;color:var(--ink);
  white-space:nowrap;flex:0 0 auto;transition:background .25s,color .25s;
}
.nav-cta:hover{background:var(--ink);color:var(--paper)}

/* ハンバーガー（960px 以下で表示） */
.nav-toggle{
  display:none;width:40px;height:40px;position:relative;flex:0 0 auto;
  margin-right:-8px;
}
.nav-toggle span{
  position:absolute;left:9px;width:22px;height:1.5px;background:var(--ink);
  transition:transform .3s,opacity .2s;
}
.nav-toggle span:nth-child(1){top:14px}
.nav-toggle span:nth-child(2){top:20px}
.nav-toggle span:nth-child(3){top:26px}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.nav-open .nav-toggle span:nth-child(2){opacity:0}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.nav-overlay{
  position:fixed;inset:0;z-index:110;background:rgba(var(--ink-rgb),.42);
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
}
body.nav-open .nav-overlay{opacity:1;visibility:visible}

.nav-drawer{
  position:fixed;top:0;right:0;z-index:120;width:min(360px,86vw);height:100%;
  background:var(--paper);border-left:1px solid var(--rule2);
  padding:26px 30px 40px;overflow-y:auto;
  transform:translateX(100%);transition:transform .38s cubic-bezier(.45,0,.15,1);
  display:flex;flex-direction:column;
}
body.nav-open .nav-drawer{transform:translateX(0)}
.nav-drawer-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:34px}
.nav-drawer-mark{font-family:var(--serif-en);font-size:14px;font-weight:600;letter-spacing:.2em;line-height:1.6}
.nav-drawer-close{width:36px;height:36px;font-size:19px;line-height:1;color:var(--ink-sub)}
.nav-drawer-menu{border-top:1px solid var(--rule)}
.nav-drawer-menu li{border-bottom:1px solid var(--rule)}
.nav-drawer-menu a{
  display:block;padding:17px 2px;font-family:var(--sans);font-size:16px;font-weight:500;
  letter-spacing:.05em;color:var(--ink);
}
.nav-drawer-cta{
  margin-top:32px;display:block;text-align:center;
  border:1.5px solid var(--ink);padding:15px 20px;
  font-family:var(--sans);font-size:16px;font-weight:500;letter-spacing:.05em;color:var(--ink);
}
body.nav-open{overflow:hidden}


/* ============================================================
   L5. FRAME 01 — CENTERED MONUMENT（Hero / 最終CTA）
   ============================================================ */
.hero{
  min-height:calc(100svh - 18px);
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  text-align:center;padding:88px var(--pad-x) 34px;overflow:hidden;
}
@supports not (height:100svh){
  .hero{min-height:calc(100vh - 18px)}
}
.hero>*{position:relative;z-index:1}

/* トンボ */
.hero .reg{position:absolute;width:17px;height:17px;border:1.5px solid var(--rule2);z-index:1}
.hero .reg.tl{top:30px;left:var(--pad-x);border-right:0;border-bottom:0}
.hero .reg.tr{top:30px;right:var(--pad-x);border-left:0;border-bottom:0}
.hero .reg.bl{bottom:26px;left:var(--pad-x);border-right:0;border-top:0}
.hero .reg.br{bottom:26px;right:var(--pad-x);border-left:0;border-top:0}

.hero-mark{
  font-family:var(--serif-en);font-weight:600;
  font-size:clamp(27px,3.2vw,47px);line-height:1.34;
  letter-spacing:.2em;text-indent:.2em;
}
.hero-tag{
  margin-top:22px;font-family:var(--sans);font-weight:500;
  font-size:clamp(14px,1.565vw,23px);line-height:1.26;letter-spacing:.05em;
  color:var(--ink-sub);
}
.hero-hr{width:72px;height:1.5px;background:var(--rule3);margin:26px 0 24px}
.hero-h1{
  font-family:var(--serif);font-weight:600;
  font-size:clamp(29px,3.6vw,49px);line-height:1.42;letter-spacing:.06em;
}
.hero-sub{
  margin-top:20px;font-size:17px;line-height:1.85;letter-spacing:.03em;
  color:var(--ink-sub);max-width:660px;
}
.hero-ctas{margin-top:40px;display:flex;gap:28px;align-items:center;flex-wrap:wrap;justify-content:center}
.hero-scroll{
  margin-top:60px;font-family:var(--sans);font-size:15px;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;color:var(--meta);
}


/* ============================================================
   FRAME 02 — STATEMENT SHEET（紙面）
   ============================================================ */
.sheet{
  border:1px solid var(--rule2);padding:76px 68px 68px;position:relative;
  background:rgba(var(--card),.34);
}
.sheet::before,.sheet::after{content:'';position:absolute;width:15px;height:15px;border:1.5px solid var(--rule3)}
.sheet::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.sheet::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
.sheet .label{display:block;text-align:center;margin-bottom:26px}
.sheet h2{text-align:center;margin-bottom:36px}
.sheet .lead{text-align:center;max-width:700px;margin:0 auto 60px}
.sheet-cols{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule)}
.sheet-cols>div{padding:40px 34px 8px}
.sheet-cols>div+div{border-left:1px solid var(--rule)}
.sheet-cols>div:first-child{padding-left:0}
.sheet-cols>div:last-child{padding-right:0}
.sheet-cols p+p{margin-top:22px}


/* ============================================================
   FRAME 03 — DRAWING SPLIT（断言／設計図）
   ============================================================ */
.split{display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);gap:0;align-items:center}
.split .vline{background:var(--rule);align-self:stretch}
.split .txt{padding-right:64px;min-width:0}
.split.rev .txt{padding-right:0;padding-left:64px}
.split .fig{padding-left:64px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:20px}
.split.rev .fig{padding-left:0;padding-right:64px}
.split .label{display:block;margin-bottom:20px}
.split h2.sec{margin-bottom:28px}
.split svg{width:100%;max-width:460px;height:auto}

.layers{border-top:2px solid var(--rule3);margin-top:46px}
.layer{
  display:grid;grid-template-columns:44px 190px minmax(0,1fr);gap:20px;
  padding:24px 0;border-bottom:1px solid var(--rule);align-items:baseline;
}
.layer .n{font-family:var(--sans);font-size:15px;font-weight:500;color:var(--meta);letter-spacing:.08em}
.layer .en{font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink)}
.layer .en b{
  display:block;font-family:var(--serif);font-size:17px;font-weight:600;
  letter-spacing:.05em;text-transform:none;margin-top:4px;
}
.layer p{font-size:16px;line-height:1.9}


/* ============================================================
   FRAME 04 — LEDGER TABLE（表組み）
   ============================================================ */
.ledger{width:100%;border-collapse:collapse;border-top:2px solid var(--rule3)}
.ledger th{
  text-align:left;font-family:var(--sans);font-size:15px;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;color:var(--meta);
  padding:16px 24px 16px 0;border-bottom:1px solid var(--rule2);vertical-align:bottom;
}
.ledger td{padding:34px 24px 34px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.ledger tr:hover td{background:rgba(var(--tint),.10)}
.ledger .idx{font-family:var(--sans);font-size:15px;font-weight:500;color:var(--meta);letter-spacing:.08em;width:66px}
.ledger .issue{font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.62;letter-spacing:.03em;width:32%;color:var(--ink)}
.ledger .desc{font-size:16px;line-height:1.85;color:var(--ink-sub);font-weight:400}
.ledger .dom{width:184px}
.ledger .dom span{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.08em;color:var(--ink-sub)}
.ledger .dom span+span{margin-top:6px}

/* Clients & Phase */
.ledger.phase td{padding-top:30px;padding-bottom:30px}
.ledger .seg{width:23%;padding-right:26px}
.ledger .seg .en{display:block;font-family:var(--sans);font-size:15px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--meta)}
.ledger .seg b{
  display:block;font-family:var(--serif);font-size:19px;font-weight:600;
  letter-spacing:.03em;color:var(--ink);margin-top:8px;line-height:1.55;
}
.ledger .phases{width:27%;padding-right:26px}
.ledger .phases span{
  display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.03em;
  color:var(--ink-sub);padding:7px 0 7px 14px;position:relative;line-height:1.5;
}
.ledger .phases span::before{content:'';position:absolute;left:0;top:15px;width:6px;height:1px;background:var(--rule2)}

/* Numbers 台帳 */
.nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid var(--rule3);border-bottom:1px solid var(--rule2)}
.nums .cell{padding:38px 26px 40px;min-width:0}
.nums .cell+.cell{border-left:1px solid var(--rule)}
.nums .cell:first-child{padding-left:0}
.nums .k{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--meta);margin-bottom:18px}
.nums .v{display:block;font-family:var(--sans);font-size:46px;line-height:1;font-weight:500;color:var(--ink)}
.nums .t{display:block;font-family:var(--serif);font-size:17px;font-weight:600;letter-spacing:.04em;margin:18px 0 10px}
.nums .d{display:block;font-size:15px;line-height:1.8;color:var(--ink-sub);font-weight:400}


/* ============================================================
   FRAME 05 — NUMBERED COLUMNS（工程）
   ============================================================ */
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:2px solid var(--rule3)}
.steps .st{padding:38px 22px 42px;position:relative;min-width:0}
.steps .st+.st{border-left:1px solid var(--rule);padding-left:22px}
.steps .st:first-child{padding-left:0}
.steps .no{display:block;font-family:var(--serif-en);font-size:15px;font-weight:700;letter-spacing:.2em;color:var(--meta);margin-bottom:26px}
.steps h3{margin-bottom:8px;min-height:2.6em}
.steps .en{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.11em;color:var(--meta);margin-bottom:20px}
.steps p{font-size:16px;line-height:1.85}
.steps .big{position:absolute;right:18px;bottom:18px;font-family:var(--serif-en);font-weight:700;font-size:52px;line-height:1;color:rgba(var(--ink-rgb),.08);pointer-events:none}


/* ============================================================
   FRAME 06 — FULL-SPAN CASE（Works スライド）
   ============================================================ */
.case-hero{
  border-top:2px solid var(--rule3);border-bottom:1px solid var(--rule2);
  padding:58px 0 60px;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:64px;
}
.case-hero .cat{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:22px}
.case-hero h3{font-size:clamp(24px,2.6vw,34px);line-height:1.52;letter-spacing:.04em;margin-bottom:24px}
.case-hero p{font-size:16px;max-width:640px}
.case-hero .side{border-left:1px solid var(--rule);padding-left:34px;min-width:0}
.case-hero .m{padding:14px 0;border-bottom:1px solid var(--rule)}
.case-hero .m:first-child{border-top:1px solid var(--rule)}
.case-hero .m i{display:block;font-style:normal;font-family:var(--sans);font-size:15px;font-weight:500;color:var(--meta);letter-spacing:.06em}
.case-hero .m b{font-weight:600;font-size:21px;letter-spacing:.01em;color:var(--ink)}
.case-line{
  margin-top:20px;font-family:var(--serif);font-size:18px;font-weight:600;
  letter-spacing:.03em;color:var(--ink);padding-left:16px;border-left:2px solid var(--rule3);
}

.works-meta{display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-top:2px solid var(--rule3);padding:16px 0 22px}
.works-count{font-family:var(--serif-en);font-size:15px;font-weight:500;letter-spacing:.18em;color:var(--meta);white-space:nowrap}
.works-count b{font-weight:700;color:var(--ink)}
.works-seg{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;color:var(--meta);text-align:right}
.works-view{overflow:hidden}
.works-track{display:flex;transition:transform .55s cubic-bezier(.45,0,.15,1)}
.works-slide{min-width:100%;flex:0 0 100%}
.works-slide .case-hero{border-top:1px solid var(--rule2);border-bottom:0;padding-top:44px;padding-bottom:8px}

.works-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule2);margin-top:44px}
.wtab{
  border-right:1px solid var(--rule);text-align:left;
  padding:22px 20px 24px 0;font-family:var(--sans);
  transition:background .25s;position:relative;min-width:0;
}
.wtab:last-child{border-right:0}
.wtab+.wtab{padding-left:20px}
.wtab .en{display:block;font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:8px}
.wtab b{display:block;font-family:var(--serif);font-size:17px;font-weight:600;letter-spacing:.03em;color:var(--ink-sub);line-height:1.5}
.wtab:hover{background:rgba(var(--tint),.12)}
.wtab.on::before{content:'';position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ink)}
.wtab.on .en,.wtab.on b{color:var(--ink)}

/* 事例2枚並び（下層で使う） */
.case-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.case-list a{padding:42px 34px 46px;color:var(--ink);display:block;transition:background .25s;min-width:0}
.case-list a+a{border-left:1px solid var(--rule)}
.case-list a:first-child{padding-left:0}
.case-list a:hover{background:rgba(var(--tint),.12)}
.case-list .cat{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:18px}
.case-list h3{margin-bottom:14px}
.case-list p{font-size:16px}
.case-list .go{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.08em;color:var(--ink-sub);margin-top:24px}


/* ============================================================
   FRAME 07 — MATRIX
   ============================================================ */
.matrix{width:100%;border-collapse:collapse;margin-top:8px}
.matrix th,.matrix td{border-bottom:1px solid var(--rule);padding:20px 18px;font-size:16px;text-align:center;font-weight:500}
.matrix thead th{border-bottom:2px solid var(--rule3);font-family:var(--sans);font-size:15px;letter-spacing:.11em;text-transform:uppercase;color:var(--meta);font-weight:500;padding-bottom:16px}
.matrix thead th.us{color:var(--ink);font-family:var(--serif-en);letter-spacing:.16em;font-size:16px;font-weight:700}
.matrix tbody th{text-align:left;font-family:var(--serif);font-size:17px;font-weight:600;letter-spacing:.03em;padding-left:0;width:38%;color:var(--ink)}
.matrix td.us{background:rgba(var(--tint),.22);color:var(--ink)}
.matrix .yes{font-size:16px;font-weight:700}
.matrix .no{color:var(--rule2)}
.matrix td.us.no{color:var(--meta);font-weight:500}


/* ============================================================
   FRAME 08 — PULL QUOTE
   ============================================================ */
.quote{max-width:840px;margin:0 auto;text-align:center}
.quote .qm{display:block;font-family:var(--serif-en);font-weight:700;font-size:46px;color:var(--rule2);line-height:1;margin-bottom:30px}
.quote blockquote{font-family:var(--serif);font-size:clamp(21px,2.3vw,29px);line-height:1.82;letter-spacing:.05em;font-weight:500;color:var(--ink)}
.quote .who{margin-top:44px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;color:var(--ink-sub)}
.quote .who b{display:block;font-family:var(--serif);font-size:18px;font-weight:600;letter-spacing:.05em;color:var(--ink);margin-bottom:8px}
.quote .who i{display:block;font-style:normal;color:var(--meta);margin-top:10px}


/* ============================================================
   FRAME 09 — EDITORIAL THREE-UP
   ============================================================ */
.notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:2px solid var(--rule3)}
.notes a{padding:38px 30px 42px;color:var(--ink);display:flex;flex-direction:column;transition:background .25s;min-width:0}
.notes a+a{border-left:1px solid var(--rule)}
.notes a:first-child{padding-left:0}
.notes a:hover{background:rgba(var(--tint),.12)}
.notes .cat{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--meta);margin-bottom:20px}
.notes h3{font-size:19px;margin-bottom:16px}
.notes p{font-size:16px;line-height:1.8;flex:1}
.notes .meta{
  display:flex;justify-content:space-between;gap:16px;margin-top:26px;padding-top:18px;
  border-top:1px solid var(--rule2);font-family:var(--sans);font-size:15px;font-weight:500;
  color:var(--meta);letter-spacing:.05em;
}


/* ============================================================
   FRAME 10 — PLAN BAND（間）
   ============================================================ */
.band{padding:0;overflow:hidden;border-top:1px solid var(--rule2);border-bottom:1px solid var(--rule2)}
.band svg{width:100%;height:auto;display:block}


/* ============================================================
   FRAME 11 — ENTRY BAND（動線の受け皿）
   ============================================================ */
section.entry{padding-top:0;padding-bottom:0}
.entry-box{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:center;
  border-top:2px solid var(--rule3);border-bottom:1px solid var(--rule2);padding:44px 0 46px;
}
.entry-txt h3{margin-bottom:12px}
.entry-txt p{font-size:16px;max-width:660px}
.entry-act{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.entry-note{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;color:var(--meta)}


/* ============================================================
   FRAME 12 — TERMS（費用の決まり方）
   ============================================================ */
.terms{margin-top:70px;border-top:2px solid var(--rule3)}
.terms-cap{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.12em;color:var(--meta);padding:16px 0 22px}
.terms-h{font-size:24px;margin-bottom:30px}
.terms-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule2)}
.terms-grid>div{padding:26px 30px 28px 0;min-width:0}
.terms-grid>div+div{border-left:1px solid var(--rule);padding-left:30px}
.terms-grid .k{display:block;font-family:var(--serif-en);font-size:15px;font-weight:700;letter-spacing:.18em;color:var(--meta);margin-bottom:14px}
.terms-grid b{display:block;font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:.03em;color:var(--ink);margin-bottom:10px}
.terms-grid p{font-size:16px;line-height:1.8}
.terms-notes{border-top:1px solid var(--rule2);padding-top:26px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px}
.terms-notes p{font-size:16px;line-height:1.85}


/* ============================================================
   MIX（4P）内訳
   ============================================================ */
.mix{margin-top:56px;border-top:2px solid var(--rule3)}
.mix-cap{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.12em;color:var(--meta);padding:16px 0 18px}
.mix-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule2)}
.mix-grid>div{padding:26px 26px 28px 0;min-width:0}
.mix-grid>div+div{border-left:1px solid var(--rule);padding-left:26px}
.mix-grid .k{display:block;font-family:var(--serif-en);font-size:15px;font-weight:600;letter-spacing:.16em;color:var(--ink);margin-bottom:12px}
.mix-grid p{font-size:16px;line-height:1.8}
.mix-note{border-top:1px solid var(--rule2);padding-top:24px;font-size:16px;line-height:1.85;max-width:900px}


/* ============================================================
   ABOUT：名刺ブロック／BELIEF
   ============================================================ */
.card-block{
  border:1.5px solid var(--rule2);background:rgba(var(--card),.5);
  padding:64px 44px 54px;text-align:center;
  box-shadow:0 1px 0 rgba(var(--card),.9) inset;width:100%;
}
.card-block .cm{font-family:var(--serif-en);font-weight:600;font-size:22px;line-height:1.5;letter-spacing:.18em;text-indent:.18em}
.card-block .ct{font-family:var(--sans);font-size:14px;font-weight:500;letter-spacing:.1em;color:var(--meta);margin-top:16px;line-height:1.5}
.card-block .role{font-family:var(--serif);font-size:15px;font-weight:500;letter-spacing:.1em;color:var(--meta);margin-top:34px}
.card-block .name{font-family:var(--serif);font-size:25px;font-weight:600;letter-spacing:.28em;text-indent:.28em;margin-top:12px}
.card-block .addr{font-size:15px;font-weight:400;line-height:1.9;color:var(--ink-sub);margin-top:34px;letter-spacing:.03em}

.beliefs{border-top:2px solid var(--rule3);margin-top:44px}
.belief{padding:22px 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:104px minmax(0,1fr);gap:22px}
.belief .n{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;color:var(--meta);white-space:nowrap}
.belief b{display:block;font-family:var(--serif);font-size:18px;font-weight:600;letter-spacing:.04em;margin-bottom:8px;color:var(--ink)}
.belief p{font-size:16px;line-height:1.8}


/* ============================================================
   CTA 2分割
   ============================================================ */
.cta-split{
  display:grid;grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr);margin-top:66px;
  border-top:2px solid var(--rule3);border-bottom:1px solid var(--rule2);
}
.cta-split .vline{background:var(--rule)}
.cta-split .c{padding:44px 40px;min-width:0}
.cta-split .c:first-child{padding-left:0}
.cta-split .k{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:16px}
.cta-split h3{margin-bottom:12px}
.cta-split p{font-size:16px;margin-bottom:24px}


/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{padding:88px var(--pad-x) 54px;border-top:2px solid var(--rule3)}
.f-head{text-align:center;padding:0 0 46px;margin-bottom:46px;border-bottom:1px solid var(--rule2)}
.f-mark{font-family:var(--serif-en);font-weight:600;font-size:17px;letter-spacing:.2em;line-height:1.7}
.f-head .f-mark{font-size:19px;letter-spacing:.22em;text-indent:.22em;line-height:1.62}
.f-head .f-tag{margin-top:16px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.35;color:var(--meta)}
.f-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:44px;padding-bottom:56px}
.f-top>div{min-width:0}
.f-addr{font-size:15px;line-height:1.95;color:var(--ink-sub);letter-spacing:.02em}
.f-col h4{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--meta);margin-bottom:20px}
.f-col a{display:block;font-family:var(--sans);font-size:15px;font-weight:500;color:var(--ink-sub);margin-bottom:13px;letter-spacing:.03em}
.f-col a:hover{color:var(--ink)}
.f-bot{
  border-top:1px solid var(--rule2);padding-top:26px;display:flex;
  justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-family:var(--sans);font-size:15px;font-weight:500;color:var(--meta);letter-spacing:.05em;
}
.f-bot a{color:var(--meta)}
.f-bot a:hover{color:var(--ink)}
.f-legal{display:flex;gap:22px;flex-wrap:wrap}

/* トップへ戻る */
.scroll-top{
  position:fixed;right:22px;bottom:22px;z-index:90;width:46px;height:46px;
  border:1px solid var(--rule2);background:rgba(var(--paper-rgb),.9);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  display:flex;align-items:center;justify-content:center;
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s,background .25s;
}
.scroll-top.on{opacity:1;visibility:visible}
.scroll-top:hover{background:var(--ink)}
.scroll-top svg{width:18px;height:18px;stroke:var(--ink);fill:none;stroke-width:1.6}
.scroll-top:hover svg{stroke:var(--paper)}

/* ============================================================
   L6. 下層ページ 共通
   ============================================================ */

/* ページヘッダ（下層のファーストビュー） */
.page-hero{
  padding:calc(var(--pad-y) * .62) var(--pad-x) calc(var(--pad-y) * .46);
  border-bottom:1px solid var(--rule2);position:relative;overflow:hidden;
}
.page-hero .reg{position:absolute;width:15px;height:15px;border:1.5px solid var(--rule2)}
.page-hero .reg.tl{top:26px;left:var(--pad-x);border-right:0;border-bottom:0}
.page-hero .reg.br{bottom:26px;right:var(--pad-x);border-left:0;border-top:0}
.page-hero .label{display:block;margin-bottom:18px}
.page-hero h1{font-size:clamp(31px,3.8vw,50px);line-height:1.4;letter-spacing:.05em}
.page-hero .lead{margin-top:28px;max-width:760px}
.page-hero .sub{margin-top:24px;max-width:760px;font-size:17px;line-height:1.9}

/* パンくず */
.breadcrumb{
  font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.05em;
  color:var(--meta);margin-bottom:26px;display:flex;flex-wrap:wrap;gap:10px;align-items:center;
}
.breadcrumb a{color:var(--meta)}
.breadcrumb a:hover{color:var(--ink)}
.breadcrumb .sep{color:var(--rule2)}

/* 見出し直下の小見出し帯 */
.rule-head{
  border-top:2px solid var(--rule3);padding-top:18px;margin-bottom:34px;
  display:flex;align-items:baseline;justify-content:space-between;gap:24px;flex-wrap:wrap;
}
.rule-head h2{font-size:clamp(24px,2.4vw,31px);letter-spacing:.04em}
.rule-head .fig-cap{white-space:nowrap}

/* 定義リスト（会社概要など） */
.deflist{border-top:2px solid var(--rule3)}
.deflist .row{
  display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;
  padding:22px 0;border-bottom:1px solid var(--rule);
}
.deflist dt{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;color:var(--meta);text-transform:uppercase}
.deflist dd{font-size:16px;line-height:1.85;color:var(--ink-sub)}

/* FAQ */
.faq{border-top:2px solid var(--rule3)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{
  list-style:none;cursor:pointer;padding:24px 40px 24px 0;position:relative;
  font-family:var(--serif);font-size:19px;font-weight:600;letter-spacing:.03em;color:var(--ink);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'';position:absolute;right:6px;top:50%;width:13px;height:1.5px;
  background:var(--ink);transform:translateY(-50%);
}
.faq summary::before{
  content:'';position:absolute;right:11.75px;top:50%;width:1.5px;height:13px;
  background:var(--ink);transform:translateY(-50%);transition:opacity .2s;
}
.faq details[open] summary::before{opacity:0}
.faq .a{padding:0 0 26px;font-size:16px;line-height:1.9;color:var(--ink-sub);max-width:860px}

/* 番号つきリスト（工程・手順） */
.oli{border-top:2px solid var(--rule3);counter-reset:oli}
.oli>li{
  counter-increment:oli;display:grid;grid-template-columns:70px minmax(0,1fr);gap:26px;
  padding:26px 0;border-bottom:1px solid var(--rule);
}
.oli>li::before{
  content:counter(oli,decimal-leading-zero);
  font-family:var(--serif-en);font-size:15px;font-weight:700;letter-spacing:.18em;color:var(--meta);
}
.oli h3{margin-bottom:8px}
.oli p{font-size:16px;line-height:1.85}


/* ============================================================
   アーカイブ（Works / Note 一覧）
   ============================================================ */
.filters{
  display:flex;flex-wrap:wrap;gap:0;border-top:2px solid var(--rule3);
  border-bottom:1px solid var(--rule2);margin-bottom:56px;
}
.filters a{
  font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.08em;
  color:var(--ink-sub);padding:16px 22px;border-right:1px solid var(--rule);
  transition:background .25s;
}
.filters a:first-child{padding-left:0}
.filters a:last-child{border-right:0}
.filters a:hover{background:rgba(var(--tint),.12);color:var(--ink)}
.filters a.on{color:var(--ink);background:rgba(var(--tint),.2)}

.arch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:2px solid var(--rule3)}
.arch>article{border-bottom:1px solid var(--rule);min-width:0}
.arch>article:nth-child(2n){border-left:1px solid var(--rule)}
.arch>article>a{display:flex;flex-direction:column;height:100%;padding:40px 34px 42px;transition:background .25s}
.arch>article:nth-child(2n-1)>a{padding-left:0}
.arch>article:nth-child(2n)>a{padding-right:0}
.arch>article>a:hover{background:rgba(var(--tint),.12)}
.arch .thumb{
  aspect-ratio:16/10;overflow:hidden;border:1px solid var(--rule);margin-bottom:26px;
  background:rgba(var(--tint),.12);
}
.arch .thumb img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.02)}
.arch .cat{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:16px}
.arch h2,.arch h3{font-size:21px;line-height:1.6;margin-bottom:14px}
.arch p{font-size:16px;line-height:1.8;flex:1}
.arch .meta{
  display:flex;justify-content:space-between;gap:16px;margin-top:24px;padding-top:16px;
  border-top:1px solid var(--rule2);font-family:var(--sans);font-size:15px;font-weight:500;
  color:var(--meta);letter-spacing:.05em;
}

/* リスト型アーカイブ（Note） */
.arch-list{border-top:2px solid var(--rule3)}
.arch-list article{border-bottom:1px solid var(--rule)}
.arch-list a{
  display:grid;grid-template-columns:150px minmax(0,1fr) 190px;gap:32px;align-items:baseline;
  padding:28px 0;transition:background .25s;
}
.arch-list a:hover{background:rgba(var(--tint),.10)}
.arch-list .d{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.08em;color:var(--meta)}
.arch-list h2,.arch-list h3{font-size:20px;line-height:1.62;letter-spacing:.03em}
.arch-list .c{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;color:var(--meta);text-align:right}

/* ページネーション */
.pager{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:64px}
.pager .page-numbers{
  min-width:46px;height:46px;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--rule2);font-family:var(--sans);font-size:15px;font-weight:500;
  letter-spacing:.05em;color:var(--ink-sub);padding:0 12px;transition:background .25s;
}
.pager .page-numbers:hover{background:rgba(var(--tint),.16);color:var(--ink)}
.pager .page-numbers.current{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pager .dots{border:0}


/* ============================================================
   単一記事（single）
   ============================================================ */
.article-head{max-width:var(--w-text);margin:0 auto;padding-bottom:48px;border-bottom:1px solid var(--rule2)}
.article-head .cat{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:20px}
.article-head h1{font-size:clamp(27px,3.2vw,42px);line-height:1.5;letter-spacing:.04em}
.article-head .meta{
  display:flex;flex-wrap:wrap;gap:26px;margin-top:28px;
  font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;color:var(--meta);
}
.article-thumb{max-width:var(--w-wide);margin:56px auto 0;border:1px solid var(--rule)}
.article-thumb img{width:100%;filter:grayscale(1) contrast(1.02)}

.entry{max-width:var(--w-text);margin:0 auto;padding-top:56px}
.entry>*+*{margin-top:26px}
.entry h2{font-size:clamp(24px,2.6vw,32px);line-height:1.5;letter-spacing:.04em;margin-top:64px;padding-top:22px;border-top:2px solid var(--rule3)}
.entry h3{font-size:21px;margin-top:44px}
.entry h4{font-size:18px;margin-top:34px}
.entry p{font-size:17px;line-height:2.0;color:var(--ink-sub)}
.entry ul,.entry ol{padding-left:0;margin-left:0}
.entry ul>li,.entry ol>li{
  position:relative;padding-left:24px;font-size:17px;line-height:1.95;color:var(--ink-sub);
}
.entry ul>li+li,.entry ol>li+li{margin-top:10px}
.entry ul>li::before{content:'';position:absolute;left:2px;top:.92em;width:8px;height:1px;background:var(--rule3)}
.entry ol{counter-reset:eol}
.entry ol>li{counter-increment:eol;padding-left:34px}
.entry ol>li::before{
  content:counter(eol,decimal-leading-zero);position:absolute;left:0;top:0;
  font-family:var(--sans);font-size:15px;font-weight:500;color:var(--meta);letter-spacing:.06em;
}
.entry blockquote{
  border-left:2px solid var(--rule3);padding:6px 0 6px 26px;margin:36px 0;
  font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.9;color:var(--ink);
}
.entry blockquote p{font-family:inherit;font-size:inherit;color:inherit}
.entry a:not(.btn):not(.tlink){border-bottom:1px solid var(--rule2);color:var(--ink)}
.entry a:not(.btn):not(.tlink):hover{border-color:var(--ink)}
.entry img,.entry figure{margin:40px 0}
.entry figure img{border:1px solid var(--rule)}
.entry figcaption{margin-top:12px;font-family:var(--sans);font-size:15px;color:var(--meta);letter-spacing:.05em}
.entry hr{border:0;border-top:1px solid var(--rule2);margin:52px 0}
.entry table{border-top:2px solid var(--rule3);margin:36px 0}
.entry table th,.entry table td{border-bottom:1px solid var(--rule);padding:16px 18px 16px 0;text-align:left;font-size:16px;vertical-align:top}
.entry table th{font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;color:var(--meta);text-transform:uppercase}
.entry code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px;background:rgba(var(--tint),.2);padding:2px 6px}
.entry pre{background:rgba(var(--tint),.16);border:1px solid var(--rule);padding:22px;overflow-x:auto;font-size:15px;line-height:1.7}
.entry pre code{background:none;padding:0}

/* WordPress 標準クラス（フロート起点の崩れを止める） */
.alignleft{float:left;margin:8px 30px 24px 0;max-width:50%}
.alignright{float:right;margin:8px 0 24px 30px;max-width:50%}
.aligncenter{margin-left:auto;margin-right:auto;display:block}
.alignwide{max-width:var(--w-wide);margin-left:auto;margin-right:auto}
.alignfull{width:100%;max-width:none}
.entry::after{content:'';display:block;clear:both}
.wp-caption{max-width:100%}
.wp-caption img{width:100%}
.wp-caption-text{margin-top:10px;font-family:var(--sans);font-size:15px;color:var(--meta)}
.sticky,.gallery-caption,.bypostauthor{display:block}

/* 記事下 */
.article-foot{max-width:var(--w-text);margin:72px auto 0;padding-top:34px;border-top:2px solid var(--rule3)}
.tags{display:flex;flex-wrap:wrap;gap:10px}
.tags a{
  font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.06em;
  border:1px solid var(--rule2);padding:8px 16px;color:var(--ink-sub);transition:background .25s;
}
.tags a:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.post-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--rule2);margin-top:44px}
.post-nav a{padding:28px 26px;min-width:0;transition:background .25s}
.post-nav a:first-child{padding-left:0}
.post-nav a:last-child{text-align:right;padding-right:0;border-left:1px solid var(--rule)}
.post-nav a:hover{background:rgba(var(--tint),.12)}
.post-nav .k{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--meta);margin-bottom:12px}
.post-nav b{font-family:var(--serif);font-size:17px;font-weight:600;line-height:1.6;color:var(--ink)}


/* ============================================================
   フォーム（お問い合わせ・検索・診断）
   ============================================================ */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border-top:2px solid var(--rule3)}
.field{padding:26px 30px 28px 0;min-width:0;border-bottom:1px solid var(--rule)}
.field.wide{grid-column:1 / -1;padding-right:0}
.form-grid .field:nth-child(2n){border-left:1px solid var(--rule);padding-left:30px;padding-right:0}
.field label{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--meta);margin-bottom:12px}
.field .req{color:var(--ink);font-weight:700;margin-left:6px}

input[type=text],input[type=email],input[type=tel],input[type=url],input[type=search],input[type=number],select,textarea{
  width:100%;font-family:var(--sans);font-size:16px;font-weight:400;line-height:1.7;color:var(--ink);
  background:rgba(var(--card),.5);border:1px solid var(--rule2);border-radius:0;
  padding:13px 15px;transition:border-color .2s,background .2s;-webkit-appearance:none;appearance:none;
}
textarea{min-height:170px;resize:vertical}
select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%2346443F' stroke-width='1.4' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;padding-right:38px;
}
input:focus,select:focus,textarea:focus{border-color:var(--ink);background:rgba(var(--card),.8);outline:none}
input::placeholder,textarea::placeholder{color:var(--rule2)}

button[type=submit],input[type=submit]{
  display:inline-block;font-family:var(--sans);font-size:17px;font-weight:500;letter-spacing:.06em;
  padding:17px 46px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);
  border-radius:0;transition:background .25s,color .25s;
}
button[type=submit]:hover,input[type=submit]:hover{background:transparent;color:var(--ink)}
.form-foot{margin-top:36px;display:flex;flex-wrap:wrap;gap:24px;align-items:center}
.form-note{font-size:15px;color:var(--meta);letter-spacing:.04em}

.search-form{display:flex;gap:0;max-width:520px;border-bottom:1.5px solid var(--ink)}
.search-form input[type=search]{border:0;background:none;padding:12px 2px}
.search-form input[type=search]:focus{background:none}
.search-form button{padding:12px 4px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}


/* ============================================================
   404 / 検索結果 / 空状態
   ============================================================ */
.state{padding:calc(var(--pad-y) * .8) var(--pad-x);text-align:center}
.state .code{font-family:var(--serif-en);font-size:clamp(56px,9vw,120px);font-weight:700;letter-spacing:.12em;line-height:1;color:var(--rule2)}
.state h1{margin-top:34px;font-size:clamp(24px,3vw,36px);letter-spacing:.05em}
.state p{margin:26px auto 0;max-width:560px}
.state .actions{margin-top:44px;display:flex;gap:22px;justify-content:center;flex-wrap:wrap}
.empty{border-top:2px solid var(--rule3);border-bottom:1px solid var(--rule2);padding:64px 0;text-align:center}
.empty p{font-size:17px}


/* ============================================================
   診断ページ（brand-diagnosis）
   ============================================================ */
.q-list{border-top:2px solid var(--rule3);counter-reset:q}
.q-item{counter-increment:q;display:grid;grid-template-columns:70px minmax(0,1fr);gap:26px;padding:28px 0;border-bottom:1px solid var(--rule)}
.q-item::before{content:'Q' counter(q,decimal-leading-zero);font-family:var(--serif-en);font-size:15px;font-weight:700;letter-spacing:.14em;color:var(--meta)}
.q-item b{display:block;font-family:var(--serif);font-size:19px;font-weight:600;line-height:1.62;letter-spacing:.03em;color:var(--ink);margin-bottom:10px}
.q-item p{font-size:16px;line-height:1.85}

.price-box{
  border:1.5px solid var(--rule2);background:rgba(var(--card),.42);padding:46px 44px 44px;
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:44px;align-items:center;
}
.price-box .k{display:block;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-bottom:14px}
.price-box .v{font-family:var(--sans);font-size:clamp(34px,4vw,52px);font-weight:500;line-height:1;color:var(--ink)}
.price-box .v small{font-size:19px;font-weight:500;margin-left:8px;letter-spacing:.04em}
.price-box p{margin-top:18px;font-size:16px;max-width:520px}
.price-box .act{display:flex;flex-direction:column;gap:12px;align-items:flex-end}

/* ============================================================================
   L7. RESPONSIVE
   方針
   - float は一切使わない（grid / flex のみ）。WP本文の .alignleft / .alignright
     だけは float を持つので、SP で明示的に float:none し縦列に落とす。
   - 多カラムを1カラムに落とすときは、必ず border-left → border-top へ
     「向きを付け替える」。落とすだけだと縦罫線が宙に浮いて崩れる。
   - 折り返した先頭要素の padding-left:0 / :first-child 指定も併せて解除する。
   ========================================================================== */

/* ---------- 〜1280px ---------- */
@media (max-width:1280px){
  :root{--pad-x:36px}
  .split .txt{padding-right:48px}
  .split.rev .txt{padding-left:48px}
  .split .fig{padding-left:48px}
  .split.rev .fig{padding-right:48px}
}

/* ---------- 〜1100px : 工程 4→2 ---------- */
@media (max-width:1100px){
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps .st{padding:34px 24px 38px}
  .steps .st:nth-child(2n+1){border-left:0;padding-left:0}
  .steps .st:nth-child(n+3){border-top:1px solid var(--rule)}
  .steps h3{min-height:0}
}

/* ---------- 〜1040px ---------- */
@media (max-width:1040px){
  .layer{grid-template-columns:40px 150px minmax(0,1fr);gap:16px}
  .case-hero{grid-template-columns:minmax(0,1fr) 250px;gap:40px}
  .arch-list a{grid-template-columns:120px minmax(0,1fr) 150px;gap:22px}
}

/* ============================================================
   〜960px : タブレット／スマホ切替の本丸
   ============================================================ */
@media (max-width:960px){
  :root{--pad-y:110px;--pad-x:26px}

  /* --- NAV：ドロワーへ --- */
  .nav-menu{display:none}
  .nav-cta{display:none}
  .nav-toggle{display:block}

  /* --- HERO --- */
  .hero{min-height:auto;padding:76px var(--pad-x) 84px;justify-content:center}
  .hero .reg{width:13px;height:13px}
  .hero-hr{margin:24px 0 22px}
  .hero-scroll{margin-top:48px}

  /* --- 02 STATEMENT SHEET --- */
  .sheet{padding:48px 26px 40px}
  .sheet .lead{margin-bottom:44px}
  .sheet-cols{grid-template-columns:1fr}
  .sheet-cols>div{padding:32px 0 8px}
  .sheet-cols>div+div{border-left:0;border-top:1px solid var(--rule)}

  /* --- 03 DRAWING SPLIT --- */
  .split,.split.rev{grid-template-columns:1fr}
  .split .vline{display:none}
  .split .txt,.split.rev .txt{padding:0}
  .split .fig,.split.rev .fig{padding:44px 0 0}
  .split.rev .fig{order:2;padding:44px 0 0}
  .split.rev .txt{order:1}
  .layer{grid-template-columns:44px minmax(0,1fr);gap:14px 18px;padding:22px 0}
  .layer .en{grid-column:2}
  .layer p{grid-column:2}

  /* --- 04 LEDGER / NUMBERS --- */
  .nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .nums .cell{padding:30px 22px 32px}
  .nums .cell:nth-child(2n+1){border-left:0;padding-left:0}
  .nums .cell:nth-child(n+3){border-top:1px solid var(--rule)}
  .nums .v{font-size:40px}

  /* --- 06 WORKS --- */
  .case-hero{grid-template-columns:1fr;gap:34px;padding-bottom:44px}
  .case-hero .side{border-left:0;padding-left:0;border-top:1px solid var(--rule2);padding-top:6px}
  .case-hero .m:first-child{border-top:0}
  .works-tabs{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:34px}
  .wtab{padding:18px 16px 20px 0!important}
  .wtab:nth-child(2n){border-right:0;padding-left:16px!important}
  .wtab:nth-child(n+3){border-top:1px solid var(--rule)}
  .works-seg{font-size:14px}
  .case-list{grid-template-columns:1fr}
  .case-list a{padding:34px 0 36px!important}
  .case-list a+a{border-left:0;border-top:1px solid var(--rule)}

  /* --- 09 NOTES --- */
  .notes{grid-template-columns:1fr}
  .notes a{padding:32px 0 34px!important}
  .notes a+a{border-left:0;border-top:1px solid var(--rule)}

  /* --- MIX / TERMS / ENTRY --- */
  .mix-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mix-grid>div{padding:24px 22px 26px 0}
  .mix-grid>div:nth-child(2n+1){border-left:0;padding-left:0}
  .mix-grid>div:nth-child(n+3){border-top:1px solid var(--rule)}
  .terms{margin-top:56px}
  .terms-grid{grid-template-columns:1fr}
  .terms-grid>div{padding:24px 0 26px}
  .terms-grid>div+div{border-left:0;border-top:1px solid var(--rule);padding-left:0}
  .terms-notes{grid-template-columns:1fr;gap:0}
  .terms-notes p+p{margin-top:20px}
  .entry-box{grid-template-columns:1fr;gap:26px;padding:36px 0 38px}
  .entry-act{align-items:flex-start}
  .lead.cond{font-size:19px}

  /* --- CTA / FOOTER --- */
  .cta-split{grid-template-columns:1fr;margin-top:48px}
  .cta-split .vline{display:none}
  .cta-split .c{padding:34px 0 36px}
  .cta-split .c+.c{border-top:1px solid var(--rule)}
  .f-top{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 30px;padding-bottom:44px}

  /* --- 下層 --- */
  .deflist .row{grid-template-columns:1fr;gap:8px;padding:20px 0}
  .arch{grid-template-columns:1fr}
  .arch>article:nth-child(2n){border-left:0}
  .arch>article>a{padding:32px 0 34px!important}
  .form-grid{grid-template-columns:1fr}
  .field,.form-grid .field:nth-child(2n){padding:24px 0 26px;border-left:0}
  .price-box{grid-template-columns:1fr;gap:30px;padding:36px 26px 34px}
  .price-box .act{align-items:flex-start}
  .post-nav a{padding:24px 18px}
  .article-thumb{margin-top:44px}
  .entry{padding-top:44px}
  .entry h2{margin-top:52px}
}

/* ============================================================
   〜780px : 表を「行ブロック」に組み替える
   ============================================================ */
@media (max-width:780px){

  /* LEDGER：セルを縦に積む。thead は落とす（各セルにラベルを持たせる） */
  .ledger,
  .ledger thead,
  .ledger tbody,
  .ledger tr,
  .ledger th,
  .ledger td{display:block;width:auto}
  .ledger{border-top:2px solid var(--rule3)}
  .ledger thead{display:none}
  .ledger tr{border-bottom:1px solid var(--rule2);padding:28px 0}
  .ledger tr:hover td{background:none}
  .ledger td{border-bottom:0;padding:0}
  .ledger td+td{margin-top:14px}

  /* td に付いた列幅（23% / 27% / 32% / 184px）を必ず解除する。
     .ledger .seg 等（0,2,0）は .ledger td（0,1,1）より強いので、
     td.クラス（0,2,1）で上書きする。ここを落とすと文字が細い柱になる。 */
  .ledger td.idx,
  .ledger td.issue,
  .ledger td.desc,
  .ledger td.dom,
  .ledger td.seg,
  .ledger td.phases{width:auto;max-width:none;padding-right:0}

  .ledger .idx{
    font-family:var(--serif-en);font-size:14px;font-weight:700;letter-spacing:.18em;
    color:var(--meta);margin-bottom:12px;
  }
  .ledger .issue{font-size:20px;line-height:1.6}
  .ledger .seg,.ledger .phases{padding-right:0}
  .ledger .seg b{font-size:20px}
  .ledger .phases{
    display:flex!important;flex-wrap:wrap;gap:0 18px;
    border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
    padding:8px 0;margin-top:16px;
  }
  .ledger .dom{
    display:flex!important;flex-wrap:wrap;gap:8px 18px;margin-top:16px;
    padding-top:12px;border-top:1px solid var(--rule);
  }
  .ledger .dom span+span{margin-top:0}

  /* MATRIX：横スクロールに逃がしつつ、まず詰めて収める */
  .matrix th,.matrix td{padding:15px 8px;font-size:15px}
  .matrix tbody th{width:44%;font-size:16px;padding-left:0;padding-right:12px}
  .matrix thead th{font-size:14px;letter-spacing:.06em}
  .matrix thead th.us{font-size:15px;letter-spacing:.1em}

  /* アーカイブのリスト型 */
  .arch-list a{grid-template-columns:1fr;gap:10px;padding:24px 0}
  .arch-list .c{text-align:left}

  /* フィルタ */
  .filters a{padding:13px 16px;font-size:15px}

  /* WP本文のフロートを解除 → 縦列に落とす */
  .entry .alignleft,
  .entry .alignright,
  .alignleft,
  .alignright{float:none!important;max-width:100%;margin:32px 0}
  .entry img,.entry figure{margin:32px 0}
}

/* ============================================================
   〜620px : 完全1カラム
   ============================================================ */
@media (max-width:620px){
  :root{--pad-y:88px}

  .sec-head{flex-direction:column;align-items:flex-start;gap:20px;margin-bottom:40px}
  .rule-head{gap:12px}

  .mix-grid{grid-template-columns:1fr}
  .mix-grid>div{padding:22px 0 24px}
  .mix-grid>div+div{border-left:0;border-top:1px solid var(--rule);padding-left:0}

  .nums{grid-template-columns:1fr}
  .nums .cell{padding:26px 0 28px}
  .nums .cell+.cell{border-left:0;border-top:1px solid var(--rule)}

  .steps{grid-template-columns:1fr}
  .steps .st{padding:30px 0 32px!important}
  .steps .st+.st{border-left:0;border-top:1px solid var(--rule)}
  .steps .big{right:0;bottom:12px;font-size:44px}

  .works-tabs{grid-template-columns:1fr}
  .wtab,
  .wtab:nth-child(2n){padding:16px 0 18px!important;border-right:0}
  .wtab+.wtab{border-top:1px solid var(--rule)}
  .works-meta{flex-direction:column;align-items:flex-start;gap:6px}
  .works-seg{text-align:left}

  .f-top{grid-template-columns:1fr;gap:32px}
  .f-bot{flex-direction:column;gap:12px}

  .belief{grid-template-columns:1fr;gap:8px}
  .oli>li,.q-item{grid-template-columns:1fr;gap:10px}

  .post-nav{grid-template-columns:1fr}
  .post-nav a{padding:22px 0!important;text-align:left!important}
  .post-nav a:last-child{border-left:0;border-top:1px solid var(--rule)}

  .card-block{padding:44px 24px 38px}
  .card-block .name{font-size:22px}
  .quote .qm{font-size:38px}

  /* MATRIX は最終的に横スクロールへ */
  .tscroll{margin-right:calc(var(--pad-x) * -1);padding-right:var(--pad-x)}
  .matrix{min-width:560px}
  .matrix thead th{white-space:nowrap}
}

/* ============================================================
   〜480px : スマートフォン
   ============================================================ */
@media (max-width:480px){
  :root{--pad-y:76px;--pad-x:20px}

  body{font-size:16px}

  .hero{padding:60px var(--pad-x) 70px}
  .hero-mark{font-size:clamp(24px,7.4vw,32px);letter-spacing:.17em;text-indent:.17em}
  .hero-tag{font-size:13.5px;letter-spacing:.04em;margin-top:18px}
  .hero-h1{font-size:clamp(24px,6.6vw,30px);letter-spacing:.045em}
  .hero-sub{font-size:16px;margin-top:18px}
  .hero-ctas{margin-top:34px;flex-direction:column;gap:16px;width:100%}
  .hero-ctas .btn{width:100%}
  .hero-ctas .tlink{margin-top:4px}
  .hero-scroll{margin-top:40px}
  .hero .reg{width:11px;height:11px}

  h2.sec{font-size:clamp(24px,6.4vw,30px);line-height:1.5}
  .lead{font-size:18px;line-height:1.85}
  .lead.cond{font-size:17.5px;padding-left:16px}

  .sheet{padding:36px 20px 30px}
  .btn{width:100%;padding:15px 20px;font-size:16px}
  .btn.sm{width:auto;padding:13px 22px}
  .entry-act .btn.sm{width:100%}

  .terms-h{font-size:21px}
  .price-box{padding:30px 20px 28px}
  .price-box .act .btn{width:100%}

  .article-head .meta{gap:14px 20px}
  .entry p{font-size:16px;line-height:1.95}
  .entry ul>li,.entry ol>li{font-size:16px}
  .entry blockquote{font-size:17.5px;padding-left:20px}

  .filters{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .filters a{white-space:nowrap}

  .form-foot{flex-direction:column;align-items:stretch}
  button[type=submit],input[type=submit]{width:100%}

  .scroll-top{right:14px;bottom:14px;width:42px;height:42px}
  .nav-drawer{padding:22px 22px 34px}
}

/* ---------- 高さの低い横向き端末 ---------- */
@media (max-height:620px) and (min-width:961px){
  .hero{min-height:auto;padding-top:64px;padding-bottom:64px}
  .hero-scroll{display:none}
}

/* ---------- 印刷 ---------- */
@media print{
  body{background:#FBF9F2;background-image:none}
  .site-nav,.nav-drawer,.nav-overlay,.scroll-top,.entry-act,.hero-ctas,.works-tabs{display:none!important}
  section{padding:32px 0;break-inside:avoid}
  a{text-decoration:none;color:inherit}
}