/* landowner_flow_purple_20260707: 本文テーマを緑→紫(landownerセクション統一)へ写像。ヘッダー(.header/.sp-menu)はブランド緑を保持。CSS-only, HTML不変更 */
@charset "UTF-8";
/* =============================================================================
   page-lv-lo-flow.css  —  低圧・土地オーナー「導入の流れ」ページ 専用スタイル
   REVIX WEBサイト設計仕様書 v1.3 準拠（§3 カラー / §7-2 確定数値 / §7-2e-f / §4-3）
   低圧テーマ＝グリーン（§3-3b：#31A886 / deep #155442 / 白×deep 9.9:1 ✓）

   方針：CSSのみのリスキン。文言・構成・DOM構造・CTA導線・schema・注記は不変。
   すべて body#lv-lo-flow 配下にスコープし他ページへ非干渉。
   font-size は 11/12/13/14/15/16/18/20/25/31 の10段階＋ヒーロー見出しのみ40px
   （ヒーロー/末尾CTAのH1のみ意図的にディスプレイサイズ40px＝依頼「おしゃれにおまかせ」。モバイル31px）。
   radius は 6 / 12 / 999px（＋円=50%）のみ。余白は 4/8/12/16/24/32/48/64/96。
   有彩色＝テーマ色濃淡＋CTA金のみ（60-30-10）。
   ========================================================================== */

/* ---- 1. テーマトークン ---------------------------------------------------- */
body#lv-lo-flow {
  --theme: #31A886;        /* 主色：塗り・アクセント・境界・図解主色（大字/図形用） */
  --theme-ink: #22745D;    /* テーマ濃色：小さな緑テキスト＆白文字チップ地（AA確保：緑字×白=6.7:1／白×地=6.7:1） */
  --theme-deep: #155442;   /* 白文字下地（白と9.9:1） */
  --theme-tint: #F1F8F6;   /* 背景面（淡地） */
  --cta: #F5B500;          /* CTA金：全サイト唯一の行動色。CTA以外に使わない */
  --ink: #16181C;          /* 本文インク */
  --sub: #5A6270;          /* 補助テキスト */
  --line: #E2E5E8;         /* 境界線 */
  --paper: #F4F6F8;        /* 中立の淡地 */

  --font-sans: "Zen Kaku Gothic New", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
  --font-en: "Barlow", var(--font-sans);   /* 英字キッカー・数字（§4-3 / §7-2b） */

  --radius-card: 12px;
  --radius-sm: 6px;
  --shadow-soft: 0 12px 32px rgba(21, 84, 66, 0.10);
  --shadow-card: 0 8px 24px rgba(21, 84, 66, 0.08);

  color: var(--ink);
  font-family: var(--font-sans);
  word-break: keep-all;
  overflow-wrap: break-word;
}

/* ---- 2. 基本レイアウト・共有クラス --------------------------------------- */
body#lv-lo-flow #wrapper { overflow: clip; }
body#lv-lo-flow #contents { min-height: 100vh; }

body#lv-lo-flow .skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 10000;
  padding: 12px 16px;
  border-radius: var(--radius-sm);
  color: #fff;
  background: var(--theme-deep);
  transform: translateY(-160%);
}
body#lv-lo-flow .skip-link:focus { transform: translateY(0); }

body#lv-lo-flow .page-container {
  width: min(1200px, 100% - 64px);
  margin: 0 auto;
}

/* 見出し（section-heading＝英字キッカー×日本語H2の2層 §4-3） */
body#lv-lo-flow .section-heading {
  display: grid;
  gap: 16px;
}
body#lv-lo-flow .section-heading__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  color: var(--theme-ink);
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
body#lv-lo-flow .section-heading__eyebrow::before {
  width: 32px;
  height: 2px;
  content: "";
  background: currentColor;
}
body#lv-lo-flow .section-heading__title {
  color: var(--ink);
  font-size: 25px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.01em;
}
body#lv-lo-flow .section-heading__lead {
  max-width: 720px;
  color: var(--sub);
  font-size: 16px;
  line-height: 1.9;
}

/* ボタン（CTA金＝§7-2e） */
body#lv-lo-flow .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 56px;
  padding: 0 32px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease, background-color 0.2s ease;
}
body#lv-lo-flow .button--primary {
  color: var(--ink);
  background: var(--cta);
  box-shadow: 0 12px 28px rgba(245, 181, 0, 0.28);
}
body#lv-lo-flow .button--secondary {
  color: var(--theme-deep);
  border-color: rgba(21, 84, 66, 0.24);
  background: #fff;
}
body#lv-lo-flow .button__arrow {
  display: grid;
  width: 26px;
  height: 26px;
  margin-left: 12px;
  border-radius: 999px;
  color: #fff;
  background: var(--theme-deep);
  place-items: center;
}
body#lv-lo-flow .button__arrow::before {
  width: 6px;
  height: 6px;
  border-top: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  content: "";
  transform: rotate(45deg);
}
body#lv-lo-flow .button:focus-visible {
  outline: 2px solid var(--theme-deep);
  outline-offset: 2px;
}
body#lv-lo-flow .button--primary:active { transform: translateY(1px); }

@media (hover: hover) and (pointer: fine) {
  body#lv-lo-flow .button--primary:hover {
    filter: brightness(0.92);
    box-shadow: 0 16px 34px rgba(245, 181, 0, 0.32);
  }
  body#lv-lo-flow .button--secondary:hover {
    border-color: var(--theme);
    background: var(--theme-tint);
  }
}

/* =============================================================================
   3. パンくず
   ========================================================================== */
