/* ============================================================
   Company（会社のページ）。About・Team をまとめた 2026-10。washi.css の上に重ねる
   Mission → Vision → Values → 社名に込めた想い（原子・原始）→ FDE の進め方 → 経営陣 → 会社概要 → 提携 → 採用とお問い合わせ
   ============================================================ */
.co-sec { position: relative; padding: 120px 0; }
.co-fde, .wz main > .info-section, .co-next { background: var(--washi); }
.wz main > .co-team, .wz main > .partners-section { background: var(--washi-2); }

/* 社名の由来：原子と原始を、版画つきの2枚で */
.co-meanings { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 56px; }
.co-meaning { background: var(--paper); border: 1px solid var(--line); border-radius: 20px; overflow: hidden; transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.co-meaning:hover { transform: translateY(-4px); box-shadow: 0 30px 60px -36px rgba(70, 30, 0, .5); }
.co-meaning figure { margin: 0; aspect-ratio: 3 / 2; overflow: hidden; border-bottom: 1px solid var(--line); }
.co-meaning figure img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.4s var(--ease); }
.co-meaning:hover figure img { transform: scale(1.05); }
.co-meaning-body { padding: 28px 32px 34px; }
.co-meaning-title { display: flex; align-items: baseline; gap: 16px; margin: 0; }
.co-meaning-title b { font-family: var(--mincho); font-size: 3rem; font-weight: 700; line-height: 1; color: var(--orange); letter-spacing: .04em; }
.co-meaning-title span { font-size: .78rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--teal-deep); }
.co-meaning-body p { margin-top: 16px; color: var(--body); line-height: 2; font-size: .98rem; }

