/*
 * Factoring Flower 公開サイト
 * docs/factoring_flower/DESIGN_SPEC.md の色・寸法・構造をそのまま実装している。
 * デザインの変更はDESIGN_SPEC側で決定してから反映すること(Claude側で独自に変えない)。
 *
 * application.cssのrequire_treeからはstubで除外しており、Factoring Flowerの
 * レイアウトだけが読み込む。
 */

/* カラートークン(Issue #206: オレンジ/グリーン/パープル + ホワイト/ウォームクリーム)
 * 旧バーガンディ/ローズ系(DESIGN_SPEC §3 の初期値)から置き換えた。
 * 文字色に使う組み合わせはWCAG AAを確認済み(DESIGN_SPEC §3 の表):
 *   --flower-orange の上の文字は --flower-on-orange(暗色)。白文字は 2.8:1 で不足するため使わない。
 *   --flower-green は塗り・アイコン用。文字と白文字の背景は --flower-green-deep。
 */
:root {
  --flower-orange: #FF6E00;
  --flower-orange-text: #B34700;
  --flower-orange-soft: #FFB98A;
  --flower-orange-light: #FFE8D6;
  --flower-on-orange: #2B1A0E;
  --flower-green: #00B048;
  --flower-green-deep: #00733A;
  --flower-green-light: #E6F6EC;
  --flower-purple: #7B59A2;
  --flower-purple-deep: #5E4385;
  --flower-purple-dark: #4A3466;
  --flower-purple-light: #F4EFFA;
  --flower-cream: #FFF8F0;
  --flower-heading: #2E2638;
  --flower-text: #2E2638;
  --flower-text-muted: #5F5566;
  --flower-border: #EEE3D8;
  --flower-surface: #FFFFFF;
  --flower-danger: #B42318;
  --flower-success: #198754;

  /* §4 タイポグラフィ */
  --ff-font: system-ui, "Hiragino Sans", "Yu Gothic", sans-serif;
  --ff-size-body: 16px;
  --ff-size-small: 14px;
  --ff-size-lead: 18px;
  --ff-size-h3: 24px;
  --ff-size-h2: clamp(32px, 4vw, 52px);
  --ff-size-h1: clamp(42px, 7vw, 78px);
  --ff-lh-body: 1.8;
  --ff-lh-heading: 1.3;

  /* §5 レイアウト */
  --ff-max: 1180px;
  --ff-max-form: 1080px;
  --ff-gutter: 32px;
  --ff-section-space: 88px;
  --ff-header-height: 64px;

  /* §9 カード */
  --ff-radius: 20px;
  --ff-shadow: 0 10px 30px rgba(70, 45, 30, .08);
}

/* §17 レスポンシブ: 768〜1199 tablet / <768 mobile */
@media (max-width: 1199px) {
  :root { --ff-gutter: 24px; --ff-size-h3: 26px; }
}
@media (max-width: 767px) {
  :root { --ff-gutter: 16px; --ff-section-space: 56px; --ff-size-h3: 24px; --ff-header-height: 56px; }
}
@media (min-width: 1200px) {
  :root { --ff-size-h3: 28px; }
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--ff-header-height) + 12px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body.ff-site {
  margin: 0;
  font-family: var(--ff-font);
  font-size: var(--ff-size-body);
  line-height: var(--ff-lh-body);
  color: var(--flower-text);
  background: var(--flower-surface);
  -webkit-text-size-adjust: 100%;
  overflow-wrap: anywhere;
  overflow-x: clip;
}

/* リセットは:where()で詳細度0にし、各コンポーネントの余白指定を優先させる */
:where(.ff-site) :where(h1, h2, h3) { line-height: var(--ff-lh-heading); margin: 0; }
:where(.ff-site) :where(p) { margin: 0; }
:where(.ff-site) :where(p + p) { margin-top: .8em; }
.ff-site img { max-width: 100%; height: auto; }
.ff-site a { color: var(--flower-orange-text); }
.ff-site :focus-visible {
  outline: 3px solid var(--flower-purple-dark);
  outline-offset: 2px;
  box-shadow: 0 0 0 6px var(--flower-orange-soft);
}
:where(.ff-site) :where(ul, ol) { padding: 0; margin: 0; list-style: none; }
:where(.ff-site) :where(dl, dd, figure, blockquote) { margin: 0; }
:where(.ff-site) :where(fieldset) { border: 0; margin: 0; padding: 0; min-width: 0; }

.ff-skip-link {
  position: absolute; left: 8px; top: -60px; z-index: 100;
  padding: 8px 16px; background: var(--flower-orange); color: var(--flower-on-orange); border-radius: 999px; font-weight: 700;
}
.ff-skip-link:focus { top: 8px; }
#ff-main:focus { outline: none; }

.ff-container {
  width: 100%;
  max-width: calc(var(--ff-max) + var(--ff-gutter) * 2);
  margin: 0 auto;
  padding: 0 var(--ff-gutter);
  position: relative;
}
.ff-container--narrow { max-width: calc(var(--ff-max-form) + var(--ff-gutter) * 2); }

.ff-muted { color: var(--flower-text-muted); }
.ff-note { color: var(--flower-text-muted); font-size: var(--ff-size-small); line-height: 1.7; }

/* ---------- §8 CTA ---------- */
.ff-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 0 28px;
  border-radius: 999px; border: 1px solid transparent;
  font: inherit; font-weight: 700; font-size: 16px; line-height: 1.4; text-align: center; text-decoration: none;
  cursor: pointer;
  transition: filter .15s ease, transform .15s ease, background-color .15s ease;
}
.ff-site a.ff-btn { color: inherit; }
.ff-btn:hover { filter: brightness(.97); transform: translateY(-1px); }
.ff-btn:active { transform: none; }
.ff-btn[disabled], .ff-btn[aria-busy="true"] { cursor: progress; filter: none; transform: none; opacity: .75; }
.ff-btn--lg { min-height: 56px; padding: 0 32px; }
.ff-btn--sm { min-height: 40px; padding: 0 20px; font-size: 14px; }
.ff-btn--block { display: flex; width: 100%; }
.ff-btn--primary, .ff-site a.ff-btn--primary { background: var(--flower-orange); color: var(--flower-on-orange); box-shadow: 0 6px 16px rgba(255, 110, 0, .28); }
.ff-btn--primary:hover { filter: none; background: #FF7F1F; }
.ff-btn--secondary, .ff-site a.ff-btn--secondary { background: var(--flower-surface); color: var(--flower-orange-text); border: 2px solid var(--flower-orange); }
.ff-btn--secondary:hover { filter: none; background: var(--flower-cream); }
/* LINE: 白文字のAAを満たすため塗りは --flower-green-deep */
.ff-btn--line, .ff-site a.ff-btn--line { background: var(--flower-green-deep); color: #fff; }

/* ---------- badges ---------- */
.ff-badge {
  display: inline-block; padding: 2px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 700; line-height: 1.6; vertical-align: middle; white-space: nowrap;
}
.ff-badge--required { background: var(--flower-orange-text); color: #fff; }
.ff-badge--optional { background: var(--flower-border); color: var(--flower-text-muted); }
.ff-badge--rose { background: var(--flower-orange-light); color: var(--flower-heading); }

/* ---------- §6 Header ---------- */
.ff-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .96);
  border-bottom: 1px solid var(--flower-border);
  backdrop-filter: saturate(1.2) blur(6px);
}
.ff-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: var(--ff-header-height); }
.ff-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; line-height: 1.1; }
.ff-logo__text { display: inline-flex; flex-direction: column; justify-content: center; }
.ff-logo__symbol { display: block; width: 40px; height: 40px; flex: none; }
.ff-logo__full { display: block; width: 220px; height: auto; }
.ff-site a.ff-logo { color: var(--flower-heading); }
.ff-logo__mark { font-size: 22px; font-weight: 700; letter-spacing: .28em; }
.ff-logo__sub { font-size: 10px; letter-spacing: .24em; color: var(--flower-text-muted); text-transform: uppercase; }
.ff-logo__image { max-height: 40px; width: auto; }
.ff-header__nav { display: flex; align-items: center; gap: 24px; }
.ff-header__links { display: flex; gap: 24px; }
.ff-site a.ff-header__link { color: var(--flower-text); text-decoration: none; font-size: 15px; font-weight: 600; }
.ff-site a.ff-header__link:hover { color: var(--flower-orange-text); }
.ff-header__toggle { display: none; }