body#lv-lo-flow .breadcrumb {
  padding: 16px 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: #fff;
}
body#lv-lo-flow .breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 0;
  list-style: none;
  color: var(--sub);
  font-size: 12px;
}
body#lv-lo-flow .breadcrumb__item {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
body#lv-lo-flow .breadcrumb__item:not(:last-child)::after {
  width: 5px;
  height: 5px;
  border-top: 1px solid var(--sub);
  border-right: 1px solid var(--sub);
  content: "";
  transform: rotate(45deg);
}
body#lv-lo-flow .breadcrumb__link { text-decoration: none; }

/* =============================================================================
   4. ヒーロー
   ========================================================================== */
body#lv-lo-flow .flow-hero {
  position: relative;
  padding: 64px 0 0;
  background:
    radial-gradient(circle at 82% 4%, rgba(49, 168, 134, 0.10), transparent 26%),
    linear-gradient(180deg, #fff 0%, var(--theme-tint) 100%);
}
body#lv-lo-flow .flow-hero::before {
  position: absolute;
  top: 48px;
  right: -180px;
  width: 440px;
  border: 1px solid rgba(49, 168, 134, 0.16);
  border-radius: 999px;
  content: "";
  aspect-ratio: 1;
}
body#lv-lo-flow .flow-hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(400px, 1.05fr);
  align-items: center;
  gap: 64px;
}
body#lv-lo-flow .flow-hero__content { padding: 16px 0 64px; }

body#lv-lo-flow .flow-hero__eyebrow {
  color: var(--theme-ink);
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
body#lv-lo-flow .flow-hero__label {
  display: inline-flex;
  margin-top: 16px;
  padding: 8px 16px;
  border-radius: 999px;
  color: var(--theme-deep);
  background: var(--theme-tint);
  font-size: 13px;
  font-weight: 700;
}
body#lv-lo-flow .flow-hero__title {
  margin-top: 24px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.02em;
  text-wrap: balance;
}
body#lv-lo-flow .flow-hero__title span {
  display: block;
  margin-top: 8px;
  color: var(--theme);
  text-wrap: balance;
}
body#lv-lo-flow .flow-hero__lead {
  max-width: 620px;
  margin-top: 24px;
  color: var(--sub);
  font-size: 18px;
  line-height: 1.9;
}
body#lv-lo-flow .flow-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 32px;
}
body#lv-lo-flow .flow-hero__note {
  margin-top: 16px;
  color: var(--sub);
  font-size: 12px;
  line-height: 1.75;
}
body#lv-lo-flow .flow-hero__visual {
  position: relative;
  align-self: stretch;
  min-height: 560px;
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius-card);
  box-shadow: 0 24px 64px rgba(21, 84, 66, 0.16);
}
body#lv-lo-flow .flow-hero__visual picture,
body#lv-lo-flow .flow-hero__visual img { width: 100%; height: 100%; }
body#lv-lo-flow .flow-hero__visual img { object-fit: cover; object-position: center; }

body#lv-lo-flow .flow-hero__caption,
body#lv-lo-flow .flow-step__visual figcaption,
body#lv-lo-flow .flow-mid-cta__visual figcaption {
  position: absolute;
  right: 12px;
  bottom: 12px;
  padding: 8px 12px;
  border-radius: 999px;
  color: #fff;
  background: rgba(22, 24, 28, 0.72);
  font-size: 11px;
  line-height: 1.3;
}

/* 実績ステータス 01/02/03（等寸カード） */
body#lv-lo-flow .flow-hero__status {
  position: relative;
  z-index: 2;
  margin-top: -40px;
}
body#lv-lo-flow .flow-hero__status-inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  overflow: hidden;
  border-radius: var(--radius-card);
  background: var(--theme-deep);
  box-shadow: 0 16px 40px rgba(21, 84, 66, 0.20);
}
body#lv-lo-flow .flow-hero__status-item {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 96px;
  padding: 24px 32px;
  color: #fff;
}
body#lv-lo-flow .flow-hero__status-item:not(:last-child) {
  border-right: 1px solid rgba(255, 255, 255, 0.18);
}
body#lv-lo-flow .flow-hero__status-item strong {
  color: var(--cta);
  font-family: var(--font-en);
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.06em;
}
body#lv-lo-flow .flow-hero__status-item span {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}

/* =============================================================================
   4b. 要点ブロック（設計書v2.0 §6-1/§8-1-5：H1直下・3行・断定＋ページ内出典）
   ========================================================================== */
body#lv-lo-flow .flow-key-points {
  padding: 32px 0;
  background: var(--theme-tint);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
body#lv-lo-flow .flow-key-points__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
body#lv-lo-flow .flow-key-points__item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
body#lv-lo-flow .flow-key-points__icon {
  flex: 0 0 auto;
  display: grid;
  width: 22px;
  height: 22px;
  margin-top: 2px;
  border-radius: 999px;
  color: #fff;
  background: var(--theme-ink);
  place-items: center;
}
body#lv-lo-flow .flow-key-points__icon::before {
  width: 8px;
  height: 5px;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  content: "";
  transform: rotate(-45deg) translate(1px, -1px);
}
body#lv-lo-flow .flow-key-points__item p {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.75;
}
body#lv-lo-flow .flow-key-points__item a {
  color: var(--theme-ink);
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
}
body#lv-lo-flow .flow-key-points__item a:hover { color: var(--theme-deep); }

@media (max-width: 900px) {
  body#lv-lo-flow .flow-key-points__list { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 560px) {
  body#lv-lo-flow .flow-key-points { padding: 24px 0; }
}

/* =============================================================================
   5. 不安の言語化（Before You Start）
   ========================================================================== */
body#lv-lo-flow .flow-concerns {
  padding: 96px 0;
  background: #fff;
}
body#lv-lo-flow .flow-concerns__inner {
  display: grid;
  grid-template-columns: minmax(300px, 0.8fr) minmax(0, 1.2fr);
  gap: 64px;
}
body#lv-lo-flow .flow-concerns__grid {
  display: grid;
  gap: 16px;
}
body#lv-lo-flow .flow-concerns__card {
  position: relative;
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 4px 24px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: #fff;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
body#lv-lo-flow .flow-concerns__number {
  grid-row: 1 / 3;
  color: var(--theme);
  font-family: var(--font-en);
  font-size: 25px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