/* FDE：左に版画、右に3つの手順 */
.co-fde .section-lead { max-width: 780px; }
.co-fde-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; margin-top: 52px; }
.co-fde-art { margin: 0; max-width: 520px; width: 100%; }
.co-fde-art img { width: 100%; height: auto; display: block; border-radius: 6px; box-shadow: 0 40px 80px -50px rgba(70, 30, 0, .6); }
.co-fde-steps { list-style: none; display: grid; border-top: 1px solid var(--line-strong); }
.co-fde-steps li { display: grid; grid-template-columns: 58px 1fr; gap: 14px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.co-fde-steps em { font-family: var(--mincho); font-style: normal; font-weight: 700; font-size: 2.5rem; line-height: 1; color: var(--orange); -webkit-text-stroke: .055em currentColor; } /* 明朝の横画は細いので、トップの「つくり方」と同じく太らせる */
.co-fde-steps b { display: block; font-size: 1.18rem; margin-bottom: .35rem; }
.co-fde-steps p { color: var(--body); line-height: 1.9; font-size: .95rem; }

/* 採用とお問い合わせ */
.co-cta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.co-cta { position: relative; display: block; overflow: hidden; border-radius: 22px; padding: 44px 44px 46px; background: var(--ai); color: #f4efe6; transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
.co-cta::before { content: ''; position: absolute; right: -18%; top: -30%; width: 70%; height: 150%; background: url("../img/washi/clouds.webp") no-repeat right center / contain; opacity: .14; pointer-events: none; }
.co-cta:hover { transform: translateY(-4px); box-shadow: 0 34px 60px -36px rgba(20, 30, 40, .7); }
.co-cta h2 { position: relative; font-size: clamp(1.6rem, 2.6vw, 2.2rem); font-weight: 800; margin: .2rem 0 .8rem; color: #fff; }
.co-cta p { position: relative; line-height: 1.95; color: rgba(244, 239, 230, .78); max-width: 440px; }
.co-cta .section-subtitle { color: var(--orange-2); }
.co-cta--light { background: var(--paper); color: var(--ink); border: 1px solid var(--line); }
.co-cta--light h2 { color: var(--ink); }
.co-cta--light p { color: var(--body); }
.co-cta--light .section-subtitle { color: var(--orange); }
.co-cta--light::before { opacity: .2; }
.co-link { position: relative; display: inline-flex; align-items: center; gap: .45em; margin-top: 1.6rem; font-weight: 800; color: var(--orange-2); }
.co-cta--light .co-link { color: var(--orange); }
.co-link i { font-style: normal; transition: transform .3s var(--ease); }
.co-cta:hover .co-link i { transform: translateX(4px); }

/* 提携・採択：ニュースで公開済みのものだけを、告知画像つきで。所属（東大病院）は下に1行で */
.co-partner-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 48px; }
.co-partner { display: flex; flex-direction: column; background: var(--paper); border: 1px solid var(--line); border-radius: 18px; overflow: hidden; color: inherit; transition: transform .45s var(--ease), box-shadow .45s var(--ease), border-color .3s; }
.co-partner:hover { transform: translateY(-4px); box-shadow: 0 26px 50px -32px rgba(70, 30, 0, .45); border-color: var(--line-strong); }
.co-partner figure { margin: 0; aspect-ratio: 1200 / 630; border-bottom: 1px solid var(--line); background: #fff; overflow: hidden; }
.co-partner figure img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 1.2s var(--ease); }
.co-partner:hover figure img { transform: scale(1.04); }
.co-partner-body { padding: 18px 20px 22px; }
.co-partner-tag { display: inline-flex; align-items: center; gap: .7em; font-size: .72rem; font-weight: 800; letter-spacing: .12em; color: var(--orange); }
.co-partner-tag time { font-family: var(--mincho); font-weight: 700; letter-spacing: .04em; color: var(--muted, #8a8378); }
.co-partner h3 { margin: .5rem 0 .55rem; font-size: 1.12rem; font-weight: 800; line-height: 1.45; color: var(--ink); }
.co-partner p { font-size: .9rem; line-height: 1.85; color: var(--body); }
.co-affil { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.2rem; margin-top: 24px; padding: 20px 24px; border: 1px solid var(--line); border-radius: 14px; background: rgba(251, 246, 236, .6); color: inherit; transition: border-color .3s; }
.co-affil:hover { border-color: var(--line-strong); }
.co-affil b { font-size: 1.02rem; font-weight: 800; color: var(--ink); }
.co-affil span:last-child { font-size: .92rem; color: var(--body); }
@media (max-width: 1100px) { .co-partner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

@media (max-width: 900px) {
    .co-sec { padding: 88px 0; }
    .co-fde-grid, .co-meanings, .co-cta-grid { grid-template-columns: 1fr; gap: 32px; }
    .co-fde-art { justify-self: stretch; max-width: 460px; }
    .co-cta { padding: 34px 28px 36px; }
}
@media (max-width: 600px) {
    .co-partner-grid { grid-template-columns: 1fr; }
    .co-meaning-body { padding: 22px 22px 26px; }
    .co-meaning-title b { font-size: 2.4rem; }
    .co-fde-steps li { grid-template-columns: 44px 1fr; }
    .co-fde-steps em { font-size: 2rem; }
}

/* ============================================================
   MVV（2026-10-16 制定）：Mission → Vision → Values → 社名に込めた想い
   Mission と Vision は節を留めてスクロールで見せる（js/company.js）
   ============================================================ */
/* 社名の由来：ファインマンの話 → 原子・原始の2枚 */
.mv-feynman { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 48px; align-items: center; margin-top: 44px; padding: 40px 44px; background: var(--paper); border: 1px solid var(--line); border-radius: 22px; }
.mv-feynman-photo { margin: 0; }
.mv-feynman-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 6px; padding: 8px; background: #fffaf1; border: 1px solid var(--line); filter: sepia(.25) contrast(1.02); }
.mv-feynman-photo figcaption { margin-top: 12px; font-weight: 800; font-size: .95rem; }
.mv-feynman-photo figcaption span { display: block; font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--teal-deep); margin-top: 2px; }
.mv-feynman-quote { font-family: var(--mincho); font-weight: 700; font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.45; color: var(--orange); margin-bottom: 1.2rem; font-feature-settings: 'palt'; }
.mv-feynman-text p:not(.mv-feynman-quote) { color: var(--body); line-height: 2.05; font-size: 1rem; }
.mv-feynman-text .mv-feynman-ours { margin-top: 1rem; color: var(--ink); font-weight: 800; }
.mv-name-lead { margin-top: 64px; font-size: 1.15rem; font-weight: 800; }
.mv-meanings { margin-top: 24px; }

/* 明朝の漢数字（細いと読めないので太らせる） */
.mv-num { font-family: var(--mincho); font-style: normal; font-weight: 700; color: var(--orange); line-height: 1; -webkit-text-stroke: .055em currentColor; }

/* 共通の見出しまわり */
.mv-kicker { display: inline-flex; align-items: center; gap: .6em; font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--orange); }
.mv-kicker::before { content: ''; width: 18px; height: 2px; background: currentColor; border-radius: 2px; }
.mv-note { color: var(--body); line-height: 2; }
.mv-en { font-family: 'Inter', var(--jp); font-weight: 800; letter-spacing: -.02em; }

@media (max-width: 900px) {
    .mv-feynman { grid-template-columns: 1fr; gap: 24px; padding: 28px 24px; }
    .mv-feynman-photo { display: grid; grid-template-columns: 96px 1fr; gap: 16px; align-items: center; }
    .mv-feynman-photo figcaption { margin: 0; }
    .mv-name-lead { margin-top: 44px; }
}

/* flex の中の .container が縮んで真ん中に寄るのを防ぐ */
.mv-stage > .container { width: 100%; }
/* 長い一文は文節で折り返し、行末に1〜2字だけ残さない */
.mv-feynman-text p, .mv-item p { word-break: auto-phrase; text-wrap: pretty; }

.mv-pin { position: relative; background: var(--washi); }
.mv-mission { height: 220vh; }
.mv-vision { height: 300vh; }
.mv-stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: flex; align-items: center; } /* svh：スマホのアドレスバーの分で下が切れないように */

/* Mission */
.mv-mission-art { position: absolute; inset: 0; }
.mv-mission-art img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; transform: scale(calc(1.35 - var(--p, 0) * .35)); transform-origin: 72% 60%; will-change: transform; }
.mv-mission-copy { position: relative; z-index: 1; }
.mv-statement { font-size: clamp(3rem, 7vw, 6.6rem); font-weight: 800; line-height: 1.12; letter-spacing: -.02em; font-feature-settings: 'palt'; margin: .25em 0 .35em; }
.mv-statement .ch { display: inline-block; opacity: calc(var(--o, 0)); transform: translateY(calc((1 - var(--o, 0)) * .35em)); filter: blur(calc((1 - var(--o, 0)) * 6px)); }
.mv-after { opacity: var(--a, 0); transform: translateY(calc((1 - var(--a, 0)) * 16px)); font-size: 1.1rem; }

/* Vision：丸窓が開く */
.mv-window { position: absolute; inset: 0; clip-path: circle(var(--r, 13%) at 50% 62%); will-change: clip-path; }
/* 文の後ろに霞（横の帯）を引いて読ませる。帯の中心は文と同じ、ヘッダーの下の残りの真ん中 */
.mv-window::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(247, 239, 227, 0) calc(var(--mid) - 24%), rgba(247, 239, 227, .8) calc(var(--mid) - 13%), rgba(247, 239, 227, .84) calc(var(--mid) + 13%), rgba(247, 239, 227, 0) calc(var(--mid) + 24%)); opacity: var(--q, 0); }
.mv-window img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 100%; transform: scale(calc(1.25 - var(--p, 0) * .25)); }
.mv-year { position: absolute; z-index: 1; left: 50%; top: 14%; transform: translateX(-50%); text-align: center; opacity: calc(1 - var(--q, 0)); }
.mv-year .mv-kicker { justify-content: center; }
.mv-year b { display: block; font-size: clamp(4rem, 10vw, 8.5rem); letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.mv-vision { --mid: calc(50% + 35px); }
.mv-vision-copy { position: absolute; z-index: 2; left: 50%; top: var(--mid); width: min(100%, 1000px); transform: translate(-50%, calc(-50% + (1 - var(--q, 0)) * 24px)); text-align: center; opacity: var(--q, 0); }
.mv-vision-copy .mv-kicker { justify-content: center; }
.mv-vision-copy .mv-kicker i { font-size: 1.5rem; margin-left: .3em; letter-spacing: 0; }
.mv-vision-copy h2 { font-size: clamp(1.3rem, 2.4vw, 2.15rem); font-weight: 800; line-height: 1.6; margin: .5em 0 .4em; font-feature-settings: 'palt'; text-shadow: 0 0 18px rgba(247, 239, 227, .9), 0 0 4px rgba(247, 239, 227, .9); }
.mv-vision-copy .mv-note { text-shadow: 0 0 12px rgba(247, 239, 227, .9); }
.mv-vision-copy h2, .mv-vision-copy .mv-note { word-break: auto-phrase; text-wrap: balance; }

/* 節の地色：Mission・Vision・Values は和紙、社名は一段濃く（次の FDE が和紙なので） */
.wz main > .mv-pin, .wz main > .mv-values { background: var(--washi); }
.wz main > .mv-name { background: var(--washi-2); }
.mv-values .section-lead { max-width: 720px; }
.mv-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 72px; margin-top: 40px; }
.mv-list { list-style: none; }
.mv-item { min-height: 72vh; display: flex; flex-direction: column; justify-content: center; padding: 40px 0; opacity: .28; transition: opacity .6s var(--ease); }
.mv-item.is-on { opacity: 1; }
.mv-item-art { display: none; }
.mv-item small { font-size: .74rem; font-weight: 800; letter-spacing: .12em; color: var(--orange); }
.mv-item em { font-size: 4.2rem; margin: 18px 0 10px; }
.mv-item h3 { display: grid; gap: 6px; margin-bottom: 1rem; }
.mv-item h3 .mv-en { font-size: clamp(2.2rem, 4vw, 3.6rem); line-height: 1.05; }
.mv-item h3 b { font-size: 1.25rem; color: var(--orange); }
.mv-item p { color: var(--body); line-height: 2.05; font-size: 1.02rem; max-width: 30em; }
.mv-item--b small, .mv-item--b em, .mv-item--b h3 b { color: var(--teal-deep); }
.mv-frame { position: sticky; top: 14vh; height: 72vh; align-self: start; }
.mv-frame-in { position: relative; height: 100%; aspect-ratio: 4 / 5; max-width: 100%; margin-left: auto; border-radius: 50% 50% 18px 18px / 40% 40% 18px 18px; overflow: hidden; border: 1px solid var(--line-strong); box-shadow: 0 50px 90px -50px rgba(70, 30, 0, .6); background: var(--paper); }
@property --ink2 { syntax: '<percentage>'; inherits: false; initial-value: 0%; }
.mv-frame-in img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; --ink2: 0%;
    -webkit-mask-image: radial-gradient(circle at 50% 60%, #000 calc(var(--ink2) - 12%), transparent var(--ink2)); mask-image: radial-gradient(circle at 50% 60%, #000 calc(var(--ink2) - 12%), transparent var(--ink2));
    transform: scale(1.06); transition: --ink2 1.2s cubic-bezier(.35, .1, .2, 1), transform 1.6s var(--ease); }
