/* サブページ共通スタイル */

/* ページヒーロー（中央揃え・暖色グラデ） */
.page-hero { position: relative; padding: 88px 0 96px; background: linear-gradient(180deg,#FDF6E6 0%,#FBF7F1 70%,#FFFFFF 100%); overflow: clip; text-align: center; }
.page-hero .glow { position: absolute; top: -360px; left: 50%; transform: translateX(-50%); width: 1180px; height: 1180px; border-radius: 50%; background: radial-gradient(circle, rgba(246,194,74,.40), rgba(228,132,60,.12) 48%, transparent 66%); }
.page-hero .container { position: relative; }
.page-hero .char { width: 112px; margin: 0 auto 60px; }
.page-hero h1 { margin-top: 14px; font-size: clamp(30px, 4.2vw, 58px); font-weight: 900; line-height: 1.28; letter-spacing: -.02em; text-wrap: balance; }
.page-hero .lead { margin: 22px auto 0; font-size: 17px; color: #59544B; max-width: 34em; text-wrap: pretty; }
.page-hero .jump { display: flex; justify-content: center; gap: 12px; margin-top: 34px; flex-wrap: wrap; font-size: 13.5px; font-weight: 700; }
.page-hero .jump a { border: 1px solid #D6CDBE; border-radius: 999px; padding: 11px 20px; color: #4A463E; background: #fff; }
.page-hero .jump a:hover { border-color: #E4843C; color: #C0691F; }
.badge-c { display: flex; justify-content: center; }

/* セクション */
.sec { padding: 96px 0; }
.bg-white { background: #fff; }
.bg-cream { background: #FBF7F1; }
.bg-sand { background: #FAF7F2; }
.sec h2.h { margin-top: 12px; font-size: clamp(24px, 3vw, 38px); font-weight: 900; line-height: 1.35; letter-spacing: -.02em; }
.sec .lead { margin-top: 18px; font-size: 16px; color: #59544B; text-wrap: pretty; }

/* 汎用グリッド */
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 20px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 20px; }

/* カード */
.card { background: #fff; border: 1px solid #EAE3D8; border-radius: 20px; padding: 30px; }
.card-dark { background: #2B2E38; color: #fff; border-radius: 20px; padding: 30px; }
.card h3 { font-size: 16px; font-weight: 900; }
.card p, .card-dark p { margin-top: 10px; font-size: 14px; color: #6A645A; line-height: 1.9; text-wrap: pretty; }
.card-dark p { color: #C8C9CE; }

/* 数値カード */
.num-card { background: #fff; border: 1px solid #EAE3D8; border-radius: 16px; padding: 24px; }
.num-card .v { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: clamp(28px, 2.6vw, 44px); line-height: 1.15; color: #C0691F; white-space: nowrap; }
.num-card .v small { font-size: .5em; font-weight: 800; }
.num-card .l { margin-top: 8px; font-size: 14px; font-weight: 700; }
.num-card .dim { color: #948C80; font-weight: 500; }

/* ロゴセル */
.logo-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.logo-cell { height: 120px; border: 1px solid #EAE3D8; border-radius: 12px; background: #fff; padding: 22px; display: flex; align-items: center; justify-content: center; }
.logo-cell img { max-width: 100%; max-height: 100%; object-fit: contain; }
.logo-cell.placeholder { flex-direction: column; text-align: center; border-style: dashed; color: #A79E92; font-size: 14px; font-weight: 700; line-height: 1.6; }
.logo-cell.placeholder small { font-size: 11px; font-weight: 500; }

/* CTAバンド */
.cta-band-wrap { padding: 88px 0 96px; background: #fff; }
.cta-band { background: linear-gradient(120deg,#24262E 0%,#383C46 60%,#4B505C 100%); border-radius: 28px; padding: 60px; color: #fff; text-align: center; }
.cta-band .char { width: 112px; margin: 0 auto 60px; }
.cta-band h2 { font-size: clamp(26px, 3.2vw, 42px); font-weight: 900; line-height: 1.3; letter-spacing: -.02em; }
.cta-band p { margin: 18px auto 0; font-size: 16px; color: #C8C9CE; max-width: 34em; text-wrap: pretty; }
.cta-band .btns { display: flex; gap: 14px; justify-content: center; margin-top: 30px; flex-wrap: wrap; }
.btn-band-primary { display: inline-flex; align-items: center; justify-content: center; background: #E4843C; color: #fff; font-size: 16px; font-weight: 900; padding: 17px 32px; border-radius: 999px; transition: all .2s; }
.btn-band-primary:hover { background: #C0691F; color: #fff; }
.btn-band-ghost { display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 15px; font-weight: 700; padding: 17px 26px; border-radius: 999px; border: 1.5px solid rgba(255,255,255,.3); transition: all .2s; }
.btn-band-ghost:hover { border-color: #E4843C; color: #F6C74A; }

/* ノート */
.note { font-size: 12px; color: #A79E92; line-height: 1.8; }

/* about: 語り部 */
.st-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.9fr); gap: 64px; align-items: center; }
.st-cards { display: flex; flex-direction: column; gap: 14px; margin-top: 28px; }
.st-card { background: #FBF7F1; border: 1px solid #EAE3D8; border-radius: 16px; padding: 22px 24px; }
.st-card .t { font-size: 16px; font-weight: 900; }
.st-card .b { margin-top: 8px; font-size: 14px; color: #6A645A; line-height: 1.9; }
.st-visual { text-align: center; }
.st-visual img { width: min(380px, 80%); margin: 0 auto; }
.st-visual p { margin: 52px auto 0; font-size: 13px; color: #948C80; max-width: 26em; line-height: 1.9; }
/* about: 世代カード */
.gen-k { font-size: 12px; font-weight: 700; letter-spacing: .14em; color: #948C80; }
.gen-n { margin-top: 10px; font-size: 34px; font-weight: 800; line-height: 1; color: #E4843C; }
.gen-t { margin-top: 14px; font-size: 15px; font-weight: 900; }

/* ══ タブレット ══ */
@media (max-width: 1024px) {
  .grid-3, .grid-4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .st-grid { grid-template-columns: 1fr; gap: 44px; }
  .sec { padding: 72px 0; }
}

/* ══ スマホ ══ */
@media (max-width: 768px) {
  /* インライン指定の縦余白を圧縮（インラインstyleに勝つため!important） */
  section[style*="padding:72px"], section[style*="padding:76px"], section[style*="padding:80px"],
  section[style*="padding:84px"], section[style*="padding:88px"], section[style*="padding:96px"],
  section[style*="padding:100px"], section[style*="padding:104px"], section[style*="padding:112px"],
  section[style*="padding:116px"] { padding-top: 56px !important; padding-bottom: 56px !important; }
  [style*="padding-top:0"] { padding-top: 0 !important; }
  [style*="padding:0 0 96px"], [style*="padding:0 32px 96px"], [style*="padding:0 0 88px"] { padding-top: 0 !important; padding-bottom: 64px !important; }
  [style*="padding:96px 0 104px"] { padding-top: 56px !important; padding-bottom: 64px !important; }
  .page-hero[style] { padding-top: 52px !important; padding-bottom: 60px !important; }
  .page-hero { padding: 56px 0 64px; }
  .page-hero .char { width: 80px; margin-bottom: 36px; }
  .sec { padding: 56px 0; }
  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; gap: 14px; }
  .num-grid-m2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 12px; }
  .logo-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
  .logo-cell { height: 96px; padding: 16px; }
  .cta-band-wrap { padding: 56px 0 64px; }
  .cta-band { padding: 36px 24px; border-radius: 20px; }
  .cta-band .char { width: 84px; margin-bottom: 32px; }
  .cta-band .btns { flex-direction: column; }
}