body#lv-lo-flow .flow-concerns__title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
}
body#lv-lo-flow .flow-concerns__text {
  margin-top: 8px;
  color: var(--sub);
  font-size: 14px;
  line-height: 1.85;
}

/* =============================================================================
   6. 6ステップ目次（井上型：Barlow大数字＋テーマ下線）— deep地
   ========================================================================== */
body#lv-lo-flow .flow-overview {
  position: relative;
  padding: 96px 0;
  color: #fff;
  background:
    linear-gradient(135deg, var(--theme-deep), #22745D),
    radial-gradient(circle at 10% 30%, rgba(255, 255, 255, 0.10), transparent 24%);
}
body#lv-lo-flow .flow-overview::after {
  position: absolute;
  right: 5%;
  bottom: 0;
  width: 260px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 50% 50% 0 0;
  content: "";
  aspect-ratio: 1 / 0.58;
}
body#lv-lo-flow .flow-overview__heading { max-width: 820px; }
body#lv-lo-flow .flow-overview .section-heading__eyebrow { color: #C3E3DA; }
body#lv-lo-flow .flow-overview .section-heading__title,
body#lv-lo-flow .flow-overview .section-heading__lead { color: #fff; }

body#lv-lo-flow .flow-overview__list {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 48px;
  padding: 0;
  list-style: none;
}
body#lv-lo-flow .flow-overview__item { min-width: 0; }
body#lv-lo-flow .flow-overview__link {
  position: relative;
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 20px;
  min-height: 118px;
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: var(--radius-card);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  text-decoration: none;
  transition: transform 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}
body#lv-lo-flow .flow-overview__link:visited { color: #fff; }
/* 大数字＋テーマ金下線 */
body#lv-lo-flow .flow-overview__number {
  display: inline-flex;
  align-items: flex-end;
  padding-bottom: 4px;
  border-bottom: 2px solid var(--cta);
  color: #fff;
  font-family: var(--font-en);
  font-size: 31px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
}
body#lv-lo-flow .flow-overview__body { display: grid; gap: 4px; }
body#lv-lo-flow .flow-overview__body strong { font-size: 16px; line-height: 1.5; }
body#lv-lo-flow .flow-overview__body small {
  color: rgba(255, 255, 255, 0.72);
  font-size: 12px;
}
body#lv-lo-flow .flow-overview__note {
  max-width: 900px;
  margin-top: 24px;
  color: rgba(255, 255, 255, 0.70);
  font-size: 12px;
  line-height: 1.8;
}

/* =============================================================================
   7. ステップ詳細（左右交互）
   ========================================================================== */
body#lv-lo-flow .flow-steps {
  padding: 96px 0 0;
  background: #fff;
}
body#lv-lo-flow .flow-steps__intro { padding-bottom: 64px; }

body#lv-lo-flow .flow-step {
  position: relative;
  padding: 64px 0;
  border-top: 1px solid var(--line);
}
body#lv-lo-flow .flow-step:nth-of-type(even) { background: var(--paper); }
body#lv-lo-flow .flow-step__inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(380px, 0.92fr);
  align-items: center;
  gap: 64px;
}
body#lv-lo-flow .flow-step--reverse .flow-step__content { order: 2; }
body#lv-lo-flow .flow-step--reverse .flow-step__visual,
body#lv-lo-flow .flow-step--reverse .flow-step__inspection { order: 1; }

/* STEP 0X ＝ 英字キッカー（Barlow・テーマ色・下線） */
body#lv-lo-flow .flow-step__number {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 2px solid var(--theme-ink);
  color: var(--theme-ink);
  font-family: var(--font-en);
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
body#lv-lo-flow .flow-step__title {
  margin-top: 16px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.55;
}
body#lv-lo-flow .flow-step__lead {
  margin-top: 16px;
  color: var(--sub);
  font-size: 16px;
  line-height: 1.9;
}
body#lv-lo-flow .flow-step__roles {
  display: grid;
  gap: 12px;
  margin-top: 24px;
}
body#lv-lo-flow .flow-step__role {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 24px;
  padding: 16px 20px;
  border-radius: var(--radius-card);
  background: var(--theme-tint);
}
body#lv-lo-flow .flow-step:nth-of-type(even) .flow-step__role { background: #fff; }
/* 役割タグ：テーマ色チップ＋インク（§3-5） */
body#lv-lo-flow .flow-step__role dt {
  display: inline-flex;
  align-items: center;
  align-self: start;
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  color: #fff;
  background: var(--theme-ink);
  font-size: 13px;
  font-weight: 700;
}
body#lv-lo-flow .flow-step__role dd {
  margin: 0;
  color: var(--ink);
  font-size: 14px;
  line-height: 1.75;
}
body#lv-lo-flow .flow-step__meta {
  display: grid;
  grid-template-columns: 120px 1fr;
  gap: 16px;
  margin-top: 16px;
  padding: 16px;
  border-left: 3px solid var(--cta);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--sub);
  background: #FFFDF4;
  font-size: 13px;
  line-height: 1.7;
}
body#lv-lo-flow .flow-step__meta span { color: var(--ink); font-weight: 700; }

body#lv-lo-flow .flow-step__visual {
  position: relative;
  aspect-ratio: 1400 / 950;
  margin: 0;
  overflow: hidden;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-soft);
}
body#lv-lo-flow .flow-step__visual picture,
body#lv-lo-flow .flow-step__visual img { display: block; width: 100%; height: 100%; }
body#lv-lo-flow .flow-step__visual img { object-fit: cover; object-position: center; }