.mv-frame-in img.is-on { --ink2: 160%; transform: none; z-index: 1; }
.mv-frame-in img.was-on { --ink2: 160%; transform: none; }
.mv-dots { position: absolute; right: -48px; top: 50%; transform: translateY(-50%); list-style: none; display: grid; gap: 14px; }
.mv-dots li { font-family: var(--mincho); font-weight: 700; font-size: 1.1rem; color: var(--line-strong); -webkit-text-stroke: .06em currentColor; transition: color .4s, transform .4s var(--ease); }
.mv-dots li.is-on { color: var(--orange); transform: scale(1.35); }

@media (max-width: 900px) {
    .mv-mission { height: 170vh; }
    .mv-mission-art img { object-position: 80% 50%; }
    .mv-mission-copy { align-self: flex-end; padding-bottom: 12vh; }
    .mv-mission-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(247, 239, 227, .95) 0%, rgba(247, 239, 227, .7) 35%, transparent 60%); }
    .mv-vision { height: 240vh; }
    .mv-window { clip-path: circle(var(--r, 30%) at 50% 62%); }
    .mv-window img { object-position: 30% 50%; }
    .mv-vision-copy { width: 100%; padding: 0 24px; }
    .mv-window::after { background: linear-gradient(180deg, rgba(247, 239, 227, 0) calc(var(--mid) - 30%), rgba(247, 239, 227, .82) calc(var(--mid) - 19%), rgba(247, 239, 227, .86) calc(var(--mid) + 19%), rgba(247, 239, 227, 0) calc(var(--mid) + 30%)); }
    .mv-vision-copy h2 br { display: none; }
    .mv-split { grid-template-columns: 1fr; gap: 0; }
    .mv-frame { display: none; }
    .mv-item { min-height: 0; opacity: 1; padding: 28px 0 36px; border-top: 1px solid var(--line); }
    .mv-item-art { display: block; margin: 0 0 18px; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 16px; border: 1px solid var(--line); }
    .mv-item-art img { width: 100%; height: 100%; object-fit: cover; }
    .mv-item em { font-size: 2.8rem; margin: 12px 0 6px; }
}
@media (prefers-reduced-motion: reduce) {
    .mv-mission, .mv-vision { height: auto; }
    .mv-stage { position: relative; height: 100vh; height: 100svh; }
}