/* ============================================================
   NATURERING 抹茶調達プラットフォーム
   内部ページ・記事共通スタイル
   ============================================================ */

/* ---- ページヘッダー ---- */
.page-hero{
  background:var(--c-green-dark);color:#fff;
  padding:80px 0 60px;text-align:center;
}
.page-hero .section-eyebrow{color:rgba(255,255,255,.65);}
.page-hero h1{
  font-size:clamp(26px,4vw,42px);font-weight:800;
  letter-spacing:-.02em;line-height:1.25;margin:12px 0 20px;
}
.page-hero .page-lead{
  font-size:16px;line-height:1.85;color:rgba(255,255,255,.8);
  max-width:640px;margin:0 auto;
}

/* ---- パンくず ---- */
.breadcrumb{
  font-size:13px;color:var(--c-text-muted);
  padding:14px 0;border-bottom:1px solid var(--c-line);
  margin-bottom:0;
}
.breadcrumb a{color:var(--c-green-dark);text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}
.breadcrumb span{margin:0 6px;}

/* ---- 本文レイアウト ---- */
.page-body{padding:60px 0 80px;}
.page-content{max-width:800px;margin:0 auto;}

/* ---- 記事見出し ---- */
.page-content h2{
  font-size:22px;font-weight:700;color:var(--c-green-dark);
  border-left:4px solid var(--c-green);padding-left:14px;
  margin:48px 0 18px;
}
.page-content h3{
  font-size:17px;font-weight:700;color:var(--c-text);
  margin:32px 0 12px;
}
.page-content p{font-size:15px;line-height:1.95;color:var(--c-text);margin:0 0 18px;}
.page-content ul,.page-content ol{
  font-size:15px;line-height:1.85;color:var(--c-text);
  padding-left:22px;margin:0 0 18px;
}
.page-content li{margin-bottom:6px;}

/* ---- ハイライトボックス ---- */
.highlight-box{
  background:var(--c-green-pale);border-left:4px solid var(--c-green);
  border-radius:0 var(--radius) var(--radius) 0;
  padding:20px 24px;margin:28px 0;
}
.highlight-box p{margin:0;font-size:14px;line-height:1.85;}

/* ---- CTAバナー ---- */
.page-cta{
  background:var(--c-green-dark);color:#fff;
  border-radius:var(--radius-lg);padding:40px;
  text-align:center;margin:56px 0 0;
}
.page-cta h3{font-size:20px;font-weight:700;margin:0 0 10px;}
.page-cta p{font-size:14px;color:rgba(255,255,255,.8);margin:0 0 24px;}
.page-cta .cta-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.page-cta .btn-white{
  background:#fff;color:var(--c-green-dark);border:none;
  padding:13px 28px;border-radius:var(--radius);font-weight:700;
  font-size:15px;text-decoration:none;display:inline-block;
  transition:opacity .2s;
}
.page-cta .btn-white:hover{opacity:.88;}
.page-cta .btn-outline-white{
  background:transparent;color:#fff;
  border:1.5px solid rgba(255,255,255,.6);
  padding:13px 28px;border-radius:var(--radius);font-weight:600;
  font-size:15px;text-decoration:none;display:inline-block;
  transition:border-color .2s;
}
.page-cta .btn-outline-white:hover{border-color:#fff;}

/* ---- サイドリンク（関連ページ） ---- */
.related-pages{
  border:1px solid var(--c-line);border-radius:var(--radius-lg);
  padding:28px;margin:48px 0 0;
}
.related-pages h4{
  font-size:13px;font-weight:700;color:var(--c-text-muted);
  letter-spacing:.08em;text-transform:uppercase;margin:0 0 16px;
}
.related-pages ul{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:10px;}
.related-pages ul li a{
  display:inline-block;font-size:13px;color:var(--c-green-dark);
  border:1px solid var(--c-green);border-radius:20px;
  padding:6px 14px;text-decoration:none;transition:background .2s,color .2s;
}
.related-pages ul li a:hover{background:var(--c-green);color:#fff;}

/* ---- 記事メタ ---- */
.article-meta{
  font-size:12px;color:var(--c-text-muted);
  display:flex;gap:16px;margin-bottom:32px;flex-wrap:wrap;
}

@media(max-width:768px){
  .page-hero{padding:56px 0 40px;}
  .page-body{padding:40px 0 60px;}
  .page-cta{padding:28px 20px;}
  .page-cta .cta-buttons{flex-direction:column;align-items:center;}
}