/* STEP03 確認項目タイル（deep地） */
body#lv-lo-flow .flow-step__inspection {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  padding: 32px;
  border-radius: var(--radius-card);
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.10), transparent 22%),
    var(--theme-deep);
  box-shadow: var(--shadow-soft);
}
body#lv-lo-flow .flow-step__inspection span {
  display: flex;
  align-items: center;
  min-height: 88px;
  padding: 16px 20px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--radius-card);
  color: #fff;
  background: rgba(255, 255, 255, 0.06);
  font-size: 15px;
  font-weight: 700;
}
body#lv-lo-flow .flow-step__inspection span::before {
  display: grid;
  width: 28px;
  margin-right: 12px;
  border-radius: 999px;
  color: var(--theme-deep);
  background: var(--cta);
  font-size: 12px;
  content: "\2713";
  aspect-ratio: 1;
  place-items: center;
}

/* =============================================================================
   8. 役割分担表
   ========================================================================== */
body#lv-lo-flow .flow-responsibility {
  padding: 96px 0;
  background: var(--theme-tint);
}
body#lv-lo-flow .flow-responsibility__inner { display: grid; gap: 48px; }
body#lv-lo-flow .flow-responsibility__table-wrap {
  overflow-x: auto;
  border-radius: var(--radius-card);
  background: #fff;
  box-shadow: var(--shadow-card);
}
body#lv-lo-flow .flow-responsibility__table-wrap:focus-visible {
  outline: 2px solid var(--theme-deep);
  outline-offset: 2px;
}
body#lv-lo-flow .flow-responsibility__table {
  width: 100%;
  min-width: 820px;
  border-collapse: collapse;
}
body#lv-lo-flow .flow-responsibility__table th,
body#lv-lo-flow .flow-responsibility__table td {
  padding: 24px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  font-size: 14px;
  line-height: 1.8;
}
body#lv-lo-flow .flow-responsibility__table td { color: var(--sub); }
body#lv-lo-flow .flow-responsibility__table thead th {
  color: #fff;
  background: var(--theme-deep);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
/* ゼブラ（tint地） */
body#lv-lo-flow .flow-responsibility__table tbody tr:nth-child(even) td,
body#lv-lo-flow .flow-responsibility__table tbody tr:nth-child(even) th { background: var(--theme-tint); }
body#lv-lo-flow .flow-responsibility__table tbody th {
  width: 18%;
  color: var(--theme-deep);
  background: #F8FBF9;
  font-weight: 700;
}
body#lv-lo-flow .flow-responsibility__note { color: var(--sub); font-size: 12px; }

/* =============================================================================
   9. 事前準備（Preparation）
   ========================================================================== */
body#lv-lo-flow .flow-precheck {
  padding: 96px 0;
  background: #fff;
}
body#lv-lo-flow .flow-precheck__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  align-items: stretch;
  gap: 48px;
}
body#lv-lo-flow .flow-precheck__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 32px;
  padding: 0;
  list-style: none;
}
body#lv-lo-flow .flow-precheck__item {
  display: flex;
  align-items: center;
  min-height: 64px;
  padding: 16px;
  border-radius: var(--radius-card);
  color: var(--ink);
  background: var(--paper);
  font-size: 14px;
  font-weight: 600;
}
body#lv-lo-flow .flow-precheck__item span {
  display: grid;
  flex: 0 0 auto;
  width: 26px;
  margin-right: 12px;
  border-radius: 999px;
  color: #fff;
  background: var(--theme);
  aspect-ratio: 1;
  place-items: center;
}
body#lv-lo-flow .flow-precheck__item span::before {
  width: 8px;
  height: 5px;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  content: "";
  transform: rotate(-45deg) translate(1px, -1px);
}
body#lv-lo-flow .flow-precheck__link {
  display: inline-flex;
  align-items: center;
  margin-top: 24px;
  color: var(--theme-ink);
  font-size: 14px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 5px;
}
body#lv-lo-flow .flow-precheck__link:hover { color: var(--theme-deep); }

body#lv-lo-flow .flow-precheck__aside {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 460px;
  padding: 32px;
  overflow: hidden;
  border-radius: var(--radius-card);
  color: #fff;
  background: linear-gradient(160deg, var(--theme) 0%, var(--theme-deep) 100%);
  box-shadow: 0 20px 56px rgba(21, 84, 66, 0.18);
}
/* 上部の余白を意図的な意匠に：位置マーカー型の装飾アイコン＋大きな背景リング（絶対配置でテキスト群には非干渉） */
body#lv-lo-flow .flow-precheck__aside::before {
  content: "";
  position: absolute;
  top: 32px;
  left: 32px;
  width: 56px;
  height: 56px;
  border: 2px solid rgba(255, 255, 255, 0.45);
  border-radius: 999px;
  background: radial-gradient(circle at center, #fff 0 6px, transparent 7px);
}
body#lv-lo-flow .flow-precheck__aside::after {
  content: "";
  position: absolute;
  top: -60px;
  right: -60px;
  width: 220px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  aspect-ratio: 1;
}
body#lv-lo-flow .flow-precheck__aside-label {
  color: #D0E9E2;
  font-family: var(--font-en);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
body#lv-lo-flow .flow-precheck__aside-title {
  margin-top: 16px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.6;
}
body#lv-lo-flow .flow-precheck__aside-text {
  margin-top: 16px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 14px;
  line-height: 1.85;
}

/* =============================================================================
   10. 中間CTA
   ========================================================================== */
