/* ==========================================================
   METAP 共通スタイル（/metap/ と /metap/reading/）
   style-metap-1.css をもとに、書き損じを修正し、
   新ページで使わない部品（メタップボード、note S0 など）を外したもの。

   目次
   1. 変数・土台
   2. 共通部品（見出し・ボタン・枠）
   3. ヒーロー
   4. 読書会ページ
   5. ハブページ
   6. フォーム・プロフィール・フォロー
   7. ヘッダーナビ調整
   8. アクセシビリティ・レスポンシブ
   ========================================================== */


/* ==========================================================
   1. 変数・土台
   ========================================================== */
body:has(.metap-lp){ margin:0; }
.metap-lp{
  --bg:#060b1e; --bg-2:#0c1430; --bg-3:#0d1638;
  --text:#d6dde8; --text-soft:#c5cdde; --text-dim:#8090a8; --text-faint:#3c465a;
  --rule:rgba(255,255,255,0.08);
  --blue:#3b6bd8; --blue-light:#82a8ff; --blue-accent:#9ad0ff;
  --quest:#4a9eff; --quest-soft:rgba(74,158,255,0.5);
  --gold:#e6a839; --wanted:#ff7a3a; --wanted-soft:#ffa070;
  --max-w:1500px;

  position:relative;
  background:var(--bg);
  color:var(--text);
  font-family:'Helvetica','zen kaku gothic new',sans-serif;
  font-weight:400;
  font-size:1.06em;
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
  overflow:hidden;
}
.metap-lp *{ box-sizing:border-box; margin:0; padding:0; }
.metap-lp a{ color:inherit; }

.metap-lp .m-stars{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-size:180px 180px; background-repeat:repeat;
  background-image:
    radial-gradient(1px 1px at 13% 7%, rgba(255,255,255,0.8), transparent 60%),
    radial-gradient(2px 2px at 41% 14%, rgba(255,255,255,0.85), transparent 60%),
    radial-gradient(1px 1px at 71% 5%, rgba(255,255,255,0.6), transparent 60%),
    radial-gradient(2px 2px at 89% 22%, rgba(255,255,255,0.7), transparent 60%),
    radial-gradient(1px 1px at 19% 33%, rgba(154,208,255,0.6), transparent 60%),
    radial-gradient(1px 1px at 77% 41%, rgba(154,208,255,0.5), transparent 60%),
    radial-gradient(2px 2px at 33% 47%, rgba(255,255,255,0.55), transparent 60%),
    radial-gradient(1px 1px at 60% 62%, rgba(255,255,255,0.45), transparent 60%),
    radial-gradient(1px 1px at 8% 74%, rgba(255,255,255,0.5), transparent 60%),
    radial-gradient(2px 2px at 92% 80%, rgba(255,255,255,0.55), transparent 60%),
    radial-gradient(1px 1px at 47% 90%, rgba(154,208,255,0.5), transparent 60%);
  opacity:0.4;
}
.metap-lp .m-wrap{ position:relative; z-index:1; }

/* reveal：JSが動かないときは最初から表示（フェイルセーフ）
   ※旧ファイル末尾にあった重複指定は削除済み */
.metap-lp .m-reveal{ opacity:1; transform:none; transition:opacity 0.8s, transform 0.8s; }
.metap-lp.js-ready .m-reveal{ opacity:0; transform:translateY(22px); }
.metap-lp.js-ready .m-reveal.in{ opacity:1; transform:none; }

/* 特設ヘッダー */
.home-header.metap-header{ position:fixed; z-index:9999; top:0; left:0; width:100%; }


/* ==========================================================
   2. 共通部品
   ========================================================== */
.metap-lp .m-section{ padding:88px 28px; position:relative; }
.metap-lp .m-inner{ max-width:var(--max-w); margin:0 auto; }

#home-nav.desktop-nav .menu li a {
    color: #fff!important;
    font-family: 'Josefin Slab', YuGothic, sans-serif;
}

.metap-lp .m-corner{ position:absolute; width:9px; height:9px; border-style:solid; border-color:var(--text-faint); border-width:0; }
.metap-lp .m-corner.tl{ top:-1px; left:-1px; border-top-width:1px; border-left-width:1px; }
.metap-lp .m-corner.tr{ top:-1px; right:-1px; border-top-width:1px; border-right-width:1px; }
.metap-lp .m-corner.bl{ bottom:-1px; left:-1px; border-bottom-width:1px; border-left-width:1px; }
.metap-lp .m-corner.br{ bottom:-1px; right:-1px; border-bottom-width:1px; border-right-width:1px; }

.metap-lp .m-eyebrow{
  font-family:'Josefin Slab',serif; font-size:11px; letter-spacing:0.25em;
  color:var(--blue-accent); margin-bottom:14px; display:inline-block; text-transform:uppercase;
}
.metap-lp .m-eyebrow::before{ content:""; display:inline-block; width:26px; height:1px; background:var(--blue-accent); vertical-align:middle; margin-right:12px; opacity:0.6; }
.metap-lp .m-title{
  font-family:'Noto Serif JP',serif; font-weight:500;
  font-size:clamp(24px,3.6vw,36px); line-height:1.4; letter-spacing:0.03em;
  color:#f1f4fb; margin-bottom:16px;
}
.metap-lp .m-lead{ color:var(--text-soft); font-size:1em; line-height:1.95; max-width:680px; letter-spacing:0.04em; }

