/* ==========================================================
   会社概要：山をめぐる旅
   夜明けの山並み → 頂（星空） → 嶺（雪） → 森（登山道） → 麓（花畑）
   ========================================================== */

/* ---------- 夜明けの山並み（キービジュアル） ---------- */
/* 夕焼けの空。スクロールすると夜空に変わり、星が出てくる */
.mt-kv { background: linear-gradient(180deg, #6c5b9e 0%, #d9789a 30%, #f59e7a 55%, #ffc98f 80%, #ffdcaa 100%); }
.mt-kv .uv-kv__stage::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, #0f1733 0%, #1b2849 45%, #24345c 100%);
  opacity: clamp(0, calc(var(--kv) * 1.6), 1);
}
.mt-kv .uv-kv__stage::after {
  content: ""; position: absolute; inset: 0 0 35% 0; z-index: 0; pointer-events: none;
  background-image:
    radial-gradient(1.6px 1.6px at 12% 18%, #fff, transparent), radial-gradient(1.2px 1.2px at 27% 8%, #fff, transparent),
    radial-gradient(1.8px 1.8px at 41% 26%, #fff8d8, transparent), radial-gradient(1.2px 1.2px at 55% 12%, #fff, transparent),
    radial-gradient(1.5px 1.5px at 68% 22%, #fff, transparent), radial-gradient(1.2px 1.2px at 83% 9%, #fff8d8, transparent),
    radial-gradient(1.6px 1.6px at 92% 30%, #fff, transparent), radial-gradient(1.1px 1.1px at 6% 36%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 34% 40%, #fff, transparent), radial-gradient(1.1px 1.1px at 76% 38%, #fff, transparent);
  opacity: clamp(0, calc((var(--kv) - .25) * 2.5), 1);
}
.mt-kv .uv-kv__bg { inset: 0; z-index: 1; }
/* 山並みも夜の色に沈んでいく */
.mt-kv .uv-kv__bg::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: rgb(14 22 50 / calc(var(--kv) * .62));
}
.mt-svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.mt-l { translate: 0 80px; opacity: 0; transition: translate 1.5s cubic-bezier(.2, 1.15, .35, 1), opacity 1.1s var(--ease); }
.is-loaded .mt-l { translate: 0 0; opacity: 1; }
.mt-sun { transition-delay: 0s; transform: translateY(calc(var(--kv) * 440px)); } /* 夜になる頃には山の向こうへ沈みきる */
.mt-far { transition-delay: .15s; transform: translateY(calc(var(--kv) * 200px)); }
.mt-mid { transition-delay: .3s; transform: translateY(calc(var(--kv) * 130px)); }
.mt-near { transition-delay: .45s; transform: translateY(calc(var(--kv) * 60px)); }
.mt-front { transition-delay: .6s; }
.mt-cloud-b { transition-delay: .2s; transform: translateX(calc(var(--kv) * -160px)); }
.mt-cloud-f { transition-delay: .7s; transform: translateX(calc(var(--kv) * 220px)) translateY(calc(var(--kv) * -40px)); }
.mt-kv h1 { letter-spacing: .3em; padding-left: .3em; }

/* ---------- 各ゾーンの色 ---------- */
.mt-summit { background: #24345c; padding-top: 60px; }
.mt-ridge { background: #2f4d66; padding: 40px 0 80px; }
.mt-forest { background: #1d4630; padding: 60px 0 140px; }
.mt-foot { background: #eef5e6; color: var(--ink); padding-top: 60px; }
.mt-foot .uv-eyebrow { color: #d8902a; }
.mt-foot .uv-eyebrow small, .mt-foot .uv-text { color: var(--ink-soft); }
.mt-foot .uv-pill { background: var(--forest); color: #fff; }
.mt-foot .uv-pill .ico { background: #fff; color: var(--forest); }
.mt-block { padding: clamp(60px, 9vw, 110px) 0; }
.mt-block .uv-title { margin-bottom: 0; }

/* ---------- 頂：ごあいさつ ---------- */
.mt-moon { position: absolute; top: 6%; right: 9%; width: clamp(56px, 7vw, 100px); }
.mt-greeting { display: grid; grid-template-columns: minmax(260px, 380px) 1fr; gap: clamp(32px, 6vw, 90px); align-items: start; padding: clamp(60px, 9vw, 110px) 0 20px; }
.mt-portrait { position: sticky; top: calc(var(--header-h) + 40px); margin: 0; text-align: center; }
.mt-portrait img { position: relative; z-index: 1; width: 82%; aspect-ratio: 1; object-fit: cover; object-position: 50% 18%; border-radius: 50%; margin: 9% auto 0; border: 6px solid #fff4c9; box-shadow: 0 0 0 10px rgba(255, 244, 201, .12), 0 0 60px rgba(255, 244, 201, .25); }
.mt-portrait__ring { position: absolute; left: 0; right: 0; top: 0; aspect-ratio: 1; border-radius: 50%; border: 2px dashed rgba(255, 255, 255, .3); animation: spin 50s linear infinite; }
.mt-portrait figcaption { margin-top: 22px; font-size: 13px; color: rgba(255, 255, 255, .75); }
.mt-portrait figcaption strong { display: block; font-family: var(--font-serif); font-size: 26px; letter-spacing: .2em; color: #fff; margin-top: 4px; }
.mt-sign { text-align: right; font-family: var(--font-serif); font-size: 18px; margin-top: 28px; }
.mt-summit .exec .role { color: rgba(255, 255, 255, .7); }
.mt-summit .exec .name { color: #fff; }
.mt-summit .exec img { background: #fff4c9; }
.mt-peak { display: block; width: 100%; height: clamp(90px, 14vw, 200px); margin-top: 20px; }
@media (max-width: 760px) {
  .mt-greeting { grid-template-columns: 1fr; }
  .mt-portrait { position: relative; top: 0; max-width: 300px; margin-inline: auto; }
}

/* ---------- 嶺：会社概要・事業内容 ---------- */
.mt-outline { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(32px, 6vw, 90px); align-items: center; padding: clamp(40px, 7vw, 90px) 0; }
.mt-outline .data-table th { color: rgba(255, 255, 255, .65); border-color: rgba(255, 255, 255, .18); }
.mt-outline .data-table td { color: #fff; border-color: rgba(255, 255, 255, .18); }
.mt-outline__art svg { width: 100%; height: auto; display: block; }
.mt-ridge .biz-item { color: var(--ink); }
@media (max-width: 760px) { .mt-outline { grid-template-columns: 1fr; } .mt-outline__art { max-width: 320px; margin-inline: auto; } }

/* 沿革の横スクロールの仕組みは journey.css（.htl）にあります */

/* ---------- 麓：表彰・資格 ---------- */
.mt-foot .award-group h3 { color: var(--ink); }
.mt-village { margin-top: 20px; }

@media (prefers-reduced-motion: reduce) {
  .mt-l { translate: none; opacity: 1; transform: none !important; }
  .mt-portrait__ring, .htl-hiker svg, .htl-hiker .mt-legs rect { animation: none !important; }
}

/* 事業内容はリンクカードにして、事業内容ページへ案内する */
.biz-item--link { transition: transform .4s var(--ease); }
.biz-item--link:hover { transform: translateY(-4px); }
.biz-item--link .biz-go { display: inline-block; margin-top: 8px; font-weight: 700; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; }