/* === Dynamic Viewport fallback (全ページ共通) === */
:root{
  /* JSで上書きされるフォールバック */
  --vh: 1vh;
  /* iOS等のノッチ上部の安全域（JSも参照） */
  --safe-top: env(safe-area-inset-top);
}

/* dvh 対応ブラウザでは 100dvh を優先できるよう目印（任意） */
@supports (height: 100dvh) {
  :root { --use-dvh: 1; }
}

/* 便利ユーティリティ（必要時のみ付与） */
.vh-100 { height: calc(var(--vh) * 100); }
@supports (height: 100dvh) {
  .vh-100 { height: 100dvh; }
}

/* 全画面オーバーレイ等で使う場合 */
.overlay-full {
  position: fixed;
  inset: 0;
  height: calc(var(--vh) * 100);
  /* 背景固定系で透けが気になる場合は背景指定を追加 */
}
@supports (height: 100dvh) {
  .overlay-full { height: 100dvh; }
}

/* ノッチ/ホームバーの安全域（固定ヘッダー/フッター用の余白確保） */
.safe-top   { padding-top: env(safe-area-inset-top, 0); }
.safe-bottom{ padding-bottom: env(safe-area-inset-bottom, 0); }

/* sticky 見出しの基本（背景透け防止） */
/* ← URLバーの出入りで動かないよう top:0 に固定 */
.sticky-title {
  position: sticky;
  top: 0;
  z-index: 10;
  background: inherit;
}

/* アンカー飛び先のズレ予防（必要箇所に付与） */
.anchor-target {
  scroll-margin-top: calc(56px + env(safe-area-inset-top, 0px));
}

/* ========================= ここまで追加 ========================= */

:root{
  --ink:#111; --muted:#6b7280; --paper:#fff;
  --brand:#0ea5e9; --brand-ink:#0b8fc8;
  --container:1040px; --radius:16px;
}

