/* AIKATA × LISH の上書きレイヤー（2026-10-21）
   配色そのものは scripts/aikata-recolor.py で元ファイルの値を置き換え済み
   （白地＋墨色の文字、LISH の青はアクセントだけ、申し込みボタンは青と反対側の朱色に白文字）。
   ここでは、色の置き換えだけでは表せないものを足す：
   - 最初の画面（hero110）を白地にする（参考：青い帯を広く使わず、白地に青をアクセントで使う構成）
   - 濃い帯（サービス・最後の案内）に、LISH の立方体と同じ三角の格子をごく薄く重ねる
   - 紫の時代の輪の飾り（ring138）を外す
   既存の CSS は属性セレクタを重ねた強い指定（!important）が多いため、同じ属性を重ねて上書きする。
   最後に読み込むこと（src/components/Aikata/index.tsx） */

:root {
  --lish-lattice: repeating-linear-gradient(0deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(60deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(-60deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 64px);
  --lish-ink: #1b1e2b;
  --lish-muted: #55607a;
  --lish-blue: #0f64ae;
}

/* ── 最初の画面：白地 ── */




/* 白地になったので、強調の黄色マーカーの文字も墨色にする */

/* 濃い地に合わせた白い風の帯は、白地ではごく薄くする */


/* ── 濃い帯：三角の格子 ── */
html body.aikata[data-polish131][data-polish131][data-art] :is(.services-section, .closing110) {
  background: var(--lish-lattice), var(--gradient110) !important;
}
/* 最後の案内のボタンも、ほかの申し込みボタンと同じ朱色（白文字）にする */
html body.aikata[data-polish131][data-polish131][data-polish131][data-art][data-polish110] .closing110 :is(a.action130, a.primary130, .cta a, a[href*="contact"]) {
  background: #d9480f !important;
  border-color: #d9480f !important;
  color: #fff !important;
}

/* チャットの選択肢は、カーソルを乗せて朱色になったとき文字を白にする */
@media (hover: hover) {
  html body.aikata .chat165-chips a:hover { color: #fff !important; }
}

html body.aikata .ring138 {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html body.aikata .ring138 i { animation: none !important; }
}

/* ===== 2026-10-21 表記・数字の修正（改善リスト B10〜B12・H9） ===== */
/* B12：積み木は 2／3／5／8 個（1つ＝約10時間）。8個でも列の高さに収まるよう、1つを薄くする */
html body.aikata .ak150-stack { gap: 5px; }
html body.aikata .ak150-stack i { height: 23px; }
html body.aikata .ak150-stack i:nth-child(5) { animation-delay: .32s; }
html body.aikata .ak150-stack i:nth-child(6) { animation-delay: .4s; }
html body.aikata .ak150-stack i:nth-child(7) { animation-delay: .48s; }
html body.aikata .ak150-stack i:nth-child(8) { animation-delay: .56s; }
@media (max-width: 600px) {
  html body.aikata .ak150-stack { gap: 4px; }
  html body.aikata .ak150-stack i { height: 14px; }
}
/* B10：カードにも（税別）と税込 */
html body.aikata .ak150-yen small { white-space: nowrap; }
html body.aikata .ak150-tax { margin: 2px 0 0 !important; font-size: 13px; color: #55607a; }
/* B11：ダイヤルの目盛り 20／30／50／80 を4段階の位置に */
html body.aikata .dial165-scale span:nth-child(2) { --f: .33333; }
html body.aikata .dial165-scale span:nth-child(3) { --f: .66667; }
/* H9：404 の主要ページへのリンク */
html body.aikata .nf-links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 16px 0 24px; padding: 0; list-style: none; }
html body.aikata .nf-links a { color: #0f64ae; text-decoration: underline; text-underline-offset: 3px; }
/* ===== 2026-10-21 事例：これまでの変化（実数） ===== */
html body.aikata .ak150-result ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
html body.aikata .ak150-result { background: #0f64ae; }
html body.aikata .ak150-result .ak150-lbl { color: #fff !important; opacity: .9; }
html body.aikata .ak150-result li { position: relative; padding-left: 22px; font-size: 18px; font-weight: 700; color: #fff; }
html body.aikata .ak150-result li::before { content: ''; position: absolute; left: 0; top: .55em; width: 12px; height: 12px; border-radius: 50%; background: #fff; }
/* 事例カードは「これまでの変化」を足して6段に（subgrid の段数を合わせる。結果欄のないカードは空の段になる） */
@media (min-width: 761px) {
  html body.aikata .ak150-cases > .ak150-case { grid-row: span 6; }
}
