/* MIRAI Design System — theme: MIRAI Biz (AI業務サービス)
   Aesthetic: Tier2シネマ — 深い青黒の引き締まった画面に
   シアン #34E6D9 を唯一の信号として走らせる (HP制作代行スペック正本配色)。
   Type: Zen Kaku Gothic New 900 (JP display) × Space Grotesk (Latin/figures)
       × IBM Plex Mono (data) × Zen Kaku Gothic New (body)。
   Load AFTER base.css. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=IBM+Plex+Mono:wght@400;500&family=Zen+Kaku+Gothic+New:wght@400;500;700;900&display=swap');

:root,
[data-theme="dark"]{
  --ds-bg:#0A0E12;            --ds-surface:#10161C;
  --ds-text:#E9EEF3;          --ds-text-dim:rgba(233,238,243,.58);
  --ds-line:rgba(233,238,243,.15); --ds-line-soft:rgba(233,238,243,.06);
  --ds-accent:#34E6D9;        --ds-accent-ink:#04211D;  --ds-flag:#FFB35C;

  --ds-font-display:'Zen Kaku Gothic New',sans-serif;
  --ds-font-display-en:'Space Grotesk',sans-serif;
  --ds-font-mono:'IBM Plex Mono',ui-monospace,monospace;
  --ds-font-body:'Zen Kaku Gothic New',system-ui,sans-serif;

  --ds-radius:8px; --ds-maxw:1180px;
}

/* display は和文ゴシック超太字で固める(シネマの硬さ) */
.ds-display{font-weight:900;letter-spacing:.005em;line-height:1.06}

/* 価格表示: Space Grotesk の等幅寄り数字 */
.biz-price{font-family:var(--ds-font-display-en);font-weight:700;font-size:clamp(1.9rem,3.4vw,2.6rem);letter-spacing:-.01em}
.biz-price small{font-size:.45em;font-weight:500;color:var(--ds-text-dim);letter-spacing:0}

/* SKUカードの推し1枚 */
.biz-card--hero{border-color:color-mix(in srgb,var(--ds-accent) 55%,transparent);
  box-shadow:0 40px 90px -42px color-mix(in srgb,var(--ds-accent) 28%,transparent)}
.biz-badge{position:absolute;top:-11px;left:22px;font-family:var(--ds-font-mono);font-size:.68rem;
  letter-spacing:.14em;background:var(--ds-accent);color:var(--ds-accent-ink);
  padding:.22rem .6rem;border-radius:3px;font-weight:500}

/* 比較表 */
.biz-table{width:100%;border-collapse:collapse;font-size:.92rem}
.biz-table th,.biz-table td{padding:.85rem 1rem;border-bottom:1px solid var(--ds-line-soft);text-align:left;vertical-align:top}
.biz-table thead th{font-family:var(--ds-font-mono);font-size:.72rem;letter-spacing:.12em;color:var(--ds-text-dim);text-transform:uppercase;border-bottom:1px solid var(--ds-line)}
.biz-table .col-mirai{background:color-mix(in srgb,var(--ds-accent) 6%,transparent)}
.biz-table td.col-mirai{color:var(--ds-text);font-weight:700}

/* フォーム */
.biz-field{display:block;margin-bottom:1.05rem}
.biz-field span{display:block;font-family:var(--ds-font-mono);font-size:.72rem;letter-spacing:.12em;color:var(--ds-text-dim);margin-bottom:.4rem}
.biz-field input,.biz-field select,.biz-field textarea{width:100%;background:var(--ds-bg);
  border:1px solid var(--ds-line);border-radius:6px;color:var(--ds-text);
  font-family:var(--ds-font-body);font-size:.98rem;padding:.8rem .9rem;outline:none;
  transition:border-color .2s}
.biz-field input:focus,.biz-field select:focus,.biz-field textarea:focus{border-color:var(--ds-accent)}
.biz-field textarea{min-height:110px;resize:vertical}
.biz-hp{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}

/* ステップ番号 */
.biz-step-no{font-family:var(--ds-font-display-en);font-weight:700;font-size:2.1rem;
  color:color-mix(in srgb,var(--ds-accent) 80%,transparent);line-height:1}

/* ライブ実証カードのドット */
.biz-live{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--ds-font-mono);
  font-size:.7rem;letter-spacing:.12em;color:var(--ds-accent)}
.biz-live::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--ds-accent);
  animation:biz-pulse 2.2s ease-in-out infinite}
@keyframes biz-pulse{0%,100%{opacity:1}50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.biz-live::before{animation:none}}