@media (max-width: 767px) {
  .ff-header__toggle {
    display: inline-flex; align-items: center; gap: 8px;
    min-height: 40px; padding: 0 14px; border: 1px solid var(--flower-border); border-radius: 999px;
    background: #fff; color: var(--flower-text); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
  }
  .ff-header__toggle-icon, .ff-header__toggle-icon::before, .ff-header__toggle-icon::after {
    display: block; width: 16px; height: 2px; background: currentColor; border-radius: 2px; content: "";
    transition: transform .15s ease;
  }
  .ff-header__toggle-icon { position: relative; }
  .ff-header__toggle-icon::before { position: absolute; top: -5px; }
  .ff-header__toggle-icon::after { position: absolute; top: 5px; }
  .ff-header.is-open .ff-header__toggle-icon { background: transparent; }
  .ff-header.is-open .ff-header__toggle-icon::before { transform: translateY(5px) rotate(45deg); }
  .ff-header.is-open .ff-header__toggle-icon::after { transform: translateY(-5px) rotate(-45deg); }

  .ff-header__nav {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 8px;
    padding: 12px var(--ff-gutter) 20px;
    background: #fff; border-bottom: 1px solid var(--flower-border); box-shadow: var(--ff-shadow);
  }
  .ff-header.is-open .ff-header__nav { display: flex; }
  .ff-header__links { flex-direction: column; gap: 0; }
  .ff-site a.ff-header__link { display: block; padding: 12px 4px; border-bottom: 1px solid var(--flower-border); }
  .ff-header__cta { margin-top: 8px; min-height: 52px; }
}

/* ---------- sections ---------- */
.ff-section { padding: var(--ff-section-space) 0; background: var(--flower-surface); }
/* 背景はセクションごとのmodifierで個別に指定する(下の「リッチデザイン」参照)。 */
.ff-section__header { text-align: center; max-width: 820px; margin: 0 auto 48px; }
.ff-section__eyebrow { color: var(--flower-orange-text); font-size: 14px; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; margin-bottom: 12px; }
.ff-section__title { font-size: var(--ff-size-h2); font-weight: 700; color: var(--flower-heading); }
.ff-section__lead { margin-top: 20px; font-size: var(--ff-size-lead); color: var(--flower-text-muted); }
.ff-section__note { margin-top: 32px; text-align: center; }
@media (max-width: 767px) {
  .ff-section__header { margin-bottom: 32px; }
  .ff-section__lead { font-size: 16px; }
}

.ff-grid { display: grid; gap: 24px; }
.ff-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ff-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ff-grid--1 { grid-template-columns: minmax(0, 1fr); max-width: 560px; margin: 0 auto; }
@media (max-width: 1199px) { .ff-grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .ff-grid--3, .ff-grid--2 { grid-template-columns: minmax(0, 1fr); } }

/* §9 カード */
.ff-card {
  position: relative;
  background: var(--flower-surface);
  border: 1px solid var(--flower-border);
  border-radius: var(--ff-radius);
  box-shadow: var(--ff-shadow);
  padding: 32px;
}
@media (max-width: 767px) { .ff-card { padding: 24px 20px; } }
.ff-card__title { font-size: var(--ff-size-h3); font-weight: 700; color: var(--flower-heading); }
.ff-card__body { margin-top: 12px; color: var(--flower-text); }

/* ---------- §7 Hero ----------
 * ヒーローの指定はここだけに置く(後段での上書きはしない)。
 * 基準: 確定完成見本 docs/factoring_flower/source/final_approved_mock_20260929.png
 * 素材: app/assets/images/factoring_flower/final_mock/(加工しない。配置・大きさ・重なり順だけをここで決める)
 * 左: ロゴ → 見出し → 説明 → CTA、その下に特徴バッジ
 * 右: 大花(背面) → 女性 → レート上限カード(前面)を1つのまとまりとして重ねる。
 *     重ねはグリッドの行を共有させて作る(negative margin・position:absolute は使わない)。
 * レート上限カードはCMS連動のHTML(料率・文言を管理画面で変えられるように)。
 */
.ff-hero {
  position: relative; overflow: hidden;
  padding: 64px 0 88px;
  color: #fff;
  /* ロゴ(final_mock/hero_logo.svg)の文字が白のため、地は濃いめのパープル。右下にオレンジの光を差す(文字の背面にならない位置) */
  background:
    radial-gradient(circle at 82% 72%, rgba(255, 110, 0, .28) 0%, rgba(255, 110, 0, 0) 42%),
    linear-gradient(160deg, var(--flower-purple) 0%, var(--flower-purple-deep) 60%, var(--flower-purple-dark) 100%);
}
.ff-hero__inner {
  position: relative; z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 55fr) minmax(0, 45fr);
  grid-template-areas: "text visual" "trust visual" "note visual";
  grid-template-rows: auto auto 1fr;
  column-gap: 32px; row-gap: 24px; align-items: start;
}

/* 左: テキスト */
.ff-hero__text { grid-area: text; }
.ff-hero__logo {
  display: inline-flex; align-items: center; margin-bottom: 28px; padding: 0;
  background: transparent; box-shadow: none; border-radius: 0; overflow: visible;
}
.ff-hero__logo-image { display: block; width: 270px; height: auto; margin: 0; }
.ff-hero__eyebrow { font-size: 15px; font-weight: 700; color: var(--flower-orange-light); }
.ff-hero__brand { margin-top: 8px; font-size: 14px; letter-spacing: .3em; text-transform: uppercase; color: rgba(255, 255, 255, .85); }
/* 完成見本は1440pxで約58px。「女性経営者だけの、」(9文字)が左カラムに1行で収まる大きさ。 */
.ff-hero__title { font-size: clamp(42px, 4.1vw, 60px); font-weight: 700; line-height: 1.28; letter-spacing: .01em; }
.ff-hero__lead { margin-top: 24px; font-size: var(--ff-size-lead); color: rgba(255, 255, 255, .92); max-width: 36em; }
.ff-hero__actions { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; }

