/* ai-trend.css — AI最新トレンド（考察コラム）専用スタイル
記事本文の基本（ahero/layout/main/sec/figure/lede/toc/sidebar等）はcommon.cssを使用。
ここでは考察記事に固有の「ニュース要点」「出典ボックス」「考察ブロック」等のみを定義。 */
/* ヒーロー画像（k01同等） */
.hero-illust{margin:8px 0 30px}
.hero-illust img{width:100%;height:auto;display:block;border-radius:14px;box-shadow:0 14px 36px rgba(10,37,64,.14)}
.hero-illust svg{width:100%;height:auto;display:block;border-radius:14px;box-shadow:0 14px 36px rgba(10,37,64,.14)}
/* 公開日・更新日バッジ（aheroのmeta内で使用） */
.ahero .meta .date{font-weight:700;color:var(--blue)}
/* ニュース要点ボックス（記事冒頭の「今回のニュース」まとめ） */
.news-box{background:linear-gradient(135deg,#f2f8fd,#eaf3fb);border:1px solid var(--sky,#d6e9f8);border-left:5px solid var(--blue);border-radius:14px;padding:22px 26px;margin:8px 0 34px}
.news-box .nb-head{font-family:var(--latin);font-size:12px;font-weight:700;letter-spacing:.1em;color:var(--blue);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.news-box .nb-head::before{content:"NEWS";font-family:var(--latin);font-weight:700;font-size:11px;background:var(--blue);color:#fff;padding:3px 9px;border-radius:6px;letter-spacing:.06em}
.news-box ul{list-style:none;margin:0}
.news-box li{font-size:14.5px;color:#2b3b48;line-height:1.85;padding:5px 0 5px 24px;position:relative}
.news-box li::before{content:"";position:absolute;left:4px;top:13px;width:8px;height:8px;border-radius:50%;background:var(--blue)}
/* ニュース引用ブロック（ニュースの内容を紹介する引用） */
.news-quote{border:1px solid var(--line);border-radius:14px;background:#fff;padding:20px 24px;margin:24px 0;position:relative}
.news-quote::before{content:"\201C";position:absolute;left:14px;top:2px;font-family:var(--serif);font-size:46px;color:var(--sky,#d6e9f8);line-height:1}
.news-quote p{font-size:15px;line-height:1.95;color:#33424f;margin:0 0 6px 24px}
.news-quote .nq-src{font-size:12.5px;color:var(--gray);margin:8px 0 0 24px}
.news-quote .nq-src a{color:var(--blue);text-decoration:none;word-break:break-all}
.news-quote .nq-src a:hover{text-decoration:underline}
/* 考察ブロック（エムズの視点） */
.insight{background:#fbfdff;border:1px dashed var(--blue-bright,#2f8fe0);border-radius:14px;padding:22px 26px;margin:26px 0}
.insight .ins-head{font-family:var(--serif);font-size:16px;font-weight:800;color:var(--navy);margin-bottom:10px;display:flex;align-items:center;gap:9px}
.insight .ins-head::before{content:"";display:inline-block;width:24px;height:24px;border-radius:7px;background:linear-gradient(135deg,#1a6dc4,#2f8fe0);flex:none;
-webkit-mask:url("data:image/svg+xml;utf8,") center/18px no-repeat;
mask:url("data:image/svg+xml;utf8,") center/18px no-repeat}
.insight p{font-size:15px;line-height:1.95;color:#33424f;margin:0 0 12px}
.insight p:last-child{margin-bottom:0}
/* 出典一覧（記事末尾） */
.sources{margin:40px 0 8px;border-top:1px solid var(--line);padding-top:24px}
.sources h2{font-family:var(--serif);font-size:18px;font-weight:800;color:var(--navy);margin-bottom:14px}
.sources ol{margin:0 0 0 20px;padding:0}
.sources li{font-size:13.5px;color:#46535f;line-height:1.85;margin-bottom:10px}
.sources li a{color:var(--blue);text-decoration:none;word-break:break-all}
.sources li a:hover{text-decoration:underline}
.sources .note{font-size:12px;color:var(--gray);margin-top:14px;line-height:1.7}
/* CTAバンド（k01同等） */
.cta-band{margin:40px 0 8px;background:linear-gradient(135deg,#0a2540,#1a6dc4);border-radius:18px;padding:34px 32px;text-align:center;color:#fff}
.cta-band h3{font-family:var(--serif);font-size:clamp(18px,2.4vw,23px);font-weight:800;line-height:1.55;margin:0 0 12px}
.cta-band p{font-size:15px;line-height:1.85;color:rgba(255,255,255,.9);margin:0 auto 22px;max-width:620px}
.cta-band a{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--blue);font-weight:700;font-size:16px;padding:14px 34px;border-radius:99px;text-decoration:none;transition:.3s}
.cta-band a:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,0,0,.2)}
/* 比較表（k01同等） */
.cmp-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 12px rgba(10,37,64,.06)}
.cmp-table th,.cmp-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line)}
.cmp-table thead th{background:var(--navy);color:#fff;font-weight:700}
.cmp-table tbody th{background:var(--blue-pale,#eaf3fb);color:var(--navy);font-weight:700;white-space:nowrap}
.cmp-table tr:last-child td,.cmp-table tr:last-child th{border-bottom:none}
@media(max-width:680px){.cmp-table{font-size:13.5px}.cmp-table th,.cmp-table td{padding:10px 11px}}
/* FAQ（k01.css同等。考察記事末尾の「よくある質問」用） */
.faq-list{margin:24px 0 8px;display:flex;flex-direction:column;gap:14px}
.faq-list .qa{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}
.faq-list .q{background:var(--blue-pale,#eaf3fb);color:var(--navy);font-weight:700;font-size:16px;padding:15px 20px 15px 50px;position:relative;line-height:1.6}
.faq-list .q::before{content:"Q";position:absolute;left:18px;top:13px;width:22px;height:22px;background:var(--blue);color:#fff;border-radius:50%;font-family:var(--latin);font-size:14px;display:flex;align-items:center;justify-content:center}
.faq-list .a{padding:16px 20px 18px 50px;font-size:15px;color:var(--ink);line-height:1.85;position:relative}
.faq-list .a::before{content:"A";position:absolute;left:18px;top:15px;width:22px;height:22px;background:#e8654f;color:#fff;border-radius:50%;font-family:var(--latin);font-size:14px;display:flex;align-items:center;justify-content:center}