/* ボタン */
.metap-lp .m-cta-row{ display:flex; gap:14px; flex-wrap:wrap; }
.metap-lp .m-btn{
  display:inline-flex; align-items:center; gap:9px; padding:13px 26px; border-radius:30px;
  font-family:'Noto Sans JP',sans-serif; font-weight:500; font-size:0.92em; letter-spacing:0.05em;
  text-decoration:none; transition:transform 0.25s, box-shadow 0.25s, background 0.25s; cursor:pointer; border:0;
}
.metap-lp .m-btn:hover{ transform:translateY(-2px); }
.metap-lp .m-btn--primary{ background:var(--blue); color:#fff; box-shadow:0 4px 22px -4px rgba(59,107,216,0.6); }
.metap-lp .m-btn--primary:hover{ box-shadow:0 8px 30px -4px rgba(59,107,216,0.75); }
.metap-lp .m-btn--ghost{ background:transparent; color:var(--blue-accent); border:1px solid var(--quest); }
.metap-lp .m-btn--ghost:hover{ background:rgba(74,158,255,0.12); }
.metap-lp .m-btn--youtube{ background:#FF0000; color:#fff; box-shadow:0 4px 22px -4px rgba(255,0,0,0.5); }
.metap-lp .m-btn--youtube:hover{ background:#e60000; box-shadow:0 8px 30px -4px rgba(255,0,0,0.7); }
.metap-lp .m-btn--youtube-ghost{ background:transparent; color:#fff; border:1px solid #FF0000; }
.metap-lp .m-btn--youtube-ghost:hover{ background:rgba(255,0,0,0.12); color:#ff3333; border-color:#ff3333; }
.metap-lp .m-btn--gold{ background:#f5c518; color:#241000; box-shadow:0 4px 22px -4px rgba(245,197,24,0.55); }
.metap-lp .m-btn--gold:hover{ background:#ffd633; box-shadow:0 8px 30px -4px rgba(245,197,24,0.75); }
.metap-lp .m-btn--amazon{ background:#FF9900; color:#241000; box-shadow:0 4px 22px -4px rgba(255,153,0,0.5); }
.metap-lp .m-btn--amazon:hover{ background:#ffad33; box-shadow:0 8px 30px -4px rgba(255,153,0,0.7); }
.metap-lp .m-btn--disabled{ background:transparent; color:var(--text-dim); border:1px dashed var(--text-faint); cursor:default; }
.metap-lp .m-btn--disabled:hover{ transform:none; }

/* 仮の書影（画像がないとき） */
.metap-lp .m-phcover{
  display:flex; align-items:center; justify-content:center; text-align:center;
  width:100%; height:100%; padding:6px;
  font-family:'Noto Serif JP',serif; font-size:12px; line-height:1.5; letter-spacing:0.06em;
  color:var(--text-soft);
  background:linear-gradient(160deg,#13275a,#0a1534);
  border:1px solid rgba(154,208,255,0.25); border-radius:2px;
}


/* ==========================================================
   3. ヒーロー
   ========================================================== */
.metap-lp .m-hero{ position:relative; overflow:hidden; }
.metap-lp .m-hero__bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(ellipse at 28% 22%, rgba(74,158,255,0.28) 0%, transparent 55%),
    radial-gradient(ellipse at 82% 70%, rgba(59,107,216,0.30) 0%, transparent 55%),
    linear-gradient(180deg,var(--bg) 0%, #0a1338 100%);
}
.metap-lp .m-hero__particles{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:
    radial-gradient(0.6px 0.6px at 5% 12%, rgba(255,255,255,0.9), transparent 50%),
    radial-gradient(0.5px 0.5px at 11% 47%, rgba(200,224,255,0.7), transparent 50%),
    radial-gradient(0.6px 0.6px at 17% 78%, rgba(255,255,255,0.8), transparent 50%),
    radial-gradient(0.7px 0.7px at 29% 63%, rgba(200,224,255,0.8), transparent 50%),
    radial-gradient(0.6px 0.6px at 41% 88%, rgba(255,255,255,0.75), transparent 50%),
    radial-gradient(0.5px 0.5px at 47% 38%, rgba(154,208,255,0.7), transparent 50%),
    radial-gradient(0.6px 0.6px at 53% 71%, rgba(255,255,255,0.85), transparent 50%),
    radial-gradient(0.7px 0.7px at 64% 55%, rgba(200,224,255,0.8), transparent 50%),
    radial-gradient(0.6px 0.6px at 76% 33%, rgba(255,255,255,0.8), transparent 50%),
    radial-gradient(0.6px 0.6px at 88% 14%, rgba(255,255,255,0.75), transparent 50%),
    radial-gradient(0.5px 0.5px at 93% 49%, rgba(255,255,255,0.65), transparent 50%),
    radial-gradient(0.6px 0.6px at 97% 80%, rgba(200,224,255,0.7), transparent 50%);
  background-repeat:no-repeat;
  animation:m-particle-tw 4.5s ease-in-out infinite alternate;
}
@keyframes m-particle-tw{ from{opacity:0.45;} to{opacity:0.95;} }

.metap-lp .m-hero__grid{
  position:relative; z-index:2; max-width:var(--max-w); margin:0 auto;
  padding:88px 28px 72px;
  display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center;
}

/* パンくず */
.metap-lp .m-crumb{ font-family:'Josefin Slab',serif; font-size:13px; letter-spacing:0.22em; color:var(--text-dim); margin-bottom:20px; }
.metap-lp .m-crumb a{ color:var(--blue-accent); text-decoration:none; }
.metap-lp .m-crumb a:hover{ text-decoration:underline; }
.metap-lp .m-crumb .sep{ margin:0 10px; color:var(--text-faint); }

/* スライダー */
.metap-lp .m-hslider{ position:relative; min-height:440px; }
.metap-lp .m-hslide{
  position:absolute; inset:0; opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity 0.9s ease, visibility 0.9s;
  display:flex; flex-direction:column; justify-content:center;
}
.metap-lp .m-hslide.is-active{ opacity:1; visibility:visible; pointer-events:auto; }
.metap-lp .m-hslide__kicker{ font-family:'Josefin Slab',serif; font-size:11px; letter-spacing:0.22em; color:var(--blue-accent); margin-bottom:16px; }
.metap-lp .m-hslide__kicker::before{ content:"● "; }

.metap-lp .m-hero__title{
  font-family:'Noto Serif JP',serif; font-weight:700;
  font-size:clamp(30px,4.8vw,48px); line-height:1.35; letter-spacing:0.04em;
  color:#fff; margin-bottom:16px;
  text-shadow:0 2px 30px rgba(0,0,0,0.5), 0 0 50px rgba(60,107,216,0.25);
}
.metap-lp .m-hero__title--m{ font-size:clamp(28px,4vw,44px); }
.metap-lp .m-hero__title--s{ font-size:clamp(26px,3.6vw,40px); }
.metap-lp .m-hero__title-theme{
  text-shadow:0 2px 5px rgba(0,0,0,0.8), 0 4px 12px rgba(0,0,0,0.6), 0 0 35px rgba(59,107,216,0.7), 0 0 55px rgba(74,158,255,0.5);
}
.metap-lp .m-hero__sub{
  font-family:'Noto Serif JP',serif; font-weight:300; font-size:clamp(14px,1.8vw,17px);
  letter-spacing:0.1em; color:var(--text-soft); margin-bottom:34px;
}
.metap-lp .m-hintro__lead{ font-weight:300; font-size:clamp(14px,1.7vw,16px); line-height:2.1; color:var(--text-soft); letter-spacing:0.04em; margin-bottom:28px; max-width:540px; }

/* 次回配信ブロック */
.metap-lp .m-signal{ border-left:2px solid var(--quest); padding:6px 0 6px 18px; margin-bottom:30px; }
.metap-lp .m-signal__label{ font-family:'Josefin Slab',serif; font-size:11px; letter-spacing:0.25em; color:var(--quest); margin-bottom:10px; }
.metap-lp .m-signal__label::before{ content:"● "; }
.metap-lp .m-signal__book{ font-size:0.92em; color:var(--text-soft); }
.metap-lp .m-signal__book b{ color:var(--blue-accent); font-weight:500; font-family:'Noto Serif JP',serif; }
.metap-lp .m-signal__pub{ font-size:0.8em; color:var(--text-dim); }

/* ヒーロー内の書影 */
.metap-lp .m-hbooks{ display:flex; gap:14px; margin-bottom:28px; flex-wrap:wrap; }
.metap-lp .m-hbooks__item{ width:90px; text-decoration:none; }
.metap-lp .m-hbooks__cover{
  width:100%; height:125px; padding:6px; margin-bottom:8px;
  background:rgba(255,255,255,0.04); border:1px solid var(--rule); border-radius:3px;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 15px -5px rgba(0,0,0,0.5); transition:transform 0.3s, border-color 0.3s;
}
.metap-lp .m-hbooks__item:hover .m-hbooks__cover{ transform:translateY(-3px); border-color:var(--quest); }
.metap-lp .m-hbooks__cover img{ width:auto; height:100%; max-width:100%; object-fit:contain; border-radius:2px; box-shadow:2px 2px 6px rgba(0,0,0,0.4); }

/* スライダー操作 */
.metap-lp .m-hctrl{ display:flex; align-items:center; gap:14px; margin-top:34px; }
.metap-lp .m-hdots{ display:flex; gap:10px; }
.metap-lp .m-hdot{ width:9px; height:9px; border-radius:50%; background:var(--text-faint); border:0; cursor:pointer; padding:0; transition:0.25s; }
.metap-lp .m-hdot.active{ background:var(--blue-accent); box-shadow:0 0 8px rgba(154,208,255,0.7); }
.metap-lp .m-harrows{ display:flex; gap:8px; margin-left:6px; }
.metap-lp .m-harrows button{ background:none; border:0; cursor:pointer; width:28px; height:28px; display:flex; align-items:center; justify-content:center; color:var(--text-soft); transition:color 0.2s; }
.metap-lp .m-harrows button:hover{ color:var(--blue-accent); }
.metap-lp .m-harrows svg{ width:18px; height:18px; fill:currentColor; }
.metap-lp .m-hcount{ font-family:'Josefin Slab',serif; font-size:12px; color:var(--text-dim); letter-spacing:0.08em; margin-left:auto; }
.metap-lp .m-hcount .cur{ color:var(--blue-accent); }

/* 星座（装飾のみ） */
.metap-lp .m-constellation{ position:relative; width:100%; aspect-ratio:1/0.92; }
.metap-lp .m-constellation svg{ width:100%; height:100%; overflow:visible; }
.metap-lp .m-cn-line{ stroke:rgba(154,208,255,0.28); stroke-width:1; stroke-dasharray:3 4; }
.metap-lp .m-cn-star{ fill:#fff; animation:m-twinkle 3.5s ease-in-out infinite alternate; }
@keyframes m-twinkle{ from{opacity:0.6;} to{opacity:1;} }
.metap-lp .m-cn-label{ font-family:'Josefin Slab',serif; font-size:11px; letter-spacing:0.18em; fill:var(--text-soft); }
.metap-lp .m-constellation--static .m-cn-node{ pointer-events:none; }
.metap-lp .m-constellation--static .is-done .core{ fill:var(--text-dim); }
.metap-lp .m-constellation--static .is-done .m-cn-label{ fill:var(--text-dim); }
.metap-lp .m-constellation--static .is-now .core{ fill:var(--gold); filter:drop-shadow(0 0 10px rgba(230,168,57,0.85)); }
.metap-lp .m-constellation--static .is-now .m-cn-label{ fill:var(--gold); }
.metap-lp .m-constellation--static .is-soon .core{ fill:transparent; stroke:var(--blue-accent); stroke-width:1; }
.metap-lp .m-constellation--static .is-soon .m-cn-label{ fill:var(--text-faint); }


/* ==========================================================
   4. 読書会ページ
   ========================================================== */
.metap-lp .m-about{ background:var(--bg); }

/* スタイル（3つの約束） */
.metap-lp .m-style__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:40px; margin-top:36px;
  border-top:1px solid var(--rule); padding-top:32px;
}
.metap-lp .m-style__item h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.12em; line-height:1.6; color:#f1f4fb; margin-bottom:12px; letter-spacing:0.03em; }
.metap-lp .m-style__item p{ font-size:0.95em; line-height:2; color:var(--text-soft); letter-spacing:0.03em; }

/* シーズンマップ */
.metap-lp .m-smap{ background:var(--bg-2); border-top:1px solid var(--rule); }
.metap-lp .m-smap__grid{ display:grid; grid-template-columns:1fr 1.15fr 0.85fr; gap:18px; margin-top:44px; align-items:stretch; }
.metap-lp .m-scard{
  position:relative; display:flex; flex-direction:column; padding:28px 26px 26px;
  background:linear-gradient(155deg, rgba(20,40,90,0.45), rgba(8,18,50,0.35) 75%);
  border:1px solid #1c3a6e;
}
.metap-lp .m-scard .m-corner{ border-color:var(--quest); }
.metap-lp .m-scard--now{ border-color:var(--gold); box-shadow:0 10px 40px -14px rgba(230,168,57,0.35); }
.metap-lp .m-scard--now .m-corner{ border-color:var(--gold); }
.metap-lp .m-scard--soon{ background:transparent; border-style:dashed; border-color:var(--text-faint); }
.metap-lp .m-scard__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.metap-lp .m-scard__no{ font-family:'Josefin Slab',serif; font-size:13px; letter-spacing:0.16em; color:var(--blue-accent); }
.metap-lp .m-scard__status{ font-size:0.78em; letter-spacing:0.08em; padding:3px 12px; border-radius:20px; border:1px solid var(--rule); color:var(--text-dim); }
.metap-lp .m-scard--now .m-scard__status{ border-color:var(--gold); color:var(--gold); }
.metap-lp .m-scard__title{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.3em; line-height:1.5; color:#f1f4fb; letter-spacing:0.03em; margin-bottom:6px; }
.metap-lp .m-scard--soon .m-scard__title{ color:var(--text-soft); }
.metap-lp .m-scard__term{ font-family:'Josefin Slab',serif; font-size:0.86em; letter-spacing:0.08em; color:var(--text-dim); margin-bottom:18px; }
.metap-lp .m-scard__list{ list-style:none; margin-bottom:18px; }
.metap-lp .m-scard__list li{ display:grid; grid-template-columns:44px 1fr; gap:8px; font-size:0.9em; line-height:1.6; color:var(--text-soft); padding:8px 0; border-bottom:1px solid var(--rule); }
.metap-lp .m-scard__list li:last-child{ border-bottom:0; }
.metap-lp .m-scard__list .mo{ font-family:'Josefin Slab',serif; font-size:0.9em; color:var(--wanted-soft); letter-spacing:0.04em; }
.metap-lp .m-scard--now .m-scard__list .mo{ color:var(--gold); }
.metap-lp .m-scard__note{ font-size:0.86em; line-height:1.9; color:var(--text-dim); margin-bottom:18px; }
.metap-lp .m-scard__cta{ margin-top:auto; color:var(--blue-light); text-decoration:none; font-size:0.92em; }
.metap-lp .m-scard__cta:hover{ color:var(--blue-accent); text-decoration:underline; }

/* はじめての方へ */
.metap-lp .m-start__grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:36px; }
.metap-lp .m-pick{
  display:grid; grid-template-columns:110px 1fr; gap:24px; align-items:start; padding:24px; text-decoration:none;
  border:1px solid var(--rule); border-radius:6px; background:rgba(255,255,255,0.03);
  transition:border-color 0.25s, background 0.25s;
}
.metap-lp .m-pick:hover{ border-color:var(--quest); background:rgba(74,158,255,0.08); }
.metap-lp .m-pick__cover{ padding:6px; border:1px solid var(--rule); background:rgba(255,255,255,0.04); border-radius:3px; }
.metap-lp .m-pick__cover img{ display:block; width:100%; height:auto; }
.metap-lp .m-pick__why{ display:inline-block; font-size:0.78em; color:var(--gold); border:1px solid rgba(230,168,57,0.5); border-radius:20px; padding:2px 12px; margin-bottom:10px; }
.metap-lp .m-pick h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.05em; line-height:1.6; color:#f1f4fb; margin-bottom:10px; }
.metap-lp .m-pick p{ font-size:0.9em; line-height:1.9; color:var(--text-soft); margin-bottom:12px; }
.metap-lp .m-pick__cta{ font-size:0.88em; color:var(--blue-light); }

/* アーカイブ */
.metap-lp .m-arc{ background:var(--bg-2); border-top:1px solid var(--rule); }
.metap-lp .m-arc__season + .m-arc__season{ margin-top:72px; }
.metap-lp .m-arc__theme{ color:var(--text-dim); font-size:0.95em; }
.metap-lp .m-arc__list{ margin-top:28px; border-top:1px solid var(--rule); }
.metap-lp .m-arc__row{ display:grid; grid-template-columns:120px minmax(0,1fr) clamp(260px,26vw,380px); gap:28px; align-items:center; padding:22px 0; border-bottom:1px solid var(--rule); }
.metap-lp .m-arc__links{ justify-self:stretch; text-align:left; }
.metap-lp .m-arc__cover{ width:64px; height:92px; justify-self:center; }
.metap-lp .m-arc__cover img{ display:block; width:100%; height:100%; object-fit:contain; border-radius:2px; }
.metap-lp .m-arc__cover--wide{ width:120px; height:auto; }
.metap-lp .m-arc__cover--wide img{ height:auto; object-fit:cover; }
.metap-lp .m-arc__no{ font-family:'Josefin Slab',serif; font-size:0.84em; letter-spacing:0.08em; color:var(--text-dim); margin-bottom:4px; }
.metap-lp .m-arc__meta h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.08em; line-height:1.5; color:#f1f4fb; }
.metap-lp .m-arc__author{ font-size:0.86em; color:var(--text-soft); margin-top:2px; }
.metap-lp .m-arc__links a{ display:block; color:var(--blue-light); text-decoration:none; font-size:0.9em; padding:3px 0; }
.metap-lp .m-arc__links a::before{ content:"› "; color:var(--text-dim); }
.metap-lp .m-arc__links a:hover{ color:var(--blue-accent); }

/* ==========================================================
   5. ハブページ
   ========================================================== */
.metap-lp .m-hub__logo{
  font-family:'Josefin Slab',serif; font-weight:700; font-style:italic;
  font-size:clamp(40px,6vw,64px); letter-spacing:0.08em; line-height:1; color:#fff; margin-bottom:28px;
}
.metap-lp .m-hub__logo span{
  display:block; margin-top:10px;
  font-family:'Noto Serif JP',serif; font-style:normal; font-weight:400; font-size:13px; letter-spacing:0.3em; color:var(--blue-accent);
}

/* 次回ライブのカード */
.metap-lp .m-nextcard{
  position:relative; justify-self:end; width:100%; max-width:440px; padding:32px 30px;
  background:linear-gradient(155deg, rgba(20,45,100,0.5), rgba(8,18,50,0.35) 75%);
  border:1px solid #1c3a6e;
}
.metap-lp .m-nextcard .m-corner{ border-color:var(--quest); width:11px; height:11px; }
.metap-lp .m-nextcard__title{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.35em; line-height:1.5; color:#fff; margin-bottom:22px; }

/* METAPとは */
.metap-lp .m-manifesto{ display:grid; grid-template-columns:1fr 1.6fr; gap:56px; align-items:start; }
.metap-lp .m-manifesto__body p{
  font-family:'Noto Serif JP',serif; font-weight:400; font-size:clamp(15px,1.7vw,17px);
  line-height:2.3; letter-spacing:0.05em; color:var(--text-soft); margin-bottom:1.4em; max-width:38em;
}
.metap-lp .m-manifesto__body p:last-child{ margin-bottom:0; }

/* 観測→翻訳→編み直し（順序があるので番号つき） */
.metap-lp .m-func__grid{ display:grid; grid-template-columns:repeat(3,1fr); margin-top:64px; border-top:1px solid var(--rule); }
.metap-lp .m-func{ padding:28px 28px 0 0; }
.metap-lp .m-func + .m-func{ padding-left:28px; border-left:1px solid var(--rule); }
.metap-lp .m-func__step{ font-family:'Josefin Slab',serif; font-size:28px; color:var(--gold); line-height:1; display:block; margin-bottom:12px; }
.metap-lp .m-func h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.15em; color:#f1f4fb; margin-bottom:8px; }
.metap-lp .m-func p{ font-size:0.93em; line-height:1.95; color:var(--text-soft); }

/* プロジェクト */
.metap-lp .m-proj{ background:var(--bg-2); border-top:1px solid var(--rule); }
.metap-lp .m-proj__grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:18px; margin-top:40px; }
.metap-lp .m-projcard{
  position:relative; display:flex; flex-direction:column; padding:32px 30px; text-decoration:none;
  border:1px solid #1c3a6e; background:linear-gradient(155deg, rgba(20,40,90,0.45), rgba(8,18,50,0.35) 75%);
}
.metap-lp .m-projcard .m-corner{ border-color:var(--quest); }
.metap-lp a.m-projcard{ transition:border-color 0.25s, transform 0.25s; }
.metap-lp a.m-projcard:hover{ border-color:var(--quest); transform:translateY(-3px); }
.metap-lp .m-projcard--research{ background:transparent; border-style:dashed; border-color:var(--text-faint); }
.metap-lp .m-projcard__status{ align-self:flex-start; font-size:0.78em; letter-spacing:0.08em; padding:3px 12px; border-radius:20px; border:1px solid var(--rule); color:var(--text-dim); margin-bottom:16px; }
.metap-lp .m-projcard--live .m-projcard__status{ border-color:var(--gold); color:var(--gold); }
.metap-lp .m-projcard h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.35em; color:#f1f4fb; margin-bottom:10px; }
.metap-lp .m-projcard p{ font-size:0.95em; line-height:1.95; color:var(--text-soft); margin-bottom:20px; }
.metap-lp .m-projcard__cta{ margin-top:auto; color:var(--blue-light); font-size:0.92em; }
.metap-lp .m-projcard__cta--soon{ color:var(--text-dim); }

/* 最新の更新 */
.metap-lp .m-latest__list{ list-style:none; margin-top:24px; border-top:1px solid var(--rule); }
.metap-lp .m-latest__list a{
  display:grid; grid-template-columns:110px 64px 1fr; gap:18px; align-items:baseline;
  padding:16px 0; border-bottom:1px solid var(--rule); text-decoration:none; transition:color 0.2s;
}
.metap-lp .m-latest__date{ font-family:'Josefin Slab',serif; font-size:0.9em; color:var(--text-dim); letter-spacing:0.06em; }
.metap-lp .m-latest__type{ font-family:'Josefin Slab',serif; font-size:0.8em; letter-spacing:0.14em; color:var(--wanted-soft); }
.metap-lp .m-latest__title{ color:var(--text-soft); }
.metap-lp .m-latest__list a:hover .m-latest__title{ color:#fff; }


/* ==========================================================
   6. フォーム・プロフィール・フォロー
   ========================================================== */
.metap-lp .m-sf{
  background-color:var(--bg-2);
  background-image:
    radial-gradient(circle at 10% 20%, rgba(74,158,255,0.08) 0%, transparent 50%),
    radial-gradient(circle at 90% 80%, rgba(245,197,24,0.06) 0%, transparent 50%),
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size:100% 100%, 100% 100%, 40px 40px, 40px 40px;
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
}
.metap-lp .m-form__panel{
  margin-top:30px; position:relative;
  background:linear-gradient(155deg, rgba(78,42,120,0.38), rgba(34,16,60,0.24) 75%);
  border:1px solid #5a3a8e;
}
.metap-lp .m-form__panel .m-corner{ border-color:#a98ee6; }
.metap-lp .m-form__panel p{ font-size:0.95em; line-height:1.9; color:var(--text-soft); letter-spacing:0.03em; }
.metap-lp .m-form__panel--wide{ display:flex; align-items:center; gap:40px; padding:36px 40px; }
.metap-lp .m-form__panel--wide .m-form__panel-content{ flex:1; }
.metap-lp .m-form__panel--wide .m-form__btn{ flex-shrink:0; }
.metap-lp .m-form__panel--wide .m-btn--gold{ padding:16px 32px; font-size:1.05em; }

/* プロフィール */
.metap-lp .m-profile__grid{ display:grid; grid-template-columns:1.4fr 1fr; gap:56px; align-items:start; }
.metap-lp .m-pcard{ display:grid; grid-template-columns:84px 1fr; gap:24px; align-items:start; }
.metap-lp .m-pavatar{ width:84px; height:84px; border-radius:50%; overflow:hidden; border:1px solid var(--rule); }
.metap-lp .m-pavatar img{ width:100%; height:100%; object-fit:cover; }
.metap-lp .m-pname{ font-family:'Noto Sans JP',sans-serif; font-weight:500; font-size:0.95em; color:var(--blue-accent); margin-bottom:12px; letter-spacing:0.06em; }
.metap-lp .m-pbody{ font-size:0.95em; line-height:2; color:var(--text-soft); letter-spacing:0.02em; }
.metap-lp .m-pbook{ display:grid; grid-template-columns:120px 1fr; gap:22px; align-items:start; }
.metap-lp .m-pbook__cover{ display:block; width:120px; padding:6px; border:1px solid var(--rule); border-radius:3px; background:rgba(255,255,255,0.04); transition:transform 0.3s, border-color 0.3s; }
.metap-lp .m-pbook__cover:hover{ transform:translateY(-3px); border-color:var(--quest); }
.metap-lp .m-pbook__cover img{ display:block; width:100%; height:auto; }
.metap-lp .m-pbook__label{ font-family:'Josefin Slab',serif; font-size:10px; letter-spacing:0.16em; color:var(--blue-accent); display:block; margin-bottom:8px; }
.metap-lp .m-pbook__title{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.02em; line-height:1.5; color:#f1f4fb; margin-bottom:10px; }
.metap-lp .m-pbook__title small{ font-weight:400; font-size:0.78em; color:var(--text-dim); }
.metap-lp .m-pbook__btns{ display:flex; gap:12px; flex-wrap:wrap; margin-top:16px; }
.metap-lp .m-pbook__btns .m-btn{ padding:10px 20px; font-size:0.86em; }

/* フォロー */
.metap-lp .m-follow{ padding-top:56px; padding-bottom:72px; border-top:1px solid var(--rule); }
.metap-lp .m-follow__inner{ display:flex; justify-content:space-between; align-items:center; gap:28px; flex-wrap:wrap; }
.metap-lp .m-follow__title{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.3em; color:#f1f4fb; margin-bottom:4px; }
.metap-lp .m-follow__lead{ font-size:0.9em; color:var(--text-dim); }


/* ==========================================================
   7. ヘッダーナビ調整（METAPページでのみ読み込まれる）
   ========================================================== */
#home-nav.desktop-nav .menu li a{ color:#fff; font-family:'Josefin Slab',YuGothic,sans-serif; }
.desktop-nav .sub-menu li a{ color:#fff; }
.desktop-nav .sub-menu{ background-color:#0f2d4730 !important; }
.desktop-nav .sub-menu li a:hover{ background:#0f2d4770; }
#home-nav.desktop-nav li:after{ background:rgba(74,158,255,0.5) !important; }


/* ==========================================================
   8. アクセシビリティ・レスポンシブ
   ========================================================== */
.metap-lp a:focus-visible, .metap-lp button:focus-visible{ outline:2px solid var(--blue-accent); outline-offset:3px; }

@media (prefers-reduced-motion: reduce){
  .metap-lp *, .metap-lp *::before, .metap-lp *::after{ animation:none !important; transition:none !important; }
  .metap-lp.js-ready .m-reveal{ opacity:1; transform:none; }
}

@media (max-width:900px){
  .metap-lp .m-hero__grid{ grid-template-columns:1fr; gap:28px; }
  .metap-lp .m-constellation{ max-width:420px; margin:0 auto; opacity:0.85; }
  .metap-lp .m-nextcard{ justify-self:stretch; max-width:none; }
  .metap-lp .m-style__grid,
  .metap-lp .m-smap__grid,
  .metap-lp .m-start__grid,
  .metap-lp .m-proj__grid,
  .metap-lp .m-manifesto,
  .metap-lp .m-profile__grid{ grid-template-columns:1fr; gap:28px; }
  .metap-lp .m-func__grid{ grid-template-columns:1fr; }
  .metap-lp .m-func, .metap-lp .m-func + .m-func{ padding:24px 0; border-left:0; border-bottom:1px solid var(--rule); }
  .metap-lp .m-arc__row{ grid-template-columns:90px 1fr; }
  .metap-lp .m-arc__links{ grid-column:2; }
  .metap-lp .m-form__panel--wide{ flex-direction:column; align-items:flex-start; gap:24px; padding:30px 24px; }
  .metap-lp .m-form__panel--wide .m-form__btn,
  .metap-lp .m-form__panel--wide .m-btn--gold{ width:100%; justify-content:center; }
}
@media (max-width:560px){
  .metap-lp .m-section{ padding:60px 20px; }
  .metap-lp .m-hero__grid{ padding:140px 20px 52px; }
  .metap-lp .m-hslider{ min-height:480px; }
  .metap-lp .m-constellation{ display:none; }
  .metap-lp .m-pick{ grid-template-columns:80px 1fr; gap:16px; padding:18px; }
  .metap-lp .m-arc__row{ grid-template-columns:64px 1fr; gap:16px; }
  .metap-lp .m-arc__cover--wide{ width:64px; }
  .metap-lp .m-latest__list a{ grid-template-columns:1fr; gap:2px; }
  .metap-lp .m-pcard, .metap-lp .m-pbook{ grid-template-columns:1fr; justify-items:center; text-align:center; }
  .metap-lp .m-follow__inner{ flex-direction:column; align-items:flex-start; }
}

/* ==========================================================
   読書会ページ：いまのシーズンの選書
   S1 LP（style-metap-1.css）の BOOKS セクションを移植したもの。
   ========================================================== */
 
/* ---- 背景（固定）＋半透明カバー ---- */
.metap-lp .m-books{
  position:relative;
  background-image:url("https://www.turetiru.com/wp-content/uploads/2026/05/d0458b2d467811bf63e2cc698a7dae9f.jpg");
  background-size:cover; background-position:center; background-attachment:fixed;
}
.metap-lp .m-books::before{
  content:""; position:absolute; inset:0; z-index:0;
  background-color:rgba(0,0,0,0.3);
  pointer-events:none;
}
.metap-lp .m-books .m-inner{ position:relative; z-index:1; }
 
/* ---- 4列のカード ---- */
.metap-lp .m-books__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px; }
.metap-lp .m-bcard{
  position:relative; padding:24px 22px 22px;
  background:linear-gradient(155deg, rgba(20,40,90,0.55), rgba(8,18,50,0.45) 75%);
  backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px);
  border:1px solid #1c3a6e; display:flex; flex-direction:column;
  transition:transform 0.35s cubic-bezier(.2,.7,.2,1), box-shadow 0.35s, border-color 0.35s;
}
.metap-lp .m-bcard:hover{ transform:translateY(-4px); box-shadow:0 14px 38px -10px rgba(74,158,255,0.28); border-color:var(--quest); }
.metap-lp .m-bcard .m-corner{ border-color:var(--quest); width:10px; height:10px; }
 
.metap-lp .m-bcover{
  display:block; width:80%; max-width:170px; border-radius:3px; overflow:hidden; margin:0 auto 18px;
  background:rgba(255,255,255,0.04); border:1px solid var(--rule); padding:8px;
  box-shadow:0 8px 22px -10px rgba(0,0,0,0.7); transition:transform 0.3s, border-color 0.3s;
}
.metap-lp a.m-bcover:hover{ transform:translateY(-3px); border-color:var(--quest); }
.metap-lp .m-bcover img{ display:block; width:100%; height:auto; border-radius:2px; }
 
.metap-lp .m-bno{ font-family:'Josefin Slab',serif; font-size:0.78em; letter-spacing:0.06em; color:var(--text-dim); margin-bottom:10px; }
.metap-lp .m-btitle{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.1em; line-height:1.5; letter-spacing:0.02em; color:#f1f4fb; margin-bottom:6px; }
.metap-lp .m-btitle__sub{ font-weight:400; font-size:0.82em; color:var(--text-dim); }
.metap-lp .m-bauthor{ font-size:0.86em; color:var(--text-soft); letter-spacing:0.03em; margin-bottom:16px; }
 
.metap-lp .m-blive{
  background:linear-gradient(135deg, rgba(255,122,58,0.16), rgba(255,122,58,0.06));
  border:1px solid rgba(255,122,58,0.45); border-radius:4px;
  padding:12px 14px; margin-bottom:16px; text-align:center;
}
.metap-lp .m-blive .lv{ font-family:'Josefin Slab',serif; font-size:0.78em; font-weight:600; letter-spacing:0.22em; color:var(--wanted-soft); display:block; margin-bottom:6px; }
.metap-lp .m-blive .lv-date{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.08em; color:#fff; letter-spacing:0.04em; line-height:1.45; display:block; }
.metap-lp .m-blive .lv-time{ font-family:'Josefin Slab',serif; font-size:0.92em; color:var(--wanted-soft); letter-spacing:0.08em; }
 
.metap-lp .m-blinks{ font-size:0.95em; line-height:1.6; margin-top:auto; }
.metap-lp .m-blinks .lbl{ font-family:'Josefin Slab',serif; font-size:9px; letter-spacing:0.15em; color:var(--text-dim); display:block; margin-bottom:8px; }
.metap-lp .m-blinks a{ display:block; color:var(--blue-light); text-decoration:none; padding:4px 0; transition:color 0.2s; }
.metap-lp .m-blinks a:hover{ color:var(--blue-accent); }
.metap-lp .m-blinks a::before{ content:"› "; color:var(--text-dim); }
 
/* ---- 下のボタン2つ ---- */
.metap-lp .m-books__actions{ display:flex; justify-content:center; align-items:center; gap:20px; margin-top:40px; }
 
/* ---- S2用に足した部品 ---- */
/* 書影がまだないときの仮書影（本の比率） */
.metap-reading .m-bcover .m-phcover{
  display:flex; align-items:center; justify-content:center; aspect-ratio:2/3; width:100%;
  padding:12px; text-align:center; line-height:1.6;
  font-family:'Noto Serif JP',serif; font-size:0.9em; letter-spacing:0.06em; color:var(--text-soft);
  background:linear-gradient(160deg,#14244e,#0b1533); border:1px dashed rgba(154,208,255,0.3); border-radius:2px;
}
/* 配信日が未定の回は、LIVE枠を控えめに */
.metap-reading .m-blive.is-tbd{ background:rgba(6,11,30,0.45); border:1px dashed rgba(255,160,112,0.45); }
.metap-reading .m-blive.is-tbd .lv-date{ font-size:0.98em; }
.metap-reading .m-blinks__soon{ display:block; font-size:0.86em; color:var(--text-dim); padding:4px 0; }
.metap-reading .m-books__note{ margin-top:28px; text-align:center; font-size:0.92em; color:var(--text-soft); letter-spacing:0.04em; }
 
/* ---- レスポンシブ ---- */
@media (max-width:900px){
  .metap-lp .m-books__grid{ grid-template-columns:repeat(2,1fr); }
 
  /* スマホは background-attachment:fixed が効かないため、::after で画面固定の背景をつくる */
  .metap-lp .m-books{
    background-image:none !important;
    background-attachment:scroll;
    clip-path:inset(0);
  }
  .metap-lp .m-books::after{
    content:""; position:fixed; top:0; left:0; width:100vw; height:100vh;
    background-image:url("https://www.turetiru.com/wp-content/uploads/2026/05/d0458b2d467811bf63e2cc698a7dae9f.jpg");
    background-size:cover; background-position:center;
    z-index:-1; pointer-events:none;
  }
  .metap-lp .m-books::before{ background-color:rgba(0,0,0,0.4); z-index:0; }
}
@media (max-width:768px){
  .metap-lp .m-books__actions{ flex-direction:column; gap:16px; }
  .metap-lp .m-books__actions .m-btn{ width:100%; justify-content:center; }
}
@media (max-width:560px){
  .metap-lp .m-books__grid{ grid-template-columns:1fr; }
  .metap-lp .m-bcover{ max-width:200px; margin-left:auto; margin-right:auto; }
}

/* ==========================================================
   読書会ページ：METAP構想
   ========================================================== */
.metap-lp .m-plan{ background:var(--bg); border-top:1px solid var(--rule); }
.metap-lp .m-plan__head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px 48px; flex-wrap:wrap; }
.metap-lp .m-plan__head .m-cta-row{ flex-shrink:0; }

/* 4つのフェーズを横一本の線でつなぐ */
.metap-lp .m-plan__phases{ list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:52px; }
.metap-lp .m-plan__phase{ position:relative; padding:40px 28px 0 0; }
.metap-lp .m-plan__phase::before{ content:""; position:absolute; left:0; right:0; top:12px; height:1px; background:var(--rule); }
.metap-lp .m-plan__phase::after{ content:""; position:absolute; left:0; top:7px; width:11px; height:11px; border-radius:50%; background:var(--bg); border:1px solid var(--text-dim); }
.metap-lp .m-plan__phase.is-now::before{ background:linear-gradient(90deg, var(--gold), var(--rule)); }
.metap-lp .m-plan__phase.is-now::after{ background:var(--gold); border-color:var(--gold); box-shadow:0 0 12px rgba(230,168,57,0.8); }
.metap-lp .m-plan__phase.is-vision::after{ background:transparent; border:1px dashed var(--blue-accent); }

.metap-lp .m-plan__no{ font-size:0.82em; letter-spacing:0.08em; color:var(--text-dim); }
.metap-lp .m-plan__no em{ font-style:normal; margin-left:0.6em; padding:0.1em 0.7em; border-radius:20px; font-size:0.86em; background:var(--gold); color:var(--bg); }
.metap-lp .m-plan__phase h3{ font-family:'Noto Serif JP',serif; font-weight:500; font-size:1.15em; line-height:1.5; color:#f1f4fb; letter-spacing:0.03em; margin:8px 0 6px; }
.metap-lp .m-plan__phase p{ font-size:0.9em; line-height:1.9; color:var(--text-soft); letter-spacing:0.02em; }
.metap-lp .m-plan__phase.is-vision h3{ color:var(--blue-accent); }

/* スマホ：縦の線に切り替える */
@media (max-width:900px){
  .metap-lp .m-plan__head{ align-items:flex-start; }
  .metap-lp .m-plan__phases{ grid-template-columns:1fr; }
  .metap-lp .m-plan__phase{ padding:0 0 28px 30px; }
  .metap-lp .m-plan__phase::before{ left:5px; right:auto; top:0; bottom:0; width:1px; height:auto; }
  .metap-lp .m-plan__phase.is-now::before{ background:linear-gradient(to bottom, var(--gold), var(--rule)); }
  .metap-lp .m-plan__phase::after{ top:6px; }
}

/* ==========================================================
   読書会ページ：プロフィール
   ========================================================== */
.metap-lp .m-profile{ border-top:1px solid var(--rule); }
.metap-lp .m-pavatar{ background:linear-gradient(135deg,#0e1a3a,#1a2c55); }
.metap-lp .m-pbody{ margin-bottom:16px; }

/* 編著の紹介（上に区切り線） */
.metap-lp .m-pbook{ margin-top:30px; padding-top:28px; border-top:1px solid var(--rule); }
.metap-lp .m-pbook__cover{ overflow:hidden; box-shadow:0 8px 22px -10px rgba(0,0,0,0.7); }
.metap-lp .m-pbook__cover img{ border-radius:2px; }
.metap-lp .m-pbook__desc{ font-size:0.86em; line-height:1.9; color:var(--text-soft); letter-spacing:0.02em; }

/* 業績のバナー（3:1、2列） */
.metap-lp .m-media .lbl{ font-family:'Josefin Slab',serif; font-size:11px; letter-spacing:0.2em; color:var(--blue-accent); margin-bottom:18px; }
.metap-lp .m-banners{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.metap-lp .m-banner{
  display:flex; flex-direction:column; text-decoration:none;
  border:1px solid var(--rule); border-radius:6px; overflow:hidden; transition:0.25s;
  background:rgba(255,255,255,0.03);
}
.metap-lp .m-banner:hover{ border-color:var(--quest); background:rgba(74,158,255,0.08); transform:translateY(-3px); }
.metap-lp .m-banner__thumb{
  width:100%; aspect-ratio:3/1; overflow:hidden;
  background:linear-gradient(135deg,#0e1a3a,#1a2c55); border-bottom:1px solid var(--rule);
}
.metap-lp .m-banner__thumb img{ display:block; width:100%; height:100%; object-fit:cover; }
.metap-lp .m-banner__txt{ padding:12px 16px 14px; }
.metap-lp .m-banner__type{ display:block; font-family:'Josefin Slab',serif; font-size:10px; letter-spacing:0.16em; color:var(--blue-accent); margin-bottom:6px; }
.metap-lp .m-banner__title{ display:block; font-size:0.95em; line-height:1.5; color:var(--text-soft); letter-spacing:0.02em; }
.metap-lp .m-banner:hover .m-banner__title{ color:#fff; }

@media (max-width:560px){
  .metap-lp .m-banners{ grid-template-columns:1fr; }
}