body#lv-lo-flow .flow-mid-cta {
  padding: 0 0 96px;
  background: #fff;
}
body#lv-lo-flow .flow-mid-cta__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(360px, 0.96fr);
  align-items: stretch;
  overflow: hidden;
  border-radius: var(--radius-card);
  background: var(--theme-tint);
  box-shadow: var(--shadow-card);
}
body#lv-lo-flow .flow-mid-cta__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 48px;
}
body#lv-lo-flow .flow-mid-cta__eyebrow {
  color: var(--theme-ink);
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
body#lv-lo-flow .flow-mid-cta__title {
  margin-top: 16px;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.5;
}
body#lv-lo-flow .flow-mid-cta__text {
  margin-top: 16px;
  color: var(--sub);
  font-size: 15px;
  line-height: 1.9;
}
body#lv-lo-flow .flow-mid-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 32px;
}
body#lv-lo-flow .flow-mid-cta__visual {
  position: relative;
  min-height: 480px;
  margin: 0;
  overflow: hidden;
}
body#lv-lo-flow .flow-mid-cta__visual picture,
body#lv-lo-flow .flow-mid-cta__visual img { width: 100%; height: 100%; }
body#lv-lo-flow .flow-mid-cta__visual img { object-fit: cover; }

/* =============================================================================
   11. FAQ（テーマ色マーカー＋軽トランジション）
   ========================================================================== */
body#lv-lo-flow .flow-faq {
  padding: 96px 0;
  background: var(--paper);
}
body#lv-lo-flow .flow-faq__inner {
  display: grid;
  grid-template-columns: minmax(280px, 0.65fr) minmax(0, 1.35fr);
  align-items: start;
  gap: 64px;
}
body#lv-lo-flow .flow-faq__heading {
  position: sticky;
  top: 32px;
}
body#lv-lo-flow .flow-faq__list { display: grid; gap: 12px; }
body#lv-lo-flow .flow-faq__item {
  border: 1px solid var(--line);
  border-radius: var(--radius-card);
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
body#lv-lo-flow .flow-faq__item[open] {
  border-color: rgba(49, 168, 134, 0.4);
  box-shadow: var(--shadow-card);
}
body#lv-lo-flow .flow-faq__question {
  display: grid;
  grid-template-columns: 32px 1fr 24px;
  align-items: center;
  gap: 16px;
  padding: 24px;
  list-style: none;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.7;
}
body#lv-lo-flow .flow-faq__question::-webkit-details-marker { display: none; }
body#lv-lo-flow .flow-faq__mark {
  display: grid;
  width: 32px;
  border-radius: 999px;
  color: #fff;
  background: var(--theme-ink);
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 700;
  aspect-ratio: 1;
  place-items: center;
}
body#lv-lo-flow .flow-faq__mark--answer { color: var(--ink); background: var(--cta); }
body#lv-lo-flow .flow-faq__icon {
  position: relative;
  width: 20px;
  height: 20px;
}
body#lv-lo-flow .flow-faq__icon::before,
body#lv-lo-flow .flow-faq__icon::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 14px;
  height: 2px;
  content: "";
  background: var(--theme-deep);
  transform: translate(-50%, -50%);
  transition: transform 0.2s ease;
}
body#lv-lo-flow .flow-faq__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
body#lv-lo-flow .flow-faq__item[open] .flow-faq__icon::after { transform: translate(-50%, -50%) rotate(0deg); }
body#lv-lo-flow .flow-faq__answer {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 16px;
  padding: 0 24px 24px;
  color: var(--sub);
  font-size: 14px;
  line-height: 1.9;
}
body#lv-lo-flow .flow-faq__answer p { margin: 0; }

/* =============================================================================
   12. 末尾CTA（deep地）
   ========================================================================== */
body#lv-lo-flow .flow-final-cta {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
  color: #fff;
  background: var(--theme-deep);
}
body#lv-lo-flow .flow-final-cta::before,
body#lv-lo-flow .flow-final-cta::after {
  position: absolute;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
  content: "";
  aspect-ratio: 1;
}
body#lv-lo-flow .flow-final-cta::before { top: -210px; left: -140px; width: 430px; }
body#lv-lo-flow .flow-final-cta::after { right: -110px; bottom: -250px; width: 520px; }
body#lv-lo-flow .flow-final-cta__inner {
  position: relative;
  z-index: 1;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
body#lv-lo-flow .flow-final-cta__eyebrow {
  color: #C3E3DA;
  font-family: var(--font-en);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
body#lv-lo-flow .flow-final-cta__title {
  margin-top: 16px;
  font-size: 40px;
  font-weight: 700;
  line-height: 1.4;
  text-wrap: balance;
}
body#lv-lo-flow .flow-final-cta__text {
  max-width: 700px;
  margin: 16px auto 0;
  color: rgba(255, 255, 255, 0.82);
  font-size: 16px;
  line-height: 1.9;
}
body#lv-lo-flow .flow-final-cta__actions {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin-top: 32px;
}
body#lv-lo-flow .flow-final-cta__sub-link {
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 6px;
}
body#lv-lo-flow .flow-final-cta__note {
  margin-top: 16px;
  color: rgba(255, 255, 255, 0.60);
  font-size: 11px;
}

/* =============================================================================
   13. ホバー（マウス環境のみ）
   ========================================================================== */
@media (hover: hover) and (pointer: fine) {
  body#lv-lo-flow .breadcrumb__link:hover { color: var(--theme-ink); }
  body#lv-lo-flow .flow-concerns__card:hover {
    transform: translateY(-4px);
    border-color: rgba(49, 168, 134, 0.4);
    box-shadow: var(--shadow-card);
  }
  body#lv-lo-flow .flow-overview__link:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 255, 255, 0.5);
    background: rgba(255, 255, 255, 0.12);
  }
}

/* =============================================================================
   14. レスポンシブ（§7-2c：〜560 / 561〜900 / 901〜）
   ========================================================================== */