/* 左下: 特徴バッジ・注記 */
.ff-hero__trust { grid-area: trust; display: flex; flex-wrap: wrap; gap: 10px; margin-top: 0; }
.ff-hero__trust li {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 16px 7px 9px;
  font-weight: 600; font-size: 14px;
  border-radius: 999px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .28);
}
.ff-hero__check {
  position: relative; width: 18px; height: 18px; flex: none; border-radius: 50%;
  background: var(--flower-orange);
  -webkit-mask: none;
}
.ff-hero__check::after {
  content: ""; position: absolute; left: 6px; top: 3px; width: 4px; height: 9px;
  border: solid var(--flower-on-orange); border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.ff-hero__note { grid-area: note; margin-top: 16px; font-size: 13px; color: rgba(255, 255, 255, .9); }

/* 右: 大花・女性・レート上限カードのまとまり。
   行1〜2に女性、行2〜3にカードを置き、行2(--ff-hero-overlap)の分だけカードが女性の下部に重なる。 */
.ff-hero__visual {
  --ff-hero-overlap: 72px;
  grid-area: visual; position: relative; align-self: center;
  display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto var(--ff-hero-overlap) auto;
}
.ff-hero__illustration {
  grid-row: 1 / 3; grid-column: 1; justify-self: center;
  position: relative; z-index: 1; width: 520px; height: auto;
}
.ff-hero__card {
  grid-row: 2 / 4; grid-column: 1; justify-self: end;
  position: relative; z-index: 2; width: min(100%, 380px); margin: 0; padding: 18px 20px;
  background: var(--flower-surface); color: var(--flower-text);
  border-radius: var(--ff-radius-lg); box-shadow: 0 18px 40px rgba(70, 45, 30, .28);
}
.ff-hero__card-title { font-weight: 700; color: var(--flower-heading); font-size: 16px; }
.ff-hero__card-list { margin-top: 10px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ff-hero__card-item {
  display: flex; flex-direction: column; justify-content: flex-start; gap: 2px; padding: 10px 6px;
  border: 0; border-radius: 12px; background: var(--flower-cream); text-align: center;
}
.ff-hero__card-item dt { font-size: 13px; color: var(--flower-text-muted); font-weight: 600; padding-top: 0; }
.ff-hero__card-item dd { text-align: center; }
.ff-hero__card-value { display: block; font-size: 24px; font-weight: 700; color: var(--flower-heading); line-height: 1.3; }
.ff-hero__card-sub { display: block; font-size: 11px; line-height: 1.4; color: var(--flower-text-muted); }
.ff-hero__card-note { margin-top: 10px; font-size: 12px; color: var(--flower-text-muted); }
.ff-hero .ff-scallop { background-image: radial-gradient(circle at 12px 18px, var(--ff-cream-warm) 11px, transparent 12px); }

/* 背景の大花・花びら(final_mock/)。本文・CTA・バッジには重ねない */
.ff-hero > .ff-deco .ff-deco__mock-flower { width: 250px; top: 22%; left: -122px; }           /* 左(見出しの手前まで) */
.ff-hero > .ff-deco .ff-deco__mock-flower-2 { width: 220px; bottom: -60px; left: -96px; }     /* 左下 */
.ff-hero > .ff-deco .ff-deco__mock-flower-3 { width: 240px; bottom: -50px; right: -70px; }    /* 右下 */
.ff-hero > .ff-deco .ff-deco__mock-petals { width: 300px; top: 3%; right: 3%; opacity: .7; }  /* 右上 */
.ff-hero > .ff-deco .ff-deco__mock-petals-2 { width: 300px; bottom: 3%; left: 54%; opacity: .7; transform: rotate(8deg); } /* 下 */
/* 女性の背面の大花 */
.ff-hero__visual > .ff-deco { overflow: visible; }
.ff-hero__visual .ff-deco__mock-flower { width: 96%; top: 0; left: 2%; }

/* Tablet(〜1199px): 1カラム。女性とカードはテキストの下に中央寄せ */
@media (max-width: 1199px) {
  .ff-hero { padding: 56px 0 72px; }
  .ff-hero__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "text" "visual" "trust" "note"; }
  .ff-hero__visual { --ff-hero-overlap: 56px; width: min(100%, 480px); justify-self: center; }
  .ff-hero__illustration { width: 420px; }
  .ff-hero__card { width: min(100%, 440px); justify-self: center; }
  .ff-hero__card-sub { display: none; }
  .ff-hero > .ff-deco .ff-deco__mock-flower { top: 50%; left: -96px; }   /* 女性の左側(文字の無い位置) */
  .ff-hero > .ff-deco .ff-deco__mock-flower-2 { width: 180px; bottom: -96px; }
  .ff-hero > .ff-deco .ff-deco__mock-petals-2 { left: auto; right: 4%; bottom: 36%; }
}

/* Mobile(〜767px) */
@media (max-width: 767px) {
  .ff-hero { padding: 40px 0 48px; }
  .ff-hero__inner { row-gap: 20px; }
  .ff-hero__logo { margin-bottom: 18px; }
  .ff-hero__logo-image { width: 220px; }
  /* 「女性経営者だけの、」(9文字)を本文幅(390pxで358px)に1行で収める。390pxで約37px */
  .ff-hero__title { font-size: clamp(34px, 9.6vw, 40px); line-height: 1.3; letter-spacing: 0; }
  .ff-hero__lead { margin-top: 20px; font-size: 16px; }
  .ff-hero__actions { flex-direction: column; gap: 12px; margin-top: 28px; }
  .ff-hero__actions .ff-btn { width: 100%; }
  .ff-hero__trust { gap: 8px; }
  .ff-hero__trust li { font-size: 12px; align-items: flex-start; padding: 6px 12px 6px 8px; }
  .ff-hero__visual { --ff-hero-overlap: 36px; }
  .ff-hero__visual .ff-deco__mock-flower { width: 84%; top: -2%; left: 8%; }
  .ff-hero__illustration { width: 320px; }
  .ff-hero__card { width: 100%; padding: 12px; background: rgba(255, 255, 255, .97); }
  .ff-hero__card-title, .ff-hero__card-note { display: none; }
  .ff-hero__card-list { margin-top: 0; gap: 6px; }
  .ff-hero__card-item { flex-direction: column; justify-content: center; align-items: center; gap: 0; padding: 6px 4px; border-radius: 14px; }
  .ff-hero__card-item dt { font-size: 11px; white-space: nowrap; }
  .ff-hero__card-value { font-size: 16px; white-space: nowrap; }
  .ff-hero > .ff-deco .ff-deco__mock-flower { display: none; } /* 見出し・説明文に重なるため出さない */
  .ff-hero > .ff-deco .ff-deco__mock-flower-2 { width: 150px; bottom: -70px; left: -96px; }
  .ff-hero > .ff-deco .ff-deco__mock-flower-3 { width: 160px; bottom: -40px; right: -60px; }
  .ff-hero > .ff-deco .ff-deco__mock-petals { width: 220px; top: 1%; right: -40px; }
  .ff-hero > .ff-deco .ff-deco__mock-petals-2 { display: none; }
}

/* ---------- §10 料金 ---------- */
.ff-pricing { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.ff-plan { display: flex; flex-direction: column; text-align: center; padding-top: 40px; }
.ff-plan--recommended {
  border: 2px solid var(--flower-orange);
  box-shadow: 0 16px 40px rgba(212, 85, 0, .16);
  transform: translateY(-8px);
}
.ff-plan__badge {
  position: absolute; top: -16px; left: 50%; transform: translateX(-50%);
  padding: 4px 20px; border-radius: 999px;
  background: var(--flower-orange); color: var(--flower-on-orange);
  font-size: 14px; font-weight: 700; white-space: nowrap;
  box-shadow: 0 4px 12px rgba(70, 45, 30, .12);
}
.ff-plan__name { font-size: var(--ff-size-h3); font-weight: 700; letter-spacing: .08em; color: var(--flower-heading); }
.ff-plan__target { margin-top: 4px; font-size: 14px; color: var(--flower-text-muted); }
.ff-plan__price { display: flex; flex-direction: column; align-items: center; margin-top: 24px; }
.ff-plan__price-label { font-size: 14px; font-weight: 700; color: var(--flower-orange-text); }
.ff-plan__price-value { font-size: clamp(56px, 6vw, 80px); font-weight: 700; line-height: 1.1; color: var(--flower-heading); letter-spacing: -.02em; }
.ff-plan__price-unit { font-size: .45em; margin-left: 2px; }
.ff-plan__price-sub { font-size: 13px; color: var(--flower-text-muted); }
.ff-plan__cap {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  margin-top: 20px; padding: 12px 16px; border-radius: 12px; background: var(--flower-cream);
  font-size: 14px; color: var(--flower-text-muted);
}
.ff-plan__cap strong { font-size: 20px; color: var(--flower-text); }
.ff-plan__description { margin-top: 16px; text-align: left; }
.ff-plan__features { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--flower-border); text-align: left; }
.ff-plan__features-label { font-size: 13px; font-weight: 700; color: var(--flower-orange-text); margin-bottom: 8px; }
.ff-plan__features li { position: relative; padding-left: 24px; margin-top: 6px; font-size: 15px; }
.ff-plan__features li::before {
  content: ""; position: absolute; left: 4px; top: .55em; width: 10px; height: 6px;
  border: solid var(--flower-green-deep); border-width: 0 0 2px 2px; transform: rotate(-45deg);
}
@media (max-width: 1199px) { .ff-plan__price-value { font-size: 64px; } }
@media (max-width: 767px) {
  .ff-pricing { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .ff-plan--recommended { transform: none; }
}

.ff-retention { margin-top: 64px; text-align: center; }
.ff-retention__title { font-size: var(--ff-size-h3); font-weight: 700; color: var(--flower-heading); }
.ff-retention__lead { margin-top: 12px; color: var(--flower-text-muted); }
.ff-retention__steps { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 0; margin: 32px 0 16px; counter-reset: none; }
.ff-retention__step { position: relative; padding: 0 12px; }
.ff-retention__step::before {
  content: ""; position: absolute; top: 11px; left: 0; right: 0; height: 2px; background: var(--flower-orange-soft);
}
.ff-retention__step:first-child::before { left: 50%; }
.ff-retention__step:last-child::before { right: 50%; }
.ff-retention__label {
  position: relative; display: inline-block; padding: 0 12px; border-radius: 999px;
  background: var(--flower-orange-text); color: #fff; font-size: 13px; font-weight: 700; line-height: 24px;
}
.ff-retention__value { display: block; margin-top: 12px; font-size: 24px; font-weight: 700; color: var(--flower-heading); }
.ff-retention__body { margin-top: 4px; font-size: 14px; color: var(--flower-text-muted); }
@media (max-width: 767px) {
  .ff-retention { text-align: left; }
  .ff-retention__steps { grid-auto-flow: row; gap: 20px; }
  .ff-retention__step { padding: 0 0 0 28px; }
  .ff-retention__step::before { top: 0; bottom: -20px; left: 11px; right: auto; width: 2px; height: auto; }
  .ff-retention__step:first-child::before { left: 11px; top: 12px; }
  .ff-retention__step:last-child::before { right: auto; bottom: auto; height: 12px; }
  .ff-retention__label { margin-left: -28px; }
  .ff-retention__value { display: inline-block; margin: 0 0 0 12px; font-size: 20px; }
}

/* ---------- CTA section ---------- */
.ff-section.ff-section--cta { background: var(--flower-surface); }
.ff-cta {
  text-align: center; color: #fff;
  background: linear-gradient(135deg, var(--flower-purple-deep) 0%, var(--flower-purple-dark) 100%);
  border-radius: var(--ff-radius); padding: 56px 32px;
}
.ff-cta__title { font-size: clamp(26px, 3.2vw, 40px); font-weight: 700; }
.ff-cta__lead { margin-top: 16px; color: rgba(255, 255, 255, .92); }
.ff-cta__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 24px; margin-top: 32px; }
.ff-cta__action { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.ff-cta__sub { font-size: 13px; color: rgba(255, 255, 255, .85); }
.ff-cta__phone { margin-top: 32px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .3); }
.ff-cta__phone-label { font-size: 14px; font-weight: 700; }
.ff-site a.ff-cta__phone-number { color: #fff; font-size: 32px; font-weight: 700; text-decoration: none; letter-spacing: .04em; }
.ff-cta__phone-hours { font-size: 14px; color: rgba(255, 255, 255, .85); }
.ff-cta__phone-hours span { display: block; }
.ff-cta__note { margin-top: 16px; font-size: 13px; color: rgba(255, 255, 255, .88); }
@media (max-width: 767px) {
  .ff-cta { padding: 40px 20px; }
  .ff-cta__actions { flex-direction: column; align-items: stretch; }
  .ff-cta__action .ff-btn { width: 100%; }
}

/* ---------- 統計 / ケース / 番号付きカード ---------- */
.ff-stats { margin-top: 32px; }
.ff-stat { text-align: center; }
.ff-stat__value { font-size: clamp(44px, 5vw, 64px); font-weight: 700; line-height: 1.15; color: var(--flower-orange-text); }
.ff-stat__label { margin-top: 8px; font-weight: 600; }
.ff-stat__note { margin-top: 4px; font-size: 13px; color: var(--flower-text-muted); }

.ff-case__number, .ff-feature__number {
  font-size: 32px; font-weight: 700; line-height: 1; color: var(--flower-orange-soft); letter-spacing: .04em; margin-bottom: 12px;
}
.ff-case { display: flex; flex-direction: column; }
.ff-case__attribute {
  margin-top: auto; padding-top: 16px; font-size: 13px; color: var(--flower-orange-text); font-weight: 700;
}
.ff-case__attribute::before { content: ""; display: block; border-top: 1px solid var(--flower-border); margin-bottom: 12px; }

/* ---------- §11 仕組み / 利用の流れ ---------- */
.ff-steps { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 24px; }
.ff-steps__item { position: relative; text-align: center; }
.ff-steps__item:not(:last-child)::after {
  content: ""; position: absolute; top: 28px; left: calc(50% + 36px); right: calc(-50% + 36px - 24px);
  height: 2px; background: var(--flower-orange-soft);
}
.ff-steps__number {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--flower-purple-deep); color: #fff; font-size: 22px; font-weight: 700;
}
.ff-steps__content { margin-top: 16px; }
.ff-steps__title { font-size: 20px; font-weight: 700; color: var(--flower-heading); }
.ff-steps__body { margin-top: 8px; font-size: 15px; color: var(--flower-text-muted); text-align: left; }
@media (max-width: 767px) {
  .ff-steps { grid-auto-flow: row; gap: 0; }
  .ff-steps__item { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 16px; text-align: left; padding-bottom: 28px; }
  .ff-steps__item:not(:last-child)::after { top: 56px; bottom: 0; left: 27px; right: auto; width: 2px; height: auto; }
  .ff-steps__content { margin-top: 12px; }
}

/* 融資との違い(比較表) */
.ff-compare { max-width: 960px; margin: 0 auto; }
.ff-compare__table {
  width: 100%; border-collapse: separate; border-spacing: 0;
  background: var(--flower-surface); border: 1px solid var(--flower-border); border-radius: var(--ff-radius);
  box-shadow: var(--ff-shadow); overflow: hidden;
}
.ff-compare__table th, .ff-compare__table td { padding: 18px 24px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--flower-border); }
.ff-compare__table tr:last-child th, .ff-compare__table tr:last-child td { border-bottom: 0; }
.ff-compare__table thead th { background: var(--flower-cream); color: var(--flower-text-muted); font-size: 14px; }
.ff-compare__table thead th.ff-compare__ours { background: var(--flower-purple-deep); color: #fff; }
.ff-compare__table tbody th { width: 24%; font-weight: 700; color: var(--flower-heading); }
.ff-compare__table td.ff-compare__ours { background: var(--flower-cream); font-weight: 600; }
@media (max-width: 767px) {
  .ff-compare__table, .ff-compare__table tbody, .ff-compare__table tr, .ff-compare__table th, .ff-compare__table td { display: block; width: 100%; }
  .ff-compare__table { border: 0; background: transparent; box-shadow: none; overflow: visible; }
  .ff-compare__table thead { display: none; }
  .ff-compare__table tr {
    margin-bottom: 16px; background: var(--flower-surface); border: 1px solid var(--flower-border);
    border-radius: var(--ff-radius); box-shadow: var(--ff-shadow); overflow: hidden;
  }
  .ff-compare__table tbody th { width: 100%; background: var(--flower-cream); }
  .ff-compare__table td { padding: 12px 20px; }
  .ff-compare__table td::before { content: attr(data-label); display: block; font-size: 12px; font-weight: 700; color: var(--flower-text-muted); }
  .ff-compare__table tr:last-child td { border-bottom: 1px solid var(--flower-border); }
  .ff-compare__table tr td:last-child { border-bottom: 0; }
}

/* 共通条件 */
.ff-conditions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 960px; margin: 0 auto; }
.ff-conditions__item { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 24px; }
.ff-conditions__item dt { font-size: 14px; font-weight: 700; color: var(--flower-orange-text); }
.ff-conditions__value { display: block; font-size: 20px; font-weight: 700; color: var(--flower-heading); line-height: 1.4; }
.ff-conditions__sub { display: block; font-size: 13px; color: var(--flower-text-muted); }
@media (max-width: 767px) {
  .ff-conditions { grid-template-columns: minmax(0, 1fr); }
  .ff-conditions__item { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 20px; }
}

