/* =========================================================================
   Cynthia / Nudge HQ コーポレート・サービスサイト
   基調＝モノクロ（白背景・黒/濃グレー・薄グレー区切り）／アクセント＝紫 #7c3aed
   アプリ本体（style.css の紫chrome）とは独立。site_base.html 専用。
   ========================================================================= */

:root{
  --ink:#161616;          /* 本文・見出しの黒 */
  --ink-soft:#3d3d3d;
  --muted:#737373;        /* 補足テキスト */
  --line:#e7e7e7;         /* 区切り線 */
  --line-soft:#f0f0f0;
  --bg:#ffffff;
  --bg-soft:#fafafa;      /* セクション交互背景 */
  --bg-dark:#141414;      /* フッター */
  --accent:#7c3aed;       /* Nudge HQ パープル（差し色） */
  --accent-dark:#6d28d9;
  --accent-soft:#f4ecff;
  --radius:14px;
  --container:1080px;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 8px 28px rgba(0,0,0,.05);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body.site-body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Inter","Noto Sans JP",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.75; font-size:16px; -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:var(--accent); text-decoration:none;}
a:hover{color:var(--accent-dark);}

.site-container{max-width:var(--container); margin:0 auto; padding:0 24px;}
.site-section{padding:72px 0;}
.site-section.alt{background:var(--bg-soft);}
.site-eyebrow{display:inline-block; font-size:.8rem; font-weight:700; letter-spacing:.04em;
  color:var(--accent); margin-bottom:12px;}
.site-h1{font-size:2.4rem; font-weight:800; line-height:1.3; letter-spacing:-.01em; margin:0 0 18px;}
.site-h2{font-size:1.8rem; font-weight:800; line-height:1.35; margin:0 0 14px;}
.site-h3{font-size:1.12rem; font-weight:700; margin:0 0 8px;}
.site-lead{font-size:1.12rem; color:var(--ink-soft); margin:0 0 18px;}
.site-muted{color:var(--muted);}
.site-small{font-size:.86rem;}
.site-accent{color:var(--accent);}
.site-center{text-align:center;}

/* ---- ボタン ---- */
.site-btn{display:inline-flex; align-items:center; gap:8px; justify-content:center;
  background:linear-gradient(135deg,#7c3aed 0%,#a05cf0 100%); color:#fff; border:1px solid transparent;
  font-weight:700; font-size:.98rem; padding:13px 26px; border-radius:12px;
  cursor:pointer; transition:.18s ease; text-align:center; box-shadow:0 10px 24px rgba(124,58,237,.34);}
.site-btn:hover{background:linear-gradient(135deg,#6d28d9 0%,#8b3ff0 100%); color:#fff; transform:translateY(-3px); box-shadow:0 18px 36px rgba(124,58,237,.46);}
.site-btn-ghost{background:transparent; color:var(--ink); border:1px solid var(--line); box-shadow:none;}
.site-btn-ghost:hover{background:transparent; color:var(--ink); border-color:var(--ink); transform:translateY(-1px); box-shadow:none;}
.site-btn-lg{padding:16px 34px; font-size:1.05rem;}
.site-cta-row{display:flex; gap:12px; flex-wrap:wrap; margin-top:8px;}
.site-cta-row.center{justify-content:center;}

/* ---- ヘッダー ---- */
.site-header{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid var(--line);}
.site-header-inner{display:flex; align-items:center; justify-content:space-between;
  height:66px; max-width:var(--container); margin:0 auto; padding:0 24px;}
.site-logo{display:flex; align-items:center; gap:10px; color:var(--ink); font-weight:800; font-size:1.2rem; letter-spacing:.02em;}
.site-logo img{height:30px; width:auto;}
.site-logo .site-logo-mark{width:28px; height:28px; flex:none;}
.site-nav{display:flex; align-items:center; gap:28px;}
.site-nav a{color:var(--ink-soft); font-weight:600; font-size:.95rem;}
.site-nav a:hover{color:var(--ink);}
.site-nav a.is-active{color:var(--accent);}
.site-nav .site-btn{padding:9px 18px; font-size:.9rem;
  background:#fff; color:var(--accent); border-color:var(--accent); box-shadow:0 4px 12px rgba(124,58,237,.14);}
.site-nav .site-btn:hover{background:#f3ebff; color:var(--accent); border-color:var(--accent); box-shadow:0 8px 18px rgba(124,58,237,.2);}
.site-nav-toggle{display:none; background:none; border:none; cursor:pointer; padding:8px;}
.site-nav-toggle span{display:block; width:22px; height:2px; background:var(--ink); margin:4px 0; transition:.2s;}

/* ---- ヒーロー（ファーストビューのみ 紫グラデ背景） ---- */
.site-hero{position:relative; overflow:hidden; padding:86px 0 64px; background:linear-gradient(135deg,#8e2de2 0%,#4a00e0 100%); color:#fff;}
/* 装飾①：ドット模様（右上中心、左下へフェード＝見出しに被らない） */
.site-hero::before{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.42) 2px, transparent 2.3px);
  background-size:22px 22px;
  -webkit-mask-image:radial-gradient(135% 105% at 100% 0%, #000 0%, rgba(0,0,0,.5) 55%, transparent 80%);
          mask-image:radial-gradient(135% 105% at 100% 0%, #000 0%, rgba(0,0,0,.5) 55%, transparent 80%);}
/* 装飾②：柔らかい光のにじみ（ブロブ） */
.site-hero::after{content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(closest-side at 90% 10%, rgba(255,255,255,.22), transparent),
    radial-gradient(closest-side at 4% 98%, rgba(168,85,247,.45), transparent),
    radial-gradient(closest-side at 62% 116%, rgba(255,255,255,.12), transparent);}
.site-hero > *{position:relative; z-index:1;}
.site-hero .site-h1{font-size:clamp(1.45rem,6.6vw,2.8rem); color:#fff; word-break:keep-all;}
/* eyebrow：背景が透けるアウトライン文字（写真のCREATE FUTURE風の中抜き）。大きめで存在感を出す */
.site-hero .site-eyebrow{color:#fff; -webkit-text-stroke:0;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif; font-weight:800;
  font-size:clamp(1rem,4.2vw,2rem); letter-spacing:.02em; line-height:1.25;
  white-space:nowrap; margin-bottom:14px;}
/* サブコピーは実績テキスト（.site-hero-note）と同程度の小サイズに */
.site-hero .site-lead{color:#f3ebff; font-size:.92rem; font-weight:600;}
.site-hero .site-muted{color:#e2d4fb;}
.site-hero .site-accent{color:#fff;}
.site-hero-note{font-size:.9rem; color:#e2d4fb; margin:18px 0 0;}
.site-hero-note strong{color:#fff;}
/* ヒーロー内ボタン：主＝白地に紫文字／副＝白枠白文字の透明 */
.site-hero .site-btn{background:#fff; color:#4a00e0; border-color:#fff; box-shadow:0 12px 30px rgba(0,0,0,.26);}
.site-hero .site-btn:hover{background:#f3ebff; color:#4a00e0; border-color:#f3ebff; box-shadow:0 20px 44px rgba(0,0,0,.34);}
.site-hero .site-btn-ghost{background:transparent; color:#fff; border-color:rgba(255,255,255,.75); box-shadow:none;}
.site-hero .site-btn-ghost:hover{background:rgba(255,255,255,.14); color:#fff; border-color:#fff; box-shadow:none;}
/* 製品写真カードは白〜薄グレーでグラデ上に浮かせる */
.site-hero .site-photo{background:linear-gradient(150deg,#ffffff 0%,#f5f0fd 100%); border-color:rgba(255,255,255,.7); box-shadow:0 18px 44px rgba(0,0,0,.22);}

/* ---- 信頼バー ---- */
.site-trust{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--bg-soft);}
.site-trust .site-container{padding-top:26px; padding-bottom:26px;}

/* ---- 入り口カード ---- */
.site-grid{display:grid; gap:22px;}
.site-grid.cols-3{grid-template-columns:repeat(3,1fr);}
.site-grid.cols-2{grid-template-columns:repeat(2,1fr);}
.site-card{background:var(--bg); border:1px solid var(--line); border-radius:var(--radius);
  padding:28px; transition:.18s;}
.site-card:hover{box-shadow:var(--shadow); transform:translateY(-3px); border-color:#dcdcdc;}
.site-card .site-card-link{display:inline-flex; align-items:center; gap:6px; font-weight:700; margin-top:10px;}
.site-card-num{font-size:.82rem; font-weight:700; color:var(--accent); letter-spacing:.05em;}

/* ---- ステップ ---- */
.site-step{display:flex; gap:18px; align-items:flex-start; padding:20px 0; border-bottom:1px solid var(--line-soft);}
.site-step:last-child{border-bottom:none;}
.site-step-no{flex:none; width:42px; height:42px; border-radius:50%; background:var(--accent-soft);
  color:var(--accent); font-weight:800; display:flex; align-items:center; justify-content:center;}

/* ---- 導入の流れ：ステップ別カード（番号バッジ付き） ---- */
/* 導入の流れ：STEPバッジ＋塗りカード＋カード間の「>」 */
.site-stepflow{display:flex; align-items:stretch; justify-content:center; gap:10px; margin-top:52px;}
.step-card{flex:1; position:relative; background:#f4f0fc; border-radius:14px;
  padding:48px 22px 26px; text-align:center;}
.step-badge{position:absolute; top:-28px; left:50%; transform:translateX(-50%);
  width:64px; height:64px; border-radius:50%; background:linear-gradient(135deg,#7c3aed,#a05cf0); color:#fff;
  display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1;
  box-shadow:0 8px 18px rgba(124,58,237,.34);}
.step-badge .lbl{font-size:.58rem; font-weight:800; letter-spacing:.14em; opacity:.92;}
.step-badge .no{font-size:1.34rem; font-weight:900; margin-top:3px;}
.step-card h3{margin:6px 0 10px; font-size:1.12rem; color:var(--ink);}
.step-card p{margin:0; color:var(--muted); font-size:.9rem; line-height:1.7;}
.step-sep{display:flex; align-items:center; justify-content:center; flex:none; color:var(--accent);}
.step-sep svg{width:15px; height:22px;}
@media (max-width:760px){
  .site-stepflow{flex-direction:column; gap:34px;}
  .step-sep{transform:rotate(90deg);}
}

/* ---- 他サービスとの比較表 ---- */
.cmp-wrap{margin-top:34px; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:6px 2px 4px;}
.cmp-table{width:100%; min-width:780px; border-collapse:separate; border-spacing:0; text-align:center;}
.cmp-table th, .cmp-table td{padding:16px 14px; vertical-align:middle;}
.cmp-table thead th{font-size:1rem; font-weight:800; color:var(--ink); border-bottom:1px solid var(--line);}
.cmp-corner{background:transparent; border-bottom:none !important;}
.cmp-rowlabel{background:#f3f3f6; font-weight:800; color:var(--ink); font-size:.95rem;
  white-space:nowrap; border-bottom:2px solid #fff; width:120px;}
.cmp-table tbody td{border-bottom:1px solid var(--line); font-weight:700; color:var(--ink); min-width:165px;}
.cmp-table tbody tr:last-child td{border-bottom:none;}
.cmp-r{display:block; font-size:.78rem; font-weight:500; color:var(--muted); margin-top:7px; line-height:1.55;}
.sym{display:inline-block; font-size:1.5rem; font-weight:800; line-height:1;}
.sym-best{color:var(--accent);}
.sym-good{color:#5a6473;}
.sym-part{color:#9aa0aa;}
.sym-no{color:#c0c0c8;}
/* 自社列（Nudge HQ）の強調＝紫の枠＋紫ヘッダー */
.cmp-table thead th.is-primary{background:linear-gradient(135deg,#7c3aed,#a05cf0); color:#fff;
  border:2px solid var(--accent); border-bottom:none;
  border-top-left-radius:12px; border-top-right-radius:12px;}
.cmp-table td.is-primary{background:#f7f3ff; border-left:2px solid var(--accent); border-right:2px solid var(--accent);}
.cmp-table tbody tr:last-child td.is-primary{border-bottom:2px solid var(--accent);
  border-bottom-left-radius:12px; border-bottom-right-radius:12px;}
.cmp-note-foot{margin:14px 0 0; font-size:.8rem; color:var(--muted); text-align:center;}

/* ---- 見出しの英字透かし（汎用） ---- */
.head-wm{position:relative; text-align:center; padding:18px 0 4px;}
.head-wm .wm-text{position:absolute; left:50%; top:44%; transform:translate(-50%,-50%); z-index:0;
  font-size:clamp(3rem,10vw,6rem); font-weight:900; letter-spacing:.12em; white-space:nowrap;
  color:transparent; -webkit-text-stroke:1.4px rgba(124,58,237,.16); pointer-events:none;}
.head-wm .site-h2{position:relative; z-index:1; margin:0;}
.price-cards{display:grid; grid-template-columns:repeat(2,1fr); gap:24px; max-width:820px; margin:30px auto 0;}
.price-card{display:flex; flex-direction:column; background:#fff; border-radius:18px;
  padding:32px 32px 28px; box-shadow:var(--shadow);}
.price-card .pc-label{font-size:1.1rem; font-weight:800; color:var(--ink); margin:0 0 20px;}
.price-card .pc-sub{font-size:.9rem; color:var(--muted); margin:0 0 6px;}
.price-card .pc-amount{font-size:2.7rem; font-weight:900; color:var(--ink); line-height:1.05; margin:0;}
.price-card .pc-amount .accent{color:var(--accent);}
.price-card .pc-amount .per{font-size:1.1rem; font-weight:700; color:var(--muted); margin-left:2px;}
.price-card .pc-desc{font-size:.86rem; color:var(--muted); margin:12px 0 0; line-height:1.7;}
.price-card .pc-pill{background:#f4f1fb; border-radius:12px; padding:15px 16px; text-align:center;
  font-size:.85rem; color:var(--muted); margin:18px 0 0;}
.price-card .pc-foot{margin:18px 0 0; padding-top:16px; border-top:1px solid var(--line-soft);
  text-align:center; font-size:.85rem; font-weight:700; color:var(--ink);}
.price-card .pc-foot:first-of-type{margin-top:auto;}
@media (max-width:680px){ .price-cards{grid-template-columns:1fr;} }

/* ---- 新着情報（お知らせ・参考デザイン：左見出し＋右リスト＋黒ピル） ---- */
.news-block{display:grid; grid-template-columns:210px 1fr; gap:44px; align-items:start;
  background:#fff; border-radius:20px; padding:44px 48px; box-shadow:var(--shadow); max-width:940px; margin:0 auto;}
.news-aside{text-align:left;}
.news-aside-icon{display:inline-flex; color:var(--accent);}
.news-aside-icon svg{width:64px; height:64px;}
.news-aside-title{font-size:1.5rem; font-weight:900; color:var(--ink); line-height:1.45; margin:16px 0 8px;}
.news-aside-en{font-size:.78rem; font-weight:800; letter-spacing:.22em; color:var(--accent);}
.news-main{min-width:0;}
.news-list{list-style:none; padding:0; margin:0;}
.news-item{border-bottom:1px solid var(--line);}
.news-item:first-child .news-row{padding-top:2px;}
.news-row{display:block; padding:16px 2px; color:var(--ink);}
.news-row:hover .news-title{color:var(--accent);}
.news-meta{display:flex; align-items:center; gap:12px; margin-bottom:6px;}
.news-date{font-size:.92rem; font-weight:800; color:var(--ink); letter-spacing:.02em;}
.news-badge{font-size:.72rem; font-weight:700; color:var(--accent); border:1px solid var(--accent);
  border-radius:5px; padding:2px 12px; white-space:nowrap;}
.news-title{display:block; font-size:.95rem; font-weight:600; color:var(--ink-soft); line-height:1.65;}
.news-ext{color:var(--muted); font-weight:700;}
.news-allbtn-wrap{text-align:center; margin-top:28px;}
.news-allbtn{display:inline-flex; align-items:center; gap:16px; background:var(--ink); color:#fff;
  border-radius:999px; padding:15px 22px 15px 36px; font-weight:700; font-size:.95rem; letter-spacing:.04em;
  box-shadow:0 12px 26px rgba(0,0,0,.18);}
.news-allbtn:hover{color:#fff; transform:translateY(-2px); box-shadow:0 18px 34px rgba(0,0,0,.24);}
.news-allbtn-arrow{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px;
  border-radius:50%; background:var(--accent); color:#fff;}
.news-allbtn-arrow svg{width:9px; height:13px;}
@media (max-width:680px){
  .news-block{grid-template-columns:1fr; gap:24px; padding:34px 26px;}
  .news-aside{text-align:center;}
}

/* ---- 代表挨拶（写真＋縦書きタグライン） ---- */
.ceo-visual{position:relative; max-width:460px; margin:0 auto;}
.ceo-photo{position:relative; aspect-ratio:3/4; border-radius:16px; overflow:hidden;
  background:linear-gradient(135deg,#ece7f9,#f5f1fc);}
.ceo-photo img{width:100%; height:100%; object-fit:cover; object-position:center 22%; display:block;}
.ceo-photo-ph{display:none; align-items:center; justify-content:center; width:100%; height:100%;
  color:var(--muted); font-size:.95rem; font-weight:700;}
.ceo-taglines{position:absolute; left:18px; bottom:-28px; display:flex; flex-direction:column;
  gap:12px; align-items:flex-start;}
.ceo-tag{font-family:"Noto Sans JP",sans-serif; font-weight:800;
  font-size:1.05rem; letter-spacing:.1em; line-height:1.4; color:#fff;
  background:linear-gradient(135deg,#5b21b6,#3c1a8c); padding:14px 26px; border-radius:8px;
  box-shadow:0 14px 30px rgba(60,26,140,.32); white-space:nowrap;}
.ceo-tag:nth-child(2){margin-left:30px;}
.ceo-tag:nth-child(3){margin-left:60px;}
.ceo-body{max-width:760px; margin:66px auto 0;}
.ceo-text{margin-top:22px;}
.ceo-text p{color:var(--ink-soft); line-height:2; margin:0 0 18px;}
.ceo-lead{font-size:1.3rem; font-weight:800; color:var(--ink) !important; line-height:1.7; margin:0 0 20px !important;}
.ceo-sign{text-align:right; margin-top:26px !important;}
.ceo-sign-role{display:block; font-size:.85rem; color:var(--muted); margin-bottom:2px;}
.ceo-sign strong{font-size:1.15rem; color:var(--ink); letter-spacing:.08em;}
@media (max-width:680px){
  .ceo-taglines{left:10px; bottom:-22px; gap:8px;}
  .ceo-tag{font-size:.86rem; padding:11px 18px; letter-spacing:.06em;}
  .ceo-tag:nth-child(2){margin-left:18px;}
  .ceo-tag:nth-child(3){margin-left:36px;}
  .ceo-body{margin-top:56px;}
}

/* ---- 常時フロートCTA（サービスサイト：資料請求＋無料トライアル） ---- */
.site-floats{position:fixed; right:24px; bottom:24px; z-index:80;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px;}
.site-float{display:inline-flex; align-items:center; gap:9px; font-weight:800; font-size:.96rem;
  padding:13px 24px; border-radius:999px; cursor:pointer; font-family:inherit;}
.site-float .stf-icon{display:inline-flex;}
.site-float .stf-icon svg{width:19px; height:19px;}
.site-float-trial{color:#fff; background:linear-gradient(135deg,#7c3aed,#a05cf0);
  box-shadow:0 16px 38px rgba(124,58,237,.46);}
.site-float-trial:hover{color:#fff; transform:translateY(-3px); box-shadow:0 22px 48px rgba(124,58,237,.56);}
.site-float-trial .stf-icon{animation:stf-poke 1.7s ease-in-out infinite;}
.site-float-doc{color:var(--accent); background:#fff; border:1.5px solid var(--accent);
  box-shadow:0 10px 26px rgba(124,58,237,.2);}
.site-float-doc:hover{color:var(--accent); background:#f6f1ff; transform:translateY(-2px);}
/* 人差し指が「ちょんちょん」とつつく（Nudge＝つつく の演出） */
@keyframes stf-poke{
  0%,42%,100%{transform:translateY(0);}
  12%{transform:translateY(-4px);}
  21%{transform:translateY(0);}
  30%{transform:translateY(-4px);}
  39%{transform:translateY(0);}
}
@media (prefers-reduced-motion:reduce){ .site-float-trial .stf-icon{animation:none;} }
@media (max-width:600px){
  .site-floats{right:14px; bottom:14px; gap:9px;}
  .site-float{font-size:.9rem; padding:11px 18px;}
}
/* 資料DLモーダル */
.site-docmodal{position:fixed; inset:0; z-index:120; display:flex; align-items:center; justify-content:center;
  padding:20px; background:rgba(22,14,42,.55);}
.site-docmodal[hidden]{display:none;}
.site-docmodal-card{position:relative; width:100%; max-width:420px; background:#fff; border-radius:18px;
  padding:34px 32px 30px; box-shadow:0 30px 70px rgba(0,0,0,.35);}
.site-docmodal-card h3{margin:0 0 10px; font-size:1.25rem; color:var(--ink);}
.site-docmodal-card p{margin:0 0 16px;}
.site-docmodal-card input[type=email]{width:100%; box-sizing:border-box; padding:13px 14px;
  border:1px solid var(--line); border-radius:10px; font-size:16px; margin:0 0 12px;}
.site-docmodal-card input[type=email]:focus{outline:none; border-color:var(--accent);}
.site-docmodal-close{position:absolute; top:8px; right:14px; background:none; border:none;
  font-size:1.7rem; line-height:1; color:var(--muted); cursor:pointer;}
.site-docmodal-err{color:#b91c1c; font-size:.85rem; margin:0 0 10px !important;}

/* ---- 会社概要（白カード＋ラベル｜値テーブル） ---- */
.company-head{max-width:840px; margin:0 auto;}
.company-en{font-size:2.2rem; font-weight:900; color:var(--ink); margin:0; letter-spacing:.02em; line-height:1.2;}
.company-card{background:#fff; border-radius:18px; box-shadow:var(--shadow);
  max-width:840px; margin:26px auto 0; padding:36px 48px;}
.company-table{margin:0;}
.ct-row{display:flex; align-items:flex-start; padding:18px 0; border-bottom:1px solid var(--line-soft);}
.ct-row:last-child{border-bottom:none;}
.ct-row dt{flex:none; width:150px; font-weight:800; color:var(--ink); font-size:.95rem;
  padding-right:26px; margin-right:26px; border-right:1px solid var(--line);
  text-align:justify; text-align-last:justify;}
.ct-row dd{margin:0; color:var(--ink-soft); font-size:.95rem; line-height:1.9;}
.company-note{margin-top:26px; border:1px solid var(--line); border-radius:12px;
  padding:16px 20px; background:var(--bg-soft);}
.company-note p{margin:0; font-size:.86rem; color:var(--muted); line-height:1.7;}
.company-note a{color:var(--accent); font-weight:700;}
@media (max-width:680px){
  .company-card{padding:26px 22px;}
  .ct-row{flex-direction:column; gap:6px;}
  .ct-row dt{width:auto; border-right:none; margin-right:0; padding-right:0; text-align-last:left; color:var(--accent);}
}
/* 一覧ページ：絞り込みチップ */
.news-filter{display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin:26px 0 8px;}
.news-chip{font-size:.85rem; font-weight:700; color:var(--ink-soft); border:1px solid var(--line);
  border-radius:999px; padding:7px 16px;}
.news-chip:hover{border-color:var(--accent); color:var(--accent);}
.news-chip.is-on{background:var(--accent); border-color:var(--accent); color:#fff;}
/* 一覧ページ：記事 */
.news-articles{max-width:760px; margin:18px auto 0;}
.news-article{padding:24px 4px; border-bottom:1px solid var(--line);}
.news-article .na-meta{display:flex; align-items:center; gap:14px; margin-bottom:10px;}
.news-article .na-title{margin:0 0 8px; font-size:1.12rem; font-weight:800; color:var(--ink); line-height:1.5;}
.news-article .na-body{margin:0; color:var(--muted); font-size:.92rem; line-height:1.8;}
.news-article .na-link{display:inline-block; margin-top:10px; font-weight:700; color:var(--accent); font-size:.9rem;}
@media (max-width:560px){
  .news-row{flex-wrap:wrap; gap:6px 12px;}
  .news-title{flex:1 1 100%;}
}

/* ---- 数字の強調 ---- */
.site-stat{font-size:2.6rem; font-weight:900; color:var(--accent); line-height:1;}

/* ---- 料金強調ブロック ---- */
.site-price-block{border:2px solid var(--accent); border-radius:var(--radius); padding:34px;
  background:linear-gradient(180deg,#fff 0%,var(--accent-soft) 100%); text-align:center;}
.site-price-zero{font-size:2.2rem; font-weight:900; color:var(--ink);}
.site-price-amount{font-size:2.6rem; font-weight:900; color:var(--accent); margin:6px 0;}
.site-price-amount small{font-size:1rem; color:var(--muted); font-weight:600;}

/* ---- リスト（おすすめ等） ---- */
.site-checklist{list-style:none; padding:0; margin:0; display:grid; gap:14px;}
.site-checklist li{display:flex; gap:12px; align-items:flex-start;}
.site-checklist .ck{flex:none; color:var(--accent); font-weight:800;}

/* ---- 代表者・会社概要 ---- */
.site-dl{display:grid; grid-template-columns:160px 1fr; gap:0; border-top:1px solid var(--line);}
.site-dl dt{padding:14px 0; border-bottom:1px solid var(--line-soft); font-weight:700; color:var(--ink-soft);}
.site-dl dd{padding:14px 0; border-bottom:1px solid var(--line-soft); margin:0;}
.site-quote{border-left:3px solid var(--accent); padding:4px 0 4px 20px; color:var(--ink-soft);}

/* ---- メディアリンク ---- */
.site-media{display:flex; flex-wrap:wrap; gap:10px 22px;}
.site-media a{color:var(--ink-soft); font-weight:600; border-bottom:1px solid transparent;}
.site-media a:hover{color:var(--accent); border-bottom-color:var(--accent);}

/* ---- フォーム ---- */
.site-form{display:grid; gap:16px; max-width:560px;}
.site-form label{display:flex; flex-direction:column; gap:6px; font-weight:600; font-size:.92rem;}
.site-form input,.site-form select,.site-form textarea{
  font:inherit; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink);}
.site-form input:focus,.site-form select:focus,.site-form textarea:focus{
  outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);}
.site-form textarea{min-height:130px; resize:vertical;}

/* ---- フラッシュ ---- */
.site-flash{max-width:var(--container); margin:18px auto 0; padding:0 24px;}
.site-flash .msg{padding:14px 18px; border-radius:10px; font-weight:600;}
.site-flash .ok{background:var(--accent-soft); color:var(--accent-dark); border:1px solid #e3d3ff;}
.site-flash .err{background:#fdecec; color:#b3261e; border:1px solid #f5c2c0;}

/* ---- フッター ---- */
.site-footer{background:linear-gradient(90deg,#0a0a0a 0%,#242424 50%,#0a0a0a 100%); color:#cfcfcf; padding:54px 0 30px; margin-top:0;}
.site-footer a{color:#cfcfcf;}
.site-footer a:hover{color:#fff;}
.site-footer-top{display:flex; flex-wrap:wrap; justify-content:space-between; gap:32px;}
.site-footer h4{color:#fff; font-size:.92rem; margin:0 0 12px;}
.site-footer ul{list-style:none; padding:0; margin:0; display:grid; gap:8px; font-size:.9rem;}
.site-footer-brand{max-width:300px;}
.site-footer-brand .site-logo{color:#fff;}
.site-footer-copy{border-top:1px solid #2a2a2a; margin-top:34px; padding-top:20px; font-size:.82rem; color:#8a8a8a;}

/* ---- 画面イメージ プレースホルダー（後日スクショ差し込み） ---- */
.site-shot{position:relative; border:1px dashed #cdb8f0; border-radius:14px;
  background:repeating-linear-gradient(45deg,#fbf9ff,#fbf9ff 14px,#f4ecff 14px,#f4ecff 28px);
  min-height:240px; display:flex; align-items:center; justify-content:center;
  color:var(--accent); font-weight:700; font-size:.9rem; text-align:center; padding:24px; box-shadow:var(--shadow);}
.site-shot.tall{min-height:340px;}
.site-shot .tag{position:absolute; top:10px; left:14px; font-size:.7rem; color:#a78bfa; font-weight:700; letter-spacing:.05em;}
.site-shot img{width:100%; height:auto; border-radius:12px; display:block;}

/* ---- ファーストビュー写真プレースホルダー（後日、人物写真を差し込み） ---- */
.site-photo{position:relative; border-radius:20px; min-height:300px; padding:24px;
  background:linear-gradient(150deg,#f6f1ff 0%,#eef2ff 100%); border:1px solid #ece5fb;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; box-shadow:var(--shadow);}
.site-photo .site-illus{width:min(78%,300px); height:auto;}
.site-photo .cap{font-size:.74rem; color:#a78bfa; font-weight:700; letter-spacing:.04em;}
.site-photo img{width:100%; height:auto; border-radius:16px; display:block;}

/* ---- ヒーローの製品モックアップ（ノートPC＋タブレット＋スマホが白い円から飛び出す） ---- */
.hero-devices{position:relative; width:100%;}
/* 背面の白い円＝透過PNGの境界をカモフラージュ＋『円から飛び出す』演出のステージ */
.hero-circle{position:absolute; left:50%; top:42%; transform:translate(-50%,-50%);
  width:96%; aspect-ratio:1 / 1; border-radius:50%;
  background:#ffffff;
  box-shadow:0 26px 60px rgba(20,10,50,.28); z-index:0;}
.hero-devices .dev{height:auto; filter:drop-shadow(0 18px 34px rgba(20,10,50,.42));}
.hero-devices .dev-laptop{position:relative; display:block; width:76%; margin:24% auto 10%; z-index:2;}
.hero-devices .dev-tablet{position:absolute; top:-13%; left:-3%; width:40%; z-index:1; transform:rotate(14deg);}
.hero-devices .dev-phone{position:absolute; top:-10%; right:0; width:25%; z-index:1; transform:rotate(7deg);}
@media (max-width:760px){
  .hero-devices{max-width:500px; margin:0 auto;}
}

/* ---- 手描き風イラスト／アイコン共通 ---- */
.site-illus{display:block;}
.art-mark{width:20px; height:20px; flex:none;}
.art-step-ic{width:54px; height:54px; flex:none; border-radius:16px; background:var(--accent-soft);
  display:flex; align-items:center; justify-content:center; color:var(--accent);}
.art-step-ic svg{width:30px; height:30px;}
.site-ba .panel .ba-illus{width:120px; height:auto; display:block; margin:0 0 14px;}

/* ---- 実績数字セクション ---- */
.site-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.site-stat-card{border:1px solid var(--line); border-radius:var(--radius); padding:30px 22px; text-align:center; background:#fff;}
.site-stat-card .num{font-size:2.8rem; font-weight:900; color:var(--accent); line-height:1;}
.site-stat-card .lbl{margin-top:10px; color:var(--ink-soft); font-weight:600; font-size:.92rem;}
.site-stat-card .sub{margin-top:4px; color:var(--muted); font-size:.78rem;}
.site-ring{display:block; margin:0 auto;}
.site-ring text{font-weight:900;}

/* ---- 機能ジグザグ ---- */
.site-feature{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center; padding:34px 0; border-bottom:1px solid var(--line-soft);}
.site-feature:last-child{border-bottom:none;}
.site-feature .fimg{order:2;}
.site-feature.rev .fimg{order:0;}
.site-feature .fnum{display:block; font-size:clamp(3.4rem,7vw,5rem); font-weight:900; color:var(--accent);
  line-height:.85; letter-spacing:.01em; margin-bottom:10px;}
.site-feature .ftext .site-h3{font-size:1.35rem; margin-bottom:10px;}

/* ---- できること（番号＋アイコンのカード） ---- */
.feature-cards{display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:34px;}
.feature-card{position:relative; background:#fff; border:1px solid #ece5fb; border-radius:18px;
  padding:26px 30px 28px; box-shadow:var(--shadow);}
.fc-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;}
.fc-num{font-size:3.4rem; font-weight:900; color:var(--accent); line-height:.85; letter-spacing:.01em;}
.fc-icon{display:inline-flex; color:var(--accent);}
.fc-icon svg{width:52px; height:52px;}
.feature-card .site-h3{font-size:1.2rem; margin-bottom:8px;}
.feature-card .site-muted{font-size:.95rem; margin:0;}
@media (max-width:680px){ .feature-cards{grid-template-columns:1fr;} }

/* ---- フロー図 ---- */
.site-flow{display:flex; align-items:stretch; gap:0; flex-wrap:nowrap; margin-top:8px;}
.site-flow .fstep{flex:1; text-align:center; padding:10px 6px;}
.site-flow .ic{width:60px; height:60px; margin:0 auto 14px; border-radius:16px; background:var(--accent-soft);
  display:flex; align-items:center; justify-content:center; color:var(--accent);}
.site-flow .ic svg{width:28px; height:28px;}
.site-flow .fstep .st{font-weight:700; font-size:.96rem;}
.site-flow .fstep .sd{font-size:.8rem; color:var(--muted); margin-top:5px; line-height:1.6;}
.site-flow .farrow{flex:0 0 30px; display:flex; align-items:center; justify-content:center; color:#cdb8f0;}
.site-flow .farrow svg{width:22px; height:22px;}

/* ---- 課題（お悩みカード）→ 解決 ---- */
.worry-band{background:linear-gradient(180deg,#f6f1ff 0%,#efe9fd 100%);}
.site-worries{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:44px;}
.worry-card{position:relative; background:#fff; border:1px solid #ece5fb; border-radius:18px;
  padding:28px 22px 26px; text-align:center; box-shadow:var(--shadow);}
.worry-art{display:flex; align-items:flex-end; justify-content:center; height:120px; margin-bottom:14px;}
.worry-art img{max-width:130px; max-height:120px; width:auto; height:auto;}
.worry-ic{display:inline-flex; align-items:center; justify-content:center; width:58px; height:58px;
  border-radius:16px; background:#f1ebfd; color:var(--accent); margin-bottom:16px;}
.worry-ic svg{width:28px; height:28px;}
.worry-bubble{position:absolute; top:-28px; left:50%; transform:translateX(-50%); display:flex; gap:5px; align-items:flex-end;}
.worry-bubble i{display:block; background:#fff; border:1px solid #ece5fb; border-radius:50%;}
.worry-bubble i:nth-child(1){width:8px; height:8px;}
.worry-bubble i:nth-child(2){width:12px; height:12px;}
.worry-bubble i:nth-child(3){width:20px; height:20px;}
.worry-illus{display:flex; justify-content:center; margin-bottom:14px;}
.worry-illus svg, .worry-illus img{width:140px; height:auto;}
.worry-card p{margin:0; color:var(--ink-soft); font-weight:600; font-size:.95rem; line-height:1.8;}
.worry-arrow{text-align:center; color:var(--accent); margin:40px 0 0;}
.worry-arrow svg{width:48px; height:30px;}
.worry-solution{position:relative; max-width:780px; margin:28px auto 0; text-align:center;
  background:#fff; border:2px solid var(--accent); border-radius:24px;
  padding:32px 36px 30px; box-shadow:0 26px 60px rgba(124,58,237,.20);}
.worry-solution-tag{display:inline-block; background:linear-gradient(135deg,#7c3aed 0%,#a05cf0 100%);
  color:#fff; font-weight:800; font-size:.78rem; letter-spacing:.14em; padding:7px 18px;
  border-radius:999px; margin-bottom:16px; box-shadow:0 8px 18px rgba(124,58,237,.32);}
.worry-solution .lead{font-size:clamp(1.4rem,4.6vw,2rem); font-weight:900; line-height:1.4; margin:0;}
[data-reveal].reveal{opacity:0; transform:translateY(90px); will-change:transform,opacity,box-shadow;}
[data-reveal].reveal.in{animation:worry-pop 1.6s cubic-bezier(.16,.84,.44,1) forwards;}
/* 残像は box-shadow で「枠（箱）」にだけ＝文字はシャープなまま。下方向に紫のゴーストが尾を引く。 */
@keyframes worry-pop{
  0%{opacity:0; transform:translateY(90px);
     box-shadow:0 26px 14px rgba(124,58,237,.26), 0 52px 22px rgba(124,58,237,.14), 0 26px 60px rgba(124,58,237,.20);}
  40%{opacity:1;
     box-shadow:0 20px 12px rgba(124,58,237,.20), 0 40px 18px rgba(124,58,237,.10), 0 26px 60px rgba(124,58,237,.20);}
  62%{opacity:1; transform:translateY(-24px);
     box-shadow:0 8px 6px rgba(124,58,237,.08), 0 16px 9px rgba(124,58,237,.04), 0 26px 60px rgba(124,58,237,.20);}
  78%{transform:translateY(10px);
     box-shadow:0 0 0 rgba(124,58,237,0), 0 0 0 rgba(124,58,237,0), 0 26px 60px rgba(124,58,237,.20);}
  90%{transform:translateY(-5px);
     box-shadow:0 0 0 rgba(124,58,237,0), 0 0 0 rgba(124,58,237,0), 0 26px 60px rgba(124,58,237,.20);}
  100%{opacity:1; transform:translateY(0);
     box-shadow:0 0 0 rgba(124,58,237,0), 0 0 0 rgba(124,58,237,0), 0 26px 60px rgba(124,58,237,.20);}
}
@media (prefers-reduced-motion:reduce){
  [data-reveal].reveal,[data-reveal].reveal.in{opacity:1; transform:none; animation:none;}
}
.worry-solution-list{list-style:none; padding:0; display:grid; grid-template-columns:repeat(2,auto);
  justify-content:center; width:fit-content; gap:16px 34px; text-align:left; margin:28px auto 0;
  font-weight:700; color:var(--ink); font-size:1.04rem;}
.worry-solution-list li{display:flex; gap:12px; align-items:center;}
.worry-solution-list .ck{flex:none; color:var(--accent); display:inline-flex;}
.worry-solution-list .ck svg{width:24px; height:24px;}
@media (max-width:960px){
  .site-worries{grid-template-columns:repeat(2,1fr); gap:18px;}
}
@media (max-width:520px){
  .site-worries{grid-template-columns:1fr; gap:16px;}
  .worry-solution-list{grid-template-columns:1fr;}
}

/* ---- before / after 対比 ---- */
.site-ba{display:grid; grid-template-columns:1fr 64px 1fr; align-items:stretch; margin-top:8px;}
.site-ba .panel{border:1px solid var(--line); border-radius:var(--radius); padding:28px;}
.site-ba .before{background:var(--bg-soft);}
.site-ba .after{border-color:var(--accent); background:linear-gradient(180deg,#fff,#f4ecff);}
.site-ba .vs{display:flex; align-items:center; justify-content:center; color:var(--accent); font-weight:900; font-size:1.5rem;}
.site-ba h4{margin:0 0 14px; font-size:1.06rem;}
.site-ba ul{list-style:none; padding:0; margin:0; display:grid; gap:10px; font-size:.92rem; color:var(--ink-soft);}
.site-ba li{display:flex; gap:8px; align-items:flex-start;}
.site-ba .mk{flex:none; font-weight:800;}
.site-ba .before .mk{color:#b0b0b0;}
.site-ba .after .mk{color:var(--accent);}

/* ---- FAQ ---- */
.site-faq{max-width:760px;}
.site-faq details{border-bottom:1px solid var(--line); padding:18px 0;}
.site-faq summary{cursor:pointer; font-weight:700; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:16px;}
.site-faq summary::-webkit-details-marker{display:none;}
.site-faq summary::after{content:"＋"; color:var(--accent); font-size:1.1rem; font-weight:700; flex:none;}
.site-faq details[open] summary::after{content:"－";}
.site-faq .ans{margin-top:12px; color:var(--ink-soft); font-size:.92rem;}

/* ---- メディア掲載ティッカー（媒体名が流れる） ---- */
.site-ticker{overflow:hidden; position:relative; padding:6px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);}
.site-ticker-track{display:flex; width:max-content; animation:site-marquee 30s linear infinite;}
.site-ticker:hover .site-ticker-track{animation-play-state:paused;}
.site-ticker .item{display:inline-flex; align-items:center; gap:20px; padding:0 20px;
  color:var(--ink-soft); font-weight:700; white-space:nowrap; font-size:1rem;}
.site-ticker .dot{width:6px; height:6px; border-radius:50%; background:var(--accent); display:inline-block;}
@keyframes site-marquee{from{transform:translateX(0);} to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.site-ticker-track{animation:none;}}

/* ---- 導入企業ロゴ帯（後日差し込み） ---- */
.site-logos{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
.site-logos .logo-ph{border:1px dashed var(--line); border-radius:10px; height:66px; display:flex;
  align-items:center; justify-content:center; color:#c4c4c4; font-size:.76rem; background:var(--bg-soft);}

/* ---- レスポンシブ ---- */
@media (max-width:760px){
  .site-stats{grid-template-columns:1fr;}
  .site-feature{grid-template-columns:1fr; gap:22px;}
  .site-feature .fimg,.site-feature.rev .fimg{order:0;}
  .site-flow{flex-direction:column;}
  .site-flow .farrow{flex:0 0 26px;}
  .site-flow .farrow svg{transform:rotate(90deg);}
  .site-ba{grid-template-columns:1fr;}
  .site-ba .vs{padding:10px 0;}
  .site-ba .vs span{transform:rotate(90deg); display:inline-block;}
  .site-logos{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:860px){
  .site-nav{position:fixed; inset:66px 0 auto 0; flex-direction:column; align-items:stretch;
    gap:0; background:#fff; border-bottom:1px solid var(--line); padding:8px 0;
    box-shadow:var(--shadow); display:none;}
  .site-nav.open{display:flex;}
  .site-nav a{padding:13px 24px; border-bottom:1px solid var(--line-soft);}
  .site-nav .site-btn{margin:10px 24px;}
  .site-nav-toggle{display:block;}
}
@media (max-width:760px){
  .site-grid.cols-3,.site-grid.cols-2{grid-template-columns:1fr;}
  .site-section{padding:52px 0;}
  .site-hero{padding:56px 0 44px;}
  .site-h1{font-size:2rem;}
  .site-h2{font-size:1.5rem;}
  .head-wm .wm-text{font-size:clamp(2.4rem,12vw,4rem);}
  .site-dl{grid-template-columns:1fr;}
  .site-dl dt{padding-bottom:2px; border-bottom:none;}
  .site-dl dd{padding-top:4px;}
}

/* ---- コラム：一覧カード ---- */
.col-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:30px;}
.col-card{display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:16px;
  overflow:hidden; box-shadow:var(--shadow); color:var(--ink); transition:.18s ease;}
.col-card:hover{transform:translateY(-3px); box-shadow:0 18px 40px rgba(124,58,237,.18); color:var(--ink);}
.col-thumb{position:relative; aspect-ratio:16/9; display:flex; align-items:center; justify-content:center;
  overflow:hidden; background:linear-gradient(135deg,#ece7f9,#f5f1fc);}
.col-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.col-thumb-ph{font-weight:900; letter-spacing:.22em; color:#c9bdf0; font-size:1.1rem;}
.col-ext-badge{position:absolute; top:10px; left:10px; background:var(--ink); color:#fff;
  font-size:.7rem; font-weight:800; padding:4px 10px; border-radius:6px;}
.col-body{padding:18px 18px 20px; display:flex; flex-direction:column; gap:8px;}
.col-meta{display:flex; align-items:center; gap:10px;}
.col-card-title{font-size:1.05rem; font-weight:800; line-height:1.5; margin:2px 0 0; color:var(--ink);}
.col-card:hover .col-card-title{color:var(--accent);}
.col-card-excerpt{font-size:.86rem; color:var(--muted); line-height:1.7; margin:0;}
@media (max-width:860px){ .col-cards{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .col-cards{grid-template-columns:1fr;} }

/* ---- コラム：記事ページ ---- */
.col-article{padding:46px 0 60px;}
.col-breadcrumb{font-size:.82rem; color:var(--muted); margin-bottom:14px;}
.col-breadcrumb a{color:var(--muted);}
.col-breadcrumb a:hover{color:var(--accent);}
.col-breadcrumb span{margin:0 6px;}
.col-art-meta{display:flex; align-items:center; gap:12px; margin-bottom:10px;}
.col-art-title{font-size:clamp(1.5rem,4.6vw,2.1rem); font-weight:900; line-height:1.45; color:var(--ink); margin:0 0 20px;}
.col-art-hero{aspect-ratio:16/9; border-radius:14px; overflow:hidden; margin:0 0 26px;
  background:linear-gradient(135deg,#ece7f9,#f5f1fc); display:flex; align-items:center; justify-content:center;}
.col-art-hero img{width:100%; height:100%; object-fit:cover;}
.col-conclusion{background:var(--accent-soft); border:1px solid #e4d9fb; border-radius:14px; padding:20px 22px; margin:0 0 28px;}
.col-conclusion-h{font-weight:800; color:var(--accent); margin:0 0 8px; font-size:.95rem;}
.col-conclusion ul{margin:0; padding-left:20px;}
.col-conclusion li{color:var(--ink); line-height:1.8; margin-bottom:4px;}
.col-toc{border:1px solid var(--line); border-radius:12px; padding:16px 20px; margin:0 0 28px; background:var(--bg-soft);}
.col-toc-h{font-weight:800; margin:0 0 8px; font-size:.9rem; color:var(--ink);}
.col-toc ol{margin:0; padding-left:20px;}
.col-toc li{margin:4px 0; line-height:1.6;}
.col-toc li.lv3{padding-left:14px; list-style:circle;}
.col-toc a{color:var(--ink-soft); font-size:.9rem;}
.col-toc a:hover{color:var(--accent);}
.col-art-body{color:var(--ink); line-height:2;}
.col-art-body h2{font-size:1.45rem; font-weight:800; margin:38px 0 14px; padding-bottom:8px; border-bottom:2px solid var(--accent-soft);}
.col-art-body h3{font-size:1.15rem; font-weight:800; margin:26px 0 10px; color:var(--accent);}
.col-art-body p{margin:0 0 18px;}
.col-art-body code{background:var(--bg-soft); padding:2px 6px; border-radius:5px; font-size:.92em;}
.col-art-body ul,.col-art-body ol{margin:0 0 18px; padding-left:22px;}
.col-art-body li{margin-bottom:6px;}
.col-art-body a{color:var(--accent); font-weight:700;}
.col-faq{margin:42px 0 0;}
.col-faq h2{font-size:1.3rem; font-weight:800; margin:0 0 14px;}
.col-faq details{border:1px solid var(--line); border-radius:10px; padding:14px 16px; margin-bottom:10px;}
.col-faq summary{font-weight:700; cursor:pointer; color:var(--ink);}
.col-faq .ans{margin-top:10px; color:var(--muted); line-height:1.8;}
.col-cta{margin:44px 0 0; background:var(--accent-soft); border-radius:16px; padding:30px 28px; text-align:center;}
.col-cta-lead{font-size:1.25rem; font-weight:800; color:var(--ink); margin:0 0 4px;}
.col-related{margin:44px 0 0;}
.col-related h2{margin:0 0 14px;}
.col-related-list{display:flex; flex-direction:column; gap:10px;}
.col-related-item{display:flex; align-items:center; gap:12px; padding:14px 16px; border:1px solid var(--line); border-radius:10px; color:var(--ink);}
.col-related-item:hover{border-color:var(--accent); color:var(--accent);}
.col-related-title{font-weight:700; font-size:.95rem;}
.col-back{font-weight:700; color:var(--accent);}