@media (max-width: 900px) {
  body#lv-lo-flow .page-container { width: min(100% - 48px, 760px); }
  body#lv-lo-flow .flow-hero { padding-top: 48px; }
  body#lv-lo-flow .flow-hero__inner,
  body#lv-lo-flow .flow-concerns__inner,
  body#lv-lo-flow .flow-step__inner,
  body#lv-lo-flow .flow-precheck__inner,
  body#lv-lo-flow .flow-mid-cta__inner,
  body#lv-lo-flow .flow-faq__inner {
    grid-template-columns: 1fr;
  }
  body#lv-lo-flow .flow-hero__content { padding-bottom: 0; }
  body#lv-lo-flow .flow-hero__visual { min-height: 440px; }
  body#lv-lo-flow .flow-hero__status { margin-top: 32px; }
  body#lv-lo-flow .flow-hero__status-inner { grid-template-columns: 1fr; }
  body#lv-lo-flow .flow-hero__status-item:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  }
  body#lv-lo-flow .flow-overview__list { grid-template-columns: repeat(2, 1fr); }
  body#lv-lo-flow .flow-step--reverse .flow-step__content,
  body#lv-lo-flow .flow-step--reverse .flow-step__visual,
  body#lv-lo-flow .flow-step--reverse .flow-step__inspection { order: initial; }
  body#lv-lo-flow .flow-precheck__aside { min-height: 340px; }
  body#lv-lo-flow .flow-mid-cta__visual { min-height: 400px; }
  body#lv-lo-flow .flow-faq__heading { position: static; }
}

@media (max-width: 560px) {
  body#lv-lo-flow .page-container { width: calc(100% - 32px); }
  /* セクション上下＝48px（§7-2c モバイル） */
  body#lv-lo-flow .flow-concerns,
  body#lv-lo-flow .flow-overview,
  body#lv-lo-flow .flow-responsibility,
  body#lv-lo-flow .flow-precheck,
  body#lv-lo-flow .flow-faq,
  body#lv-lo-flow .flow-final-cta { padding-top: 48px; padding-bottom: 48px; }
  body#lv-lo-flow .flow-hero { padding-top: 32px; }
  body#lv-lo-flow .flow-hero__title,
  body#lv-lo-flow .flow-final-cta__title { font-size: 31px; }
  body#lv-lo-flow .flow-hero__lead { font-size: 16px; }
  body#lv-lo-flow .flow-hero__actions { flex-direction: column; }
  body#lv-lo-flow .flow-hero__visual { min-height: 300px; }
  body#lv-lo-flow .button { width: 100%; }
  body#lv-lo-flow .flow-hero__status-item { min-height: 72px; padding: 16px 24px; }
  body#lv-lo-flow .flow-concerns__card { grid-template-columns: 40px 1fr; }
  body#lv-lo-flow .flow-overview__list { grid-template-columns: 1fr; margin-top: 32px; }
  body#lv-lo-flow .flow-overview__link { min-height: 88px; }
  body#lv-lo-flow .flow-steps { padding-top: 48px; }
  body#lv-lo-flow .flow-steps__intro { padding-bottom: 32px; }
  body#lv-lo-flow .flow-step,
  body#lv-lo-flow .flow-step:nth-of-type(even) { padding: 48px 0; }
  body#lv-lo-flow .flow-step__inner { gap: 32px; }
  body#lv-lo-flow .flow-step__role,
  body#lv-lo-flow .flow-step__meta { grid-template-columns: 1fr; gap: 8px; }
  body#lv-lo-flow .flow-step__inspection { grid-template-columns: 1fr; padding: 24px; }
  body#lv-lo-flow .flow-step__inspection span { min-height: 64px; }
  body#lv-lo-flow .flow-responsibility__table th,
  body#lv-lo-flow .flow-responsibility__table td { padding: 16px; }
  body#lv-lo-flow .flow-precheck__list { grid-template-columns: 1fr; }
  body#lv-lo-flow .flow-precheck__aside { min-height: 300px; padding: 24px; }
  body#lv-lo-flow .flow-mid-cta { padding-bottom: 48px; }
  body#lv-lo-flow .flow-mid-cta__content { padding: 32px 24px; }
  body#lv-lo-flow .flow-mid-cta__actions { flex-direction: column; }
  body#lv-lo-flow .flow-mid-cta__visual { min-height: 280px; }
  body#lv-lo-flow .flow-faq__question {
    grid-template-columns: 30px 1fr 20px;
    gap: 12px;
    padding: 20px 16px;
    font-size: 14px;
  }
  body#lv-lo-flow .flow-faq__answer { grid-template-columns: 30px 1fr; gap: 12px; padding: 0 16px 20px; }
  body#lv-lo-flow .flow-faq__mark { width: 30px; }
}

/* =============================================================================
   14b. フッター（共有クラス .footer/.footer__* — page06.css等の全ページ共通定義を
        本ページ専用CSSにも複製。page-lv-lo-flow.css が style.css を置き換えるため、
        style.css内にのみ存在するフッターCSSがロードされなくなる問題への対処）
   ========================================================================== */