/* ---------- §12 シミュレーター ---------- */
.ff-simulator { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; max-width: var(--ff-max-form); margin: 0 auto; padding: 40px; }
.ff-simulator__form { display: grid; gap: 20px; align-content: start; }
.ff-simulator__result { background: var(--flower-cream); border-radius: 16px; padding: 32px; align-self: start; }
.ff-simulator__result-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ff-simulator__result-title { font-weight: 700; color: var(--flower-heading); font-size: 18px; }
.ff-simulator__figures { margin: 16px 0; }
.ff-simulator__figures > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--flower-border); }
.ff-simulator__figures dt { font-size: 14px; font-weight: 600; color: var(--flower-text-muted); }
.ff-simulator__figures dd { font-size: 28px; font-weight: 700; color: var(--flower-heading); line-height: 1.3; }
.ff-simulator__transfer dd { font-size: 36px; color: var(--flower-orange-text); }
.ff-simulator__unit { font-size: 16px; margin-left: 2px; }
.ff-simulator__note { margin-bottom: 20px; }
@media (max-width: 767px) {
  .ff-simulator { grid-template-columns: minmax(0, 1fr); gap: 24px; padding: 24px 20px; }
  .ff-simulator__result { padding: 24px 20px; }
  .ff-simulator__transfer dd { font-size: 30px; }
}

/* ---------- お客様の声 ---------- */
.ff-voice { display: flex; flex-direction: column; }
.ff-voice__quote { position: relative; padding-top: 28px; font-size: 16px; }
.ff-voice__quote::before {
  content: "\201C"; position: absolute; top: -12px; left: -4px;
  font-size: 64px; line-height: 1; color: var(--flower-orange-soft); font-family: Georgia, serif;
}
.ff-voice__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--flower-border); font-size: 14px; color: var(--flower-text-muted); }
.ff-voice__name { font-weight: 700; color: var(--flower-text); }
.ff-voice__plan { color: var(--flower-orange-text); font-weight: 700; }
.ff-voice__disclaimer { margin-top: 8px; font-size: 13px; color: var(--flower-text-muted); }