*{box-sizing:border-box}
html,body{margin:0}
body{
  font:16px/1.75 system-ui,-apple-system,Segoe UI,Roboto,"Noto Sans JP",sans-serif;
  color:var(--ink);
  background:var(--paper);
  /* viewport-fit=cover を入れている環境でノッチを避ける */
  padding-top: env(safe-area-inset-top, 0);
}
img{max-width:100%;height:auto;display:block}
small{font-size:.875rem}
.small{font-size:.875rem}
.container{max-width:var(--container);margin:0 auto;padding:0 20px}
.narrow{max-width:800px}
.muted{color:var(--muted)}
.muted.-on-dark{opacity:.85}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #eee}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:56px}
.logo{font-weight:700;text-decoration:none;color:var(--ink)}
.nav .menu{display:flex;gap:20px;list-style:none;margin:0;padding:0}
.nav a{color:#333;text-decoration:none}
.nav a:hover{color:#000}
.nav-toggle{display:none}

/* Hero (FV) */
.hero{padding:78px 0 56px;background:linear-gradient(180deg,#f6fbff,transparent)}
.eyebrow{color:var(--muted);margin:0 0 6px}
.hero_title{font-size:40px;line-height:1.1;margin:0 0 10px}
.hero_lead{color:var(--muted);margin:0 0 18px}
.hero_cta{display:flex;gap:12px}

/* Sections */
.section{padding:64px 0}
.section.-alt{background:#fafafa}
.section_title{font-size:24px;line-height:1.25;margin:0 0 16px}
.block{margin:24px 0}
.h3{font-size:18px;margin:0 0 6px}

/* Lists */
.list{-webkit-padding-start:1.2em;padding-inline-start:1.2em}
.list.-disc{list-style:disc}

/* Cards（未使用だが残す） */
.grid{display:grid;gap:16px}
.grid.-cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.card{background:#fff;border:1px solid #eee;border-radius:var(--radius);padding:18px}
.card_title{margin:0 0 8px;font-size:18px}

/* CTA */
.cta{background:#0f172a;color:#fff;text-align:center}
.cta .section_title{color:#fff;margin-bottom:8px}

/* Buttons */
.btn{display:inline-block;padding:12px 16px;border-radius:12px;border:1px solid #ddd;text-decoration:none}
.btn.-lg{padding:14px 18px;border-radius:14px}
.btn.-primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.-primary:hover{background:var(--brand-ink)}
.btn.-ghost{border-color:#fff;color:#fff}
.btn.-ghost:hover{background:rgba(255,255,255,.1)}

/* Notify */
.notify-box{display:flex;flex-direction:column;align-items:center;gap:10px;margin:12px 0 8px}
.placeholder-form{margin-top:16px;padding:14px;border:1px dashed #cbd5e1;border-radius:12px;background:#fff}

/* Q&A */
.qa{border:1px solid #e5e7eb;border-radius:12px;background:#fff;margin:12px 0;overflow:hidden}
.qa > summary{cursor:pointer;padding:14px 16px;font-weight:600;list-style:none}
.qa > summary::-webkit-details-marker{display:none}
.qa .qa_a{padding:14px 16px;border-top:1px solid #e5e7eb}

/* Mobile first */
@media (max-width: 840px){
  .hero_title{font-size:32px}
  .grid.-cards{grid-template-columns:1fr}
  .nav .menu{display:none}
  .nav-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid #ddd;background:#fff;border-radius:10px;padding:6px 10px}
  .nav-drawer{
    position:fixed;
    inset:0 0 0 auto;
    width:min(84vw,360px);
    background:#fff;
    border-left:1px solid #eee;
    padding:20px;
    overflow:auto;
    /* セーフエリア下の余白を確保（ボタンが隠れにくくなる） */
    padding-bottom: calc(20px + env(safe-area-inset-bottom, 0));
  }
  .drawer-menu{display:flex;flex-direction:column;gap:12px;list-style:none;margin:0;padding:0}
}

/* ===== 固定ページ/ブロックエディタの共通リセット（軽量） ===== */

/* 画像・メディアは幅に追随（保険） */
img, svg, video, canvas, iframe { max-width: 100%; height: auto; }

/* Gutenberg の本文余白・見出し・リストのデフォルト調整 */
.entry-content,
.wp-block-post-content {
  line-height: 1.8;
}

.entry-content p,
.wp-block-post-content p {
  margin: 0 0 1.05em;
}

.entry-content h2,
.wp-block-post-content h2 {
  margin: 28px 0 12px;
  font-size: clamp(20px, 4.6vw, 28px);
  line-height: 1.3;
  font-weight: 600;
}

.entry-content h3,
.wp-block-post-content h3 {
  margin: 20px 0 10px;
  font-size: clamp(18px, 4.2vw, 22px);
  line-height: 1.35;
  font-weight: 600;
}

/* リスト（Gutenberg は .list クラスを付けないので素の要素に効かせる） */
.entry-content ul,
.wp-block-post-content ul,
.entry-content ol,
.wp-block-post-content ol {
  padding-inline-start: 1.2em;
  margin: 0 0 1em;
}
.entry-content li,
.wp-block-post-content li { margin: .28em 0; }

/* 表のはみ出し対策（共通） */
.entry-content table,
.wp-block-table { 
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-collapse: collapse;
}
.entry-content th, .entry-content td,
.wp-block-table th, .wp-block-table td {
  border-top: 1px solid #e5e7eb;
  padding: 10px 12px;
  text-align: left;
}

/* 区切り線を薄めに */
.entry-content hr,
.wp-block-separator {
  border: 0;
  border-top: 1px solid rgba(17,17,17,.08);
  margin: 16px 0;
}

/* モバイルで左右に少し余白（“本文だけ”に効かせる） */
@media (max-width: 480px){
  .entry-content,
  .wp-block-post-content { padding-left: 16px; padding-right: 16px; }
}

/* ==== Global Footer layout (mobile-first, refined) ==== */
.site-footer{
  border-top: 1px solid rgba(17,24,39,.12); /* メインとフッターの間に線 */
  background: var(--paper);
  color: var(--ink);
  padding: 24px 0;
}

.footer-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  align-items: start;
}

/* ロゴ：太字解除＋下線＋本文色 */
.footer-brand .logo{
  text-decoration: underline;
  color: var(--ink);
  font-weight: 400;
  font-size: 18px;
}

/* 法的リンク：リストマーカーを消し、本文色＋下線 */
.footer-legal{
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 0;
  padding: 0;
}
.footer-legal li{ list-style: none; }
.footer-legal a{
  color: var(--ink);              /* 段落テキストと同じ色 */
  text-decoration: underline;     /* リンク感は残す */
}

/* コピーライトは一番下に */
.footer-copy{ order: 99; }
@media (min-width: 768px){
  .footer-grid{
    grid-template-columns: 1fr auto auto;
    gap: 18px 20px;
  }
  .footer-copy{
    grid-column: 1 / -1;  /* 全幅で最下段 */
    order: 99;
    text-align: left;
  }
}

/* === FAB（右下メニュー）iOSレイヤズレ対策（任意：使っている場合） === */
.fab-menu{
  position: fixed;
  right: 16px;
  bottom: calc(env(safe-area-inset-bottom,0) + 16px);
  width: 56px; height: 56px;
  transform: translateZ(0);
  will-change: transform;
  pointer-events: auto;
}