body#lv-lo-flow .footer {
  color: #000;
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}
body#lv-lo-flow .footer__inner {
  box-sizing: border-box;
  margin: 100px 0;
  padding: 0 50px;
}
body#lv-lo-flow .footer__top {
  display: flex;
}
body#lv-lo-flow .footer__intro {
  display: flex;
  flex: 0 0 400px;
  flex-direction: column;
}
body#lv-lo-flow .footer__copy {
  display: block;
  width: 355px;
  margin: 0;
}
body#lv-lo-flow .footer__copy img {
  display: block;
  width: 100%;
  height: auto;
}
body#lv-lo-flow .footer__description {
  display: block;
  margin: 30px 0 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.9;
}
body#lv-lo-flow .footer__nav {
  width: calc(100% - 400px);
}
body#lv-lo-flow .footer__columns {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin: 0;
  padding: 24px 0 28px;
  list-style: none;
}
body#lv-lo-flow .footer__column {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 33.3333333333%;
  padding: 0 35px;
  gap: 10px;
}
body#lv-lo-flow .footer__column--center {
  border-left: 1px dotted #f4f6f8;
}
body#lv-lo-flow .footer__heading {
  display: flex;
  align-items: center;
  color: #000;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.6;
  text-decoration: none;
}
body#lv-lo-flow .footer__heading--spaced {
  margin-top: 15px;
}
body#lv-lo-flow .footer__heading span {
  position: relative;
  bottom: -1px;
  display: block;
  width: 17px;
  margin-left: 5px;
  border-radius: 50%;
  aspect-ratio: 1;
  background: linear-gradient(135deg, #22745D 0%, #155442 100%);
}
body#lv-lo-flow .footer__heading span::before {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  display: block;
  width: 7px;
  content: "";
  transform: translate(-25%, -50%);
  clip-path: polygon(0 15%, 15% 0, 65% 50%, 15% 100%, 0 85%, 35% 50%, 0 15%);
  aspect-ratio: 1;
  background-color: #fff;
}
body#lv-lo-flow .footer__group {
  margin: 0;
}
body#lv-lo-flow .footer__summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #000;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  cursor: pointer;
  transition: color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease;
}
body#lv-lo-flow .footer__summary::-webkit-details-marker {
  display: none;
}
body#lv-lo-flow .footer__summary::after {
  display: block;
  width: 13px;
  content: "";
  transition: color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease;
  clip-path: polygon(0 45%, 45% 45%, 45% 0, 55% 0, 55% 45%, 100% 45%, 100% 55%, 55% 55%, 55% 100%, 45% 100%, 45% 55%, 0 55%);
  aspect-ratio: 1;
  background-color: #000;
}
body#lv-lo-flow .footer__group[open] .footer__summary::after {
  clip-path: polygon(0 45%, 100% 45%, 100% 55%, 0 55%);
}
body#lv-lo-flow .footer__links {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  margin: 5px 0;
  padding: 15px;
  border-radius: 5px;
  background-color: #f4f6f8;
}
body#lv-lo-flow .footer__nav-link {
  display: block;
  color: #000;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.65;
  text-decoration: none;
  transition: color 0.3s ease, background-color 0.3s ease, opacity 0.3s ease;
}
body#lv-lo-flow .footer__bottom {
  display: flex;
  align-items: flex-start;
  margin-top: 50px;
}
body#lv-lo-flow .footer__company {
  display: flex;
  flex-direction: column;
  gap: 20px 0;
}
body#lv-lo-flow .footer__brand-row {
  display: flex;
  align-items: center;
  gap: 0 30px;
}
body#lv-lo-flow .footer__logo {
  display: block;
  width: 200px;
}
body#lv-lo-flow .footer__bess {
  display: block;
  width: 170px;
}
body#lv-lo-flow .footer__logo img, body#lv-lo-flow .footer__bess img {
  display: block;
  width: 100%;
  height: auto;
}
body#lv-lo-flow .footer__link {
  display: flex;
  align-items: center;
  gap: 0 5px;
  color: #000;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.4;
  text-decoration: none;
}
body#lv-lo-flow .footer__link span {
  display: block;
  width: 15px;
  line-height: 1;
}
body#lv-lo-flow .footer__link img {
  display: block;
  width: 100%;
  height: auto;
}
body#lv-lo-flow .footer__copyright {
  margin: 0;
  color: #000;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
}
body#lv-lo-flow .footer__copyright--mobile {
  display: none;
}
@media (hover: hover) and (pointer: fine) {
  body#lv-lo-flow .footer__heading:hover, body#lv-lo-flow .footer__summary:hover, body#lv-lo-flow .footer__nav-link:hover, body#lv-lo-flow .footer__link:hover {
    color: #22745D;
  }
  body#lv-lo-flow .footer__summary:hover::after {
    background-color: #22745D;
  }
}
@media (max-width: 1350px) {
  body#lv-lo-flow .footer__top {
    flex-direction: column;
  }
  body#lv-lo-flow .footer__intro {
    flex-basis: auto;
    width: 100%;
  }
  body#lv-lo-flow .footer__description br {
    display: none;
  }
  body#lv-lo-flow .footer__nav {
    width: 100%;
    margin-top: 50px;
  }
  body#lv-lo-flow .footer__column {
    width: 31.6666666667%;
    padding: 0;
  }
}
@media (max-width: 1024px) {
  body#lv-lo-flow .footer__nav {
    margin-top: 20px;
  }
  body#lv-lo-flow .footer__links {
    font-size: 14px;
  }
}
@media (max-width: 850px) {
  body#lv-lo-flow .footer__inner {
    margin: 50px 0;
    padding: 0 30px;
  }
  body#lv-lo-flow .footer__intro {
    align-items: center;
  }
  body#lv-lo-flow .footer__copy {
    width: 300px;
  }
  body#lv-lo-flow .footer__description {
    max-width: 500px;
    margin: 10px auto 0;
    text-align: center;
  }
  body#lv-lo-flow .footer__nav {
    display: none;
  }
  body#lv-lo-flow .footer__bottom {
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
  }
  body#lv-lo-flow .footer__brand-row {
    flex-direction: column;
    align-items: center;
    gap: 20px 0;
  }
  body#lv-lo-flow .footer__copyright--desktop {
    display: none;
  }
  body#lv-lo-flow .footer__company {
    align-items: center;
    width: 100%;
    gap: 24px 0;
  }
  body#lv-lo-flow .footer__brand-row {
    width: 100%;
  }
  body#lv-lo-flow .footer__logo {
    width: 180px;
  }
  body#lv-lo-flow .footer__bess {
    width: 150px;
  }
  body#lv-lo-flow .footer__link {
    justify-content: center;
    font-size: 13px;
  }
  body#lv-lo-flow .footer__copyright--mobile {
    display: block;
    margin-top: 30px;
    text-align: center;
  }
}
@media (max-width: 568px) {
  body#lv-lo-flow .footer__inner {
    padding: 0 20px;
  }
  body#lv-lo-flow .footer__copy {
    width: min(100%, 300px);
  }
}