/* ---------- §13 FAQ ---------- */
.ff-faq { max-width: 880px; margin: 0 auto; border-top: 1px solid var(--flower-border); }
.ff-faq__item { border-bottom: 1px solid var(--flower-border); }
.ff-faq__question { font-size: inherit; }
.ff-faq__button {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  width: 100%; padding: 20px 4px; border: 0; background: transparent; cursor: pointer;
  font: inherit; font-size: 17px; font-weight: 600; color: var(--flower-text); text-align: left; line-height: 1.6;
}
.ff-faq__icon { position: relative; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--flower-orange-light); }
.ff-faq__icon::before, .ff-faq__icon::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px; background: var(--flower-purple-deep);
}
.ff-faq__icon::after { transform: rotate(90deg); }
.ff-faq__button[aria-expanded="true"] .ff-faq__icon::after { display: none; }
.ff-faq__answer { padding: 0 4px 24px; color: var(--flower-text-muted); }
@media (max-width: 767px) { .ff-faq__button { font-size: 16px; } }

/* ---------- §14 無料見積フォーム ---------- */
.ff-section.ff-section--estimate-form { background: var(--flower-cream); }
.ff-form-card { max-width: var(--ff-max-form); margin: 0 auto; padding: 48px; }
@media (max-width: 767px) { .ff-form-card { padding: 24px 20px; } }
.ff-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 32px; }
.ff-form__full { grid-column: 1 / -1; }
@media (max-width: 767px) { .ff-form__grid { grid-template-columns: minmax(0, 1fr); gap: 20px; } }
.ff-field { display: flex; flex-direction: column; gap: 8px; }
.ff-field__label { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-weight: 700; font-size: 15px; }
.ff-field__help { font-size: 13px; color: var(--flower-text-muted); line-height: 1.6; }
.ff-field__error { font-size: 14px; font-weight: 600; color: var(--flower-danger); }
.ff-field__error::before { content: "! "; }
.ff-input {
  width: 100%; min-height: 52px; padding: 12px 16px;
  border: 1px solid var(--flower-border); border-radius: 12px; background: #fff;
  font: inherit; font-size: 16px; color: var(--flower-text);
}
textarea.ff-input { min-height: 160px; resize: vertical; line-height: 1.7; }
.ff-input::placeholder { color: #8C8079; }
.ff-input:focus-visible { border-color: var(--flower-orange-text); }
.has-error .ff-input { border-color: var(--flower-danger); background: #FFF8F7; }
.ff-select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--flower-orange) 50%), linear-gradient(135deg, var(--flower-orange) 50%, transparent 50%);
  background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%;
  background-size: 6px 6px; background-repeat: no-repeat; padding-right: 44px;
}
.ff-input-unit { display: flex; align-items: center; gap: 8px; }
.ff-input-unit__suffix { flex: none; font-weight: 600; color: var(--flower-text-muted); }
.ff-radio-group { display: flex; flex-wrap: wrap; gap: 12px; }
.ff-radio, .ff-checkbox {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 16px;
  border: 1px solid var(--flower-border); border-radius: 12px; background: #fff; cursor: pointer; font-weight: 600;
}
.ff-radio input, .ff-checkbox input { width: 20px; height: 20px; accent-color: var(--flower-orange-text); margin: 0; }
.ff-field--agreement { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--flower-border); align-items: flex-start; }
.ff-form__actions { margin-top: 32px; max-width: 480px; margin-left: auto; margin-right: auto; }
.ff-form__note { margin-top: 20px; text-align: center; }
.ff-form-errors {
  margin-bottom: 32px; padding: 16px 20px; border-radius: 12px;
  background: #FEF3F2; border: 1px solid #FECDCA; color: var(--flower-danger); font-size: 15px;
}
.ff-form-errors ul { margin-top: 8px; padding-left: 1.2em; list-style: disc; }
.ff-form-success {
  margin-bottom: 24px; padding: 16px 20px; border-radius: 12px;
  background: #ECFDF3; border: 1px solid #ABEFC6; color: var(--flower-success); font-weight: 700;
}
.ff-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ff-file { padding: 12px; min-height: auto; }
.ff-progress { height: 8px; border-radius: 999px; background: var(--flower-orange-light); overflow: hidden; margin: 8px 0 20px; }
.ff-progress__bar { width: 0; height: 100%; background: var(--flower-orange-text); transition: width .2s ease; }
.ff-form .ff-field + .ff-field { margin-top: 20px; }
.ff-form__grid .ff-field + .ff-field, .ff-form__grid > .ff-field { margin-top: 0; }

.ff-section--page { min-height: 60vh; }
.ff-complete { text-align: center; }
.ff-complete .ff-section__title { font-size: clamp(26px, 3.2vw, 36px); margin-bottom: 20px; }
.ff-complete__body { margin-bottom: 24px; }
.ff-complete__reference {
  display: inline-flex; flex-direction: column; margin-bottom: 32px; padding: 16px 32px;
  border-radius: 16px; background: var(--flower-cream);
}
.ff-complete__reference span { font-size: 13px; color: var(--flower-text-muted); }
.ff-complete__reference strong { font-size: 22px; letter-spacing: .06em; color: var(--flower-heading); }

.ff-documents-list { margin-top: 24px; }
.ff-documents { margin-top: 16px; }
.ff-documents__item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 0; border-bottom: 1px solid var(--flower-border); }
.ff-documents__kind { font-weight: 700; }
.ff-documents__date { font-size: 14px; color: var(--flower-text-muted); }
.ff-documents__note { width: 100%; font-size: 14px; color: var(--flower-text-muted); }

/* ---------- §15 Footer ---------- */
.ff-footer { background: var(--flower-purple-deep); color: rgba(255, 255, 255, .9); padding: 64px 0 32px; font-size: 14px; }
.ff-footer__inner { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
.ff-site a.ff-logo--footer { color: #fff; }
.ff-logo--footer .ff-logo__sub { color: rgba(255, 255, 255, .7); }
.ff-footer__heading { margin-top: 16px; font-weight: 700; color: #fff; font-size: 15px; }
.ff-footer__block .ff-footer__heading { margin-top: 0; }
.ff-footer__text { margin-top: 8px; }
.ff-footer__list { margin-top: 12px; }
.ff-footer__list > div { display: grid; grid-template-columns: 6em minmax(0, 1fr); gap: 8px; padding: 4px 0; }
.ff-footer__list dt { color: rgba(255, 255, 255, .7); }
.ff-site .ff-footer a { color: #fff; }
.ff-footer__bottom { margin-top: 40px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .2); }
.ff-footer__links { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.ff-footer__note { margin-top: 12px; color: rgba(255, 255, 255, .75); font-size: 13px; }
.ff-footer__copyright { margin-top: 16px; color: rgba(255, 255, 255, .7); }
@media (max-width: 1199px) { .ff-footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
  .ff-footer { padding: 48px 0 24px; }
  .ff-footer__inner { grid-template-columns: minmax(0, 1fr); gap: 28px; }
}

/* ---------- 管理者プレビュー ---------- */
.ff-preview-bar {
  position: sticky; top: 0; z-index: 60; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px;
  padding: 8px 16px; background: var(--flower-text); color: #fff; font-size: 14px; text-align: center;
}
.ff-site .ff-preview-bar a { color: var(--flower-orange-soft); }
.ff-preview-bar ~ .ff-header { top: 40px; }
.is-preview-hidden { opacity: .55; outline: 2px dashed var(--flower-danger); outline-offset: 4px; }
.ff-preview-badge {
  display: inline-block; margin: 0 0 8px; padding: 2px 10px; border-radius: 999px;
  background: var(--flower-danger); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.6;
}

/* ---------- 元資料(LP)の構成に合わせて追加した部品 ---------- */
/* クラス名は既存のまま(ビューで使用)。色はパープル */
.ff-btn--burgundy, .ff-site a.ff-btn--burgundy { background: var(--flower-purple-deep); color: #fff; }
.ff-plan__price-prefix { font-size: .45em; margin-right: 4px; }
.ff-plan__cta { margin-top: auto; }
.ff-plan__features { margin-bottom: 24px; }
.ff-retention__badge {
  display: inline-block; margin-top: 4px; padding: 0 10px; border-radius: 999px;
  background: var(--flower-orange-light); color: var(--flower-heading); font-size: 12px; font-weight: 700; line-height: 22px;
}

.ff-cta-stats {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 32px 0 0;
}
.ff-cta-stats__item { display: flex; flex-direction: column-reverse; align-items: center; text-align: center; padding: 16px 8px; border-radius: 16px; background: var(--flower-cream); }
.ff-cta-stats__value { font-size: clamp(28px, 3vw, 40px); font-weight: 700; color: var(--flower-heading); line-height: 1.2; }
.ff-cta-stats__label { font-size: 14px; font-weight: 600; color: var(--flower-text-muted); }
@media (max-width: 767px) { .ff-cta-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.ff-compare--single { max-width: 720px; }
.ff-rejected { max-width: 960px; margin: 40px auto 0; }
.ff-rejected__inner { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px; align-items: center; margin-bottom: 16px; }
.ff-rejected__compare > div { display: grid; grid-template-columns: 4em minmax(0, 1fr); gap: 8px; padding: 12px 16px; border-radius: 12px; background: var(--flower-cream); margin-top: 8px; }
.ff-rejected__compare > div.is-ours { background: var(--flower-purple-deep); color: #fff; }
.ff-rejected__compare dt { font-weight: 700; }
@media (max-width: 767px) { .ff-rejected__inner { grid-template-columns: minmax(0, 1fr); } }

.ff-feature__label, .ff-rate__label {
  font-size: 13px; font-weight: 700; letter-spacing: .16em; color: var(--flower-orange-text); margin-bottom: 8px;
}
.ff-points { margin-top: 32px; }
.ff-point { padding: 20px 24px; border-left: 4px solid var(--flower-orange-soft); background: var(--flower-surface); border-radius: 0 16px 16px 0; }
.ff-point__title { font-size: 18px; font-weight: 700; color: var(--flower-heading); }
.ff-point__body { margin-top: 8px; font-size: 15px; }

.ff-rate { display: flex; flex-direction: column; }
.ff-rate__title { font-size: 18px; font-weight: 700; }
.ff-rate__value { font-size: clamp(44px, 5vw, 64px); font-weight: 700; color: var(--flower-orange-text); line-height: 1.15; margin: 8px 0; }
.ff-rate__conditions { margin-top: auto; padding-top: 16px; }
.ff-rate__conditions > div { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--flower-border); font-size: 14px; }
.ff-rate__conditions dt { color: var(--flower-text-muted); }
.ff-rate__conditions dd { font-weight: 700; }

.ff-conditions-group + .ff-conditions-group { margin-top: 40px; }
.ff-conditions-group__title { font-size: 15px; font-weight: 700; letter-spacing: .12em; color: var(--flower-orange-text); margin-bottom: 16px; }
.ff-condition { padding: 24px; }
.ff-condition__title { margin: 0; font-size: 18px; font-weight: 700; color: var(--flower-heading); line-height: 1.4; }
.ff-condition__body { margin-top: 8px; font-size: 15px; }

.ff-steps__duration { margin-top: 8px; font-size: 13px; font-weight: 700; color: var(--flower-orange-text); }

.ff-stance__questions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 32px; }
.ff-stance__questions li { padding: 8px 20px; border-radius: 999px; border: 1px solid var(--flower-border); background: var(--flower-surface); font-weight: 700; color: var(--flower-text-muted); }
.ff-stance__body { max-width: 880px; margin: 0 auto; font-size: var(--ff-size-lead); }
.ff-stance__statements { max-width: 880px; margin: 32px auto; display: grid; gap: 12px; }
.ff-stance__not { padding: 16px 24px; border-radius: 16px; background: var(--flower-surface); border: 1px solid var(--flower-border); color: var(--flower-text-muted); font-weight: 700; }
.ff-stance__is { padding: 16px 24px; border-radius: 16px; background: var(--flower-purple-deep); color: #fff; font-weight: 700; font-size: 20px; }
.ff-stance__closing { max-width: 880px; margin: 0 auto; }
.ff-stance__tagline { margin-top: 24px; text-align: center; letter-spacing: .3em; font-size: 13px; font-weight: 700; color: var(--flower-orange-text); }
.ff-stance__points { margin-top: 40px; }
@media (max-width: 767px) { .ff-stance__body { font-size: 16px; } .ff-stance__is { font-size: 17px; } }

.ff-estimate-phone { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: 4px 16px; margin: -16px auto 32px; text-align: center; }
.ff-estimate-phone__label { font-weight: 700; }
.ff-site a.ff-estimate-phone__number { font-size: 28px; font-weight: 700; color: var(--flower-heading); text-decoration: none; }
.ff-estimate-phone__hours { font-size: 14px; color: var(--flower-text-muted); }

.ff-simulator__range-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.ff-simulator__range-value { font-size: 28px; font-weight: 700; color: var(--flower-heading); }
.ff-range { width: 100%; accent-color: var(--flower-orange-text); min-height: 32px; }
.ff-simulator__range-scale { display: flex; justify-content: space-between; font-size: 13px; color: var(--flower-text-muted); }
.ff-choice-group { display: flex; flex-wrap: wrap; gap: 8px; }
.ff-choice { position: relative; cursor: pointer; }
.ff-choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ff-choice span {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border-radius: 999px;
  border: 1px solid var(--flower-border); background: #fff; font-weight: 700; font-size: 14px;
}
.ff-choice input:checked + span { background: var(--flower-purple-deep); border-color: var(--flower-heading); color: #fff; }
.ff-choice input:focus-visible + span { outline: 3px solid var(--flower-purple-dark); outline-offset: 2px; box-shadow: 0 0 0 6px var(--flower-orange-soft); }
.ff-simulator__cap { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 16px; border-radius: 12px; background: var(--flower-cream); font-weight: 700; }
.ff-simulator__cap strong { font-size: 24px; color: var(--flower-heading); }
.ff-simulator__result-title { font-weight: 700; color: var(--flower-heading); font-size: 16px; }
.ff-simulator__figures dd { font-size: 22px; }
.ff-simulator__transfer dd { font-size: 32px; }
.ff-simulator__points { grid-column: 1 / -1; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 32px; }
.ff-simulator__points li { position: relative; padding-left: 20px; font-size: 14px; color: var(--flower-text-muted); }
.ff-simulator__points li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 8px; height: 8px; border-radius: 50%; background: var(--flower-orange-soft); }
@media (max-width: 767px) { .ff-simulator__points { grid-template-columns: minmax(0, 1fr); } }

/* =====================================================================
 * リッチデザイン(docs/factoring_flower/DESIGN_INTEGRATION_SPEC.md)
 * ===================================================================== */
:root {
  --ff-cream-warm: #FFFDFB;
  --ff-radius-lg: 24px;
  --ff-radius-md: 18px;
  --ff-shadow-lg: 0 18px 50px rgba(70, 45, 30, .10);
  --ff-shadow-md: 0 6px 20px rgba(70, 45, 30, .06);
}

/* §9 カードの階層 */
.ff-card { border-radius: var(--ff-radius-md); box-shadow: var(--ff-shadow-md); }
.ff-plan, .ff-simulator, .ff-form-card, .ff-compare__table { border-radius: var(--ff-radius-lg); box-shadow: var(--ff-shadow-lg); }
.ff-condition { box-shadow: none; }

/* §8 装飾(花・花びらのSVG。aria-hidden・クリック不可、位置は下の「最終ブランド素材」) */
.ff-deco { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.ff-section > .ff-container, .ff-cta > *:not(.ff-deco), .ff-estimate__intro > *:not(.ff-deco) { position: relative; z-index: 1; }
.ff-scallop {
  position: absolute; left: 0; right: 0; bottom: -1px; height: 18px; z-index: 1;
  background: radial-gradient(circle at 12px 18px, var(--ff-cream-warm) 11px, transparent 12px) repeat-x;
  background-size: 24px 18px;
}

/* §7 セクションごとの背景(nth-of-type依存を廃止) */
.ff-section { position: relative; overflow: hidden; }
.ff-section--pricing { background: var(--ff-cream-warm); }
.ff-section--problems, .ff-section--women-only, .ff-section--flow, .ff-section--faq, .ff-section--loan-comparison { background: var(--flower-surface); }
.ff-section--cases, .ff-section--features, .ff-section--common-conditions { background: var(--flower-cream); }
.ff-section--mechanism, .ff-section--testimonials { background: var(--flower-cream); }
.ff-section--rate-factors { background: linear-gradient(180deg, var(--flower-orange-light) 0%, var(--flower-cream) 55%, var(--flower-cream) 100%); }
.ff-section--cta, .ff-section--cta-2, .ff-section--cta-3 { background: var(--flower-surface); }
.ff-section--cta-2, .ff-section--cta-3 { background: var(--flower-cream); }
.ff-section--simulator { background: linear-gradient(180deg, var(--flower-orange-light) 0%, var(--flower-cream) 100%); }
.ff-section--about-service { background: var(--flower-purple-light); }
.ff-section--legal-notice { background: var(--ff-cream-warm); }
.ff-section--estimate-form { background: var(--flower-cream); }

/* 料金 */
.ff-plan--recommended { border-color: var(--flower-orange-soft); box-shadow: 0 22px 60px rgba(212, 85, 0, .18); }
.ff-retention { background: var(--flower-surface); border: 1px solid var(--flower-border); border-radius: var(--ff-radius-lg); padding: 32px 24px; }

/* §2.7 CTA帯 */
.ff-cta {
  position: relative; overflow: hidden;
  /* 白文字のため地は濃いパープル。オレンジの光は右上の角だけ(白文字に対して 5:1 以上を保つ濃さ) */
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 110, 0, .35) 0%, rgba(255, 110, 0, 0) 45%),
    linear-gradient(120deg, var(--flower-purple-deep) 0%, var(--flower-purple-dark) 100%);
  border-radius: var(--ff-radius-lg); box-shadow: var(--ff-shadow-lg); padding: 56px 40px 40px;
}
.ff-cta__sub { font-weight: 700; color: var(--flower-orange-soft); }
.ff-cta__sub::before { content: "＼"; margin-right: 4px; }
.ff-cta__sub::after { content: "／"; margin-left: 4px; }
.ff-cta-stats { margin-top: 32px; gap: 0; background: rgba(255, 255, 255, .96); border-radius: var(--ff-radius-md); overflow: hidden; }
.ff-cta-stats__item { background: transparent; border-radius: 0; padding: 18px 8px; }
.ff-cta-stats__item + .ff-cta-stats__item { border-left: 1px solid var(--flower-border); }
@media (max-width: 767px) {
  .ff-cta { padding: 40px 20px 24px; }
  .ff-cta-stats__item:nth-child(3) { border-left: 0; }
  .ff-cta-stats__item:nth-child(n+3) { border-top: 1px solid var(--flower-border); }
}

/* 統計 */
.ff-stat { border-top: 4px solid var(--flower-orange-soft); }

/* §2.2 利用ケース */
.ff-case__visual {
  margin: -8px -8px 16px; height: 96px; display: flex; align-items: center; justify-content: center;
  border-radius: 16px; background: var(--flower-cream); overflow: hidden;
}
.ff-case__visual img { max-height: 80px; width: auto; }
.ff-case:nth-child(3n+2) .ff-case__visual { background: var(--flower-cream); }
.ff-case:nth-child(3n+2) { background: var(--ff-cream-warm); }
.ff-case__number {
  display: inline-block; align-self: flex-start; padding: 2px 12px; border-radius: 999px; margin-bottom: 10px;
  background: var(--flower-orange-light); color: var(--flower-orange-text); font-size: 12px; letter-spacing: .12em;
}

/* 仕組み・融資との違い */
.ff-section--mechanism .ff-steps__number { box-shadow: 0 0 0 6px var(--flower-orange-light); }
.ff-rejected { border-top: 4px solid var(--flower-orange); }

/* §2.3 安心ポイント(2x2) */
.ff-point {
  display: flex; gap: 16px; align-items: flex-start; border-left: 0; border-radius: var(--ff-radius-md);
  background: var(--flower-surface); border: 1px solid var(--flower-border); padding: 20px 22px;
}
.ff-point__icon {
  flex: none; width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center;
  background: var(--flower-orange-light); overflow: hidden;
}
.ff-point:nth-child(even) .ff-point__icon { background: var(--flower-green-light); }
.ff-point__icon img { width: 48px; height: 48px; }
.ff-point__content { min-width: 0; }

/* §2.4 独自機能 */
.ff-feature__head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 14px; }
.ff-feature__icon {
  width: 52px; height: 52px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--flower-cream); transition: transform .15s ease;
}
.ff-feature:nth-child(3n+2) .ff-feature__icon { background: var(--flower-purple-light); }
.ff-feature:nth-child(3n) .ff-feature__icon { background: var(--flower-green-light); }
.ff-feature__icon img { width: 52px; height: 52px; }
.ff-feature:hover .ff-feature__icon { transform: translateY(-1px); }
.ff-badge--planned { background: var(--flower-cream); color: var(--flower-heading); border: 1px dashed var(--flower-orange-soft); font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .ff-feature__icon { transition: none; } }

/* 料率の決まり方 */
.ff-rate { background: rgba(255, 255, 255, .92); }
.ff-rate:nth-child(2) { border-color: var(--flower-orange-soft); }
.ff-rate:nth-child(3) { border-color: var(--flower-orange-soft); }

/* §2.6 共通条件 */
.ff-conditions-group__title {
  display: inline-block; margin-bottom: 16px; padding: 6px 18px; border-radius: 999px;
  font-size: 13px; letter-spacing: .12em; color: #fff; background: var(--flower-orange-text);
}
.ff-conditions-group--2 .ff-conditions-group__title { background: var(--flower-green-deep); }
.ff-conditions-group--3 .ff-conditions-group__title { background: var(--flower-orange); color: var(--flower-on-orange); }
.ff-conditions-group--4 .ff-conditions-group__title { background: var(--flower-purple-deep); }
.ff-condition { background: var(--flower-surface); border: 1px solid var(--flower-border); border-radius: 16px; }
.ff-conditions-group--1 .ff-condition { border-top: 3px solid var(--flower-orange); }
.ff-conditions-group--2 .ff-condition { border-top: 3px solid var(--flower-green); }
.ff-conditions-group--3 .ff-condition { border-top: 3px solid var(--flower-orange); }
.ff-conditions-group--4 .ff-condition { border-top: 3px solid var(--flower-purple); }
.ff-condition .ff-badge--planned { margin-bottom: 8px; }

/* §2.5 利用の流れ(アイコン付き) */
.ff-steps--visual { gap: 24px; }
.ff-steps--visual .ff-steps__item {
  background: var(--flower-surface); border: 1px solid var(--flower-border); border-radius: var(--ff-radius-md);
  box-shadow: var(--ff-shadow-md); padding: 28px 20px 24px;
}
.ff-steps__icon { position: relative; display: inline-flex; width: 64px; height: 64px; }
.ff-steps__icon img { width: 64px; height: 64px; }
.ff-steps__badge {
  position: absolute; top: -6px; right: -10px; width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: var(--flower-purple-deep); color: #fff; font-size: 14px; font-weight: 700; box-shadow: 0 0 0 3px #fff;
}
.ff-steps--visual .ff-steps__item:not(:last-child)::after {
  top: 60px; left: auto; right: -24px; width: 24px; background: var(--flower-orange-soft);
}
@media (max-width: 767px) {
  .ff-steps--visual { gap: 20px; }
  .ff-steps--visual .ff-steps__item { grid-template-columns: 64px minmax(0, 1fr); padding: 18px 16px; }
  .ff-steps--visual .ff-steps__content { margin-top: 0; }
  .ff-steps--visual .ff-steps__item:not(:last-child)::after { top: auto; bottom: -21px; left: 47px; right: auto; width: 2px; height: 20px; }
}

/* シミュレーター(明るいオレンジ〜クリームの地 + 白いカード、結果はオレンジ枠) */
.ff-simulator__result { background: var(--flower-surface); border: 2px solid var(--flower-orange); box-shadow: var(--ff-shadow-md); }

/* お客様の声 */
.ff-section--testimonials .ff-section__lead {
  display: inline-block; font-size: 14px; padding: 10px 18px; border-radius: 12px; background: var(--flower-surface); border: 1px solid var(--flower-border);
}
.ff-voice { border-radius: var(--ff-radius-md); }

/* 私たちの立場(薄いパープルの地。文字は通常の濃色) */
.ff-section--about-service .ff-stance__is { background: var(--flower-orange); color: var(--flower-on-orange); }
.ff-section--about-service .ff-deco > img { opacity: .5; }

/* §2.8 無料見積(左: パープル 40% / 右: 白いフォーム 60%) */
.ff-estimate { display: grid; grid-template-columns: minmax(0, 40fr) minmax(0, 60fr); border-radius: var(--ff-radius-lg); overflow: hidden; box-shadow: var(--ff-shadow-lg); }
.ff-estimate__intro {
  position: relative; overflow: hidden; padding: 48px 36px; color: #fff;
  background:
    radial-gradient(circle at 0% 100%, rgba(255, 110, 0, .3) 0%, rgba(255, 110, 0, 0) 45%),
    linear-gradient(160deg, var(--flower-purple-deep) 0%, var(--flower-purple-dark) 100%);
}
.ff-estimate__intro .ff-section__header { text-align: left; margin: 0 0 24px; }
.ff-estimate__intro .ff-section__eyebrow { color: var(--flower-orange-soft); }
.ff-estimate__intro .ff-section__title { color: #fff; font-size: clamp(28px, 3vw, 40px); }
.ff-estimate__intro .ff-section__lead { color: rgba(255, 255, 255, .9); font-size: 16px; }
.ff-estimate__intro .ff-estimate-phone { margin: 0; justify-content: flex-start; text-align: left; padding: 16px 20px; border-radius: 16px; background: rgba(255, 255, 255, .12); flex-direction: column; align-items: flex-start; }
.ff-estimate__intro .ff-estimate-phone__label { color: var(--flower-orange-soft); }
.ff-site .ff-estimate__intro a.ff-estimate-phone__number { color: #fff; }
.ff-estimate__intro .ff-estimate-phone__hours { color: rgba(255, 255, 255, .85); }
.ff-estimate__form { background: var(--flower-surface); }
.ff-estimate__form .ff-form-card { border: 0; border-radius: 0; box-shadow: none; max-width: none; padding: 40px; }
@media (max-width: 1199px) {
  .ff-estimate { grid-template-columns: minmax(0, 1fr); }
  .ff-estimate__intro { padding: 36px 28px; }
}
@media (max-width: 767px) {
  .ff-estimate__intro { padding: 28px 20px; }
  .ff-estimate__form .ff-form-card { padding: 24px 20px; }
}

.ff-cta-stats { background: var(--flower-surface); }

/* =====================================================================
 * 最終ブランド素材(docs/factoring_flower/FINAL_BRAND_ASSETS.md)
 * ロゴ・ヒーローの女性・花/花びらの装飾はChatGPT作成のSVGをそのまま使う。
 * ===================================================================== */
.ff-deco > img { position: absolute; display: block; height: auto; max-width: none; }

/* CTA帯 */
.ff-cta > .ff-deco .ff-deco__flower-large { width: 180px; top: -60px; left: -50px; opacity: .2; }
.ff-cta > .ff-deco .ff-deco__flower-small { width: 56px; top: 28%; right: 6%; opacity: .5; }
.ff-cta > .ff-deco .ff-deco__petal { width: 40px; top: 14%; left: 18%; opacity: .55; transform: rotate(20deg); }
.ff-cta > .ff-deco .ff-deco__pattern { width: 200px; top: 8%; right: 14%; opacity: .3; }

/* 無料見積(左パネル) */
.ff-estimate__intro .ff-deco__flower-large { width: 200px; bottom: -50px; right: -50px; opacity: .22; }
.ff-estimate__intro .ff-deco__petal { width: 42px; bottom: 22%; right: 30%; opacity: .55; transform: rotate(-14deg); }

/* 私たちの立場: 装飾はコンテナの外(ページの端)まで広げ、本文より背面に置く */
.ff-section--about-service .ff-container > .ff-deco { overflow: visible; }
.ff-section--about-service .ff-container > *:not(.ff-deco) { position: relative; z-index: 1; }
.ff-section--about-service .ff-deco__flower-large { width: 240px; top: -40px; right: -70px; opacity: .18; }
.ff-section--about-service .ff-deco__flower-small { width: 60px; bottom: 6%; left: 2%; opacity: .4; }
.ff-section--about-service .ff-deco__petal { width: 40px; top: 20%; left: 4%; opacity: .5; transform: rotate(18deg); }
.ff-section--about-service .ff-deco__pattern { width: 220px; bottom: 4%; right: 6%; opacity: .25; }

@media (max-width: 767px) {
  .ff-cta > .ff-deco .ff-deco__pattern { display: none; }
}

/* =====================================================================
 * 法的な位置づけ(Issue #206)
 * 安心色のグリーンで「確認すべき点」を示す。注記と金融庁へのリンクは本文と同じ大きさで、
 * 要点の直後に置く(小さく隠さない)。
 * ===================================================================== */
.ff-visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.ff-legal__points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; max-width: 1040px; margin: 0 auto; counter-reset: none; }
.ff-legal__point {
  display: flex; gap: 16px; align-items: flex-start; padding: 24px;
  background: var(--flower-surface); border: 1px solid var(--flower-border); border-top: 4px solid var(--flower-green);
  border-radius: var(--ff-radius-md); box-shadow: var(--ff-shadow-md);
}
.ff-legal__number {
  flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--flower-green-light); color: var(--flower-green-deep); font-weight: 700; font-size: 15px;
}
.ff-legal__content { min-width: 0; }
.ff-legal__title { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.5; color: var(--flower-heading); }
.ff-legal__body { margin-top: 8px; font-size: 15px; color: var(--flower-text); }
.ff-legal__footer {
  max-width: 1040px; margin: 24px auto 0; padding: 24px 28px;
  background: var(--flower-green-light); border: 1px solid var(--flower-green); border-radius: var(--ff-radius-md);
}
.ff-legal__note { font-size: 15px; color: var(--flower-text); }
.ff-legal__links { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 16px; }
.ff-site a.ff-legal__link { color: var(--flower-green-deep); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.ff-site a.ff-legal__link::after { content: "\2197"; margin-left: 4px; text-decoration: none; display: inline-block; }
.ff-site a.ff-legal__link:hover { color: var(--flower-heading); }
@media (max-width: 767px) {
  .ff-legal__points { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ff-legal__point { padding: 20px; }
  .ff-legal__footer { padding: 20px; }
}

/* ---------- プライバシーポリシー(/privacy) ---------- */
.ff-section--privacy-policy { background: var(--flower-cream); }
.ff-privacy__header { margin-bottom: 32px; text-align: center; }
.ff-privacy__logo { display: block; width: 96px; height: auto; margin: 0 auto 16px; }
.ff-privacy__eyebrow { margin: 0 0 8px; color: var(--flower-orange-text); font-size: 13px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.ff-privacy__lead {
  margin: 0 auto 32px; max-width: 820px; padding: 24px 28px; border-left: 4px solid var(--flower-purple);
  border-radius: var(--ff-radius); background: var(--flower-purple-light); line-height: 1.9;
}
.ff-privacy__items { display: grid; gap: 16px; max-width: 820px; margin: 0 auto; padding: 0; list-style: none; }
.ff-privacy__item, .ff-privacy__contact {
  padding: 24px 28px; border: 1px solid var(--flower-border); border-radius: var(--ff-radius); background: var(--flower-surface);
  box-shadow: var(--ff-shadow-md);
}
.ff-privacy__title { display: flex; align-items: baseline; gap: 12px; margin: 0; font-size: 18px; font-weight: 700; color: var(--flower-heading); }
.ff-privacy__number { flex: none; font-size: 14px; font-weight: 700; color: var(--flower-orange-text); letter-spacing: .08em; }
.ff-privacy__body { margin-top: 12px; font-size: 15px; line-height: 1.9; }
.ff-privacy__contact { max-width: 820px; margin: 16px auto 0; }
.ff-privacy__contact-list { margin: 12px 0 0; }
.ff-privacy__contact-list div { display: grid; grid-template-columns: 8em minmax(0, 1fr); gap: 12px; padding: 6px 0; }
.ff-privacy__contact-list dt { color: var(--flower-text-muted); font-weight: 600; }
.ff-privacy__contact-list dd { margin: 0; }
.ff-privacy__dates { max-width: 820px; margin: 24px auto 0; text-align: right; }
.ff-privacy__back { margin: 32px 0 0; text-align: center; }
@media (max-width: 767px) {
  .ff-privacy__header { margin-bottom: 24px; }
  .ff-privacy__logo { width: 80px; }
  .ff-privacy__lead { padding: 20px; }
  .ff-privacy__item, .ff-privacy__contact { padding: 20px; }
  .ff-privacy__contact-list div { grid-template-columns: minmax(0, 1fr); gap: 0; }
}