/* =============================================================================
   15. アニメ抑制（§7-2f・必須）
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  body#lv-lo-flow *,
  body#lv-lo-flow *::before,
  body#lv-lo-flow *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ===== headerfix2_20260704 ===== */

/* ===== HEADER/SP-MENU PORT from page03.css (headerfix_20260704+headercolor_20260704) 共通ヘッダー整合・緑固定 ===== */
.header{position: relative; z-index: 100; width: 100%; color: #000; background: #fff;}
.header *, .header *::before, .header *::after{box-sizing: border-box;}
.header__inner{width: 100%; padding: 0 50px;}
.header__top{display: flex; align-items: center; justify-content: space-between;}
.header__brand{padding-top: 0;}
.header__logo{display: block; width: 200px; line-height: 0;}
.header__logo img{display: block; width: 100%; height: auto;}
.header__tagline{margin: 10px 0 0; color: #000; font-size: 14px; font-weight: 500; line-height: 1.6;}
.header__utility{display: flex; align-items: center; gap: 30px;}
.header__lang{position: relative; flex: 0 0 auto;}
.header__lang-button{display: inline-flex; align-items: center; justify-content: center;
  width: 112px; height: 44px; padding: 0 14px;
  border: 1px solid #d9d9d9; border-radius: 6px;
  color: #000; background: #fff; font: inherit; font-size: 14px; font-weight: 500; line-height: 1; cursor: pointer;}
.header__lang-arrow{width: 7px; height: 7px; margin-left: 10px;
  border-right: 1px solid currentColor; border-bottom: 1px solid currentColor;
  transform: translateY(-2px) rotate(45deg); transition: transform 0.2s ease;}
.header__lang.is-open .header__lang-arrow{transform: translateY(2px) rotate(225deg);}
.header__lang-menu{position: absolute; top: calc(100% + 8px); right: 0; z-index: 10;
  display: grid; width: 150px; padding: 8px;
  border: 1px solid #d9d9d9; border-radius: 6px; visibility: hidden; background: #fff;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.1); opacity: 0; transform: translateY(-6px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;}
.header__lang.is-open .header__lang-menu{visibility: visible; opacity: 1; transform: translateY(0);}
.header__lang-link{display: block; padding: 10px 12px; border-radius: 4px; color: #000; font-size: 14px; font-weight: 400; line-height: 1.4; text-decoration: none;}
.header__lang-link.is-current{background: #EDF6F1; font-weight: 600;}
.header__actions{position: relative; top: -45px;
  display: flex; align-items: center; justify-content: center; gap: 20px;
  width: auto; padding: 100px 20px 20px;
  border-radius: 0 0 10px 10px; background: #1E8A58;}
.header__action-link{display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  min-height: 32px; padding: 0 10px;
  color: #fff; font-size: 16px; font-weight: 500; line-height: 1; white-space: nowrap; text-decoration: none;}
.header__action-link img{display: block; flex: 0 0 auto; width: auto; max-height: 18px;}
.header__nav{display: flex; align-items: center; justify-content: flex-end; gap: 30px; margin-top: 10px;}
.header__nav-link{color: #000; font-size: 17px; font-weight: 500; line-height: 1.4; text-decoration: none;}
.header__lang-button:focus-visible, .header__lang-link:focus-visible, .header__action-link:focus-visible, .header__nav-link:focus-visible, .header__logo:focus-visible{outline: 2px solid #1E8A58; outline-offset: 3px;}
.sp-menu{display: none;}
.sp-menu__button{position: fixed; top: 18px; right: 18px; z-index: 1002;
  display: none; width: 46px; height: 46px; padding: 12px 10px;
  border-radius: 50%; background: #0F4C30;
  box-shadow: 0 10px 28px rgba(15, 76, 48, 0.28);}
.sp-menu__line{display: block; width: 22px; height: 2px; margin: 4px auto; background: #fff; transition: transform 0.3s ease, opacity 0.3s ease;}
.sp-menu__panel{position: fixed; inset: 0; z-index: 1001;
  display: flex; visibility: hidden; flex-direction: column; justify-content: center;
  padding: 100px 30px 40px; color: #fff; background: rgba(15, 76, 48, 0.98);
  opacity: 0; transition: visibility 0.3s ease, opacity 0.3s ease;}
.sp-menu__nav{display: grid; gap: 4px;}
.sp-menu__link{padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.16); font-size: 18px; font-weight: 700; text-decoration: none;}
.sp-menu.is-open .sp-menu__panel{visibility: visible; opacity: 1;}
.sp-menu.is-open .sp-menu__line:nth-child(1){transform: translateY(6px) rotate(45deg);}
.sp-menu.is-open .sp-menu__line:nth-child(2){opacity: 0;}
.sp-menu.is-open .sp-menu__line:nth-child(3){transform: translateY(-6px) rotate(-45deg);}
@media (hover: hover) and (pointer: fine){
.header__lang-button:hover{border-color: #1E8A58;}
.header__lang-link:hover{background: #EDF6F1;}
.header__action-link:hover{opacity: 0.82;}
.header__nav-link:hover{color: #1E8A58;}
}
@media (max-width: 1250px){
.header__utility{gap: 20px;}
.header__nav{gap: 22px;}
}
@media (max-width: 1024px){
.header__inner{padding: 0 35px;}
.header__tagline{display: none;}
}
@media (max-width: 850px){
.header__inner{padding: 14px 30px;}
.header__top{align-items: center; gap: 16px;}
.header__logo{width: 160px;}
.header__utility{margin-left: auto;}
.header__lang-button{width: 98px; height: 40px; padding: 0 12px; font-size: 13px;}
.header__lang-menu{width: 140px;}
.header__actions, .header__nav{display: none;}
.sp-menu, .sp-menu__button{display: block;}
}
@media (max-width: 568px){
.header__inner{padding-right: 20px; padding-left: 20px;}
.header__logo{width: 145px;}
}
/* recolor_emerald_20260709 */
