/* COACHING ページ（2026-09-29）。色・文字・余白は original-site.css の流儀に合わせる */
.co-lead{background:var(--paper);text-align:center;padding-top:150px;padding-bottom:110px}
.co-lead>small,.co-how>small,.co-cta small{letter-spacing:.22em;color:var(--red);font:600 12px Barlow Condensed}
.co-lead h2{letter-spacing:-.04em;margin:30px 0 40px;font:600 clamp(32px,4.4vw,64px)/1.5 Noto Serif JP}
.co-lead p{color:#43505b;max-width:36em;margin:0 auto;font:400 16px/2.3 Noto Serif JP;text-align:left}

.co-menu{background:var(--ivory)}
.ch{grid-template-columns:1fr 1fr;align-items:center;gap:7vw;min-height:88vh;padding:120px 7vw;display:grid}
.ch+.ch{border-top:1px solid var(--line)}
.ch.flip .ch-photo{order:2}
.ch-photo{background:var(--navy);aspect-ratio:4/5;max-height:78vh;margin:0;position:relative;overflow:hidden}
.ch-photo img{object-fit:cover;filter:saturate(.8);height:100%}
.ch-num{color:#fff;text-shadow:0 2px 30px #07182a99;letter-spacing:-.02em;font:700 clamp(96px,13vw,200px)/.8 Barlow Condensed;position:absolute;bottom:22px;left:24px}
.ch.on-light .ch-num{color:var(--navy);text-shadow:none}
.ch-for{letter-spacing:.2em;color:var(--red);font:600 12px/1.8 Noto Sans JP;display:block}
.ch-body h2{letter-spacing:-.02em;margin:22px 0 20px;font:600 clamp(32px,3.6vw,54px)/1.4 Noto Serif JP}
.ch-lead{color:var(--red);margin:0 0 20px;font:600 clamp(15px,1.3vw,18px)/1.9 Noto Serif JP}
.ch-desc{color:#43505b;max-width:32em;margin:0 0 28px;font:400 15px/2.2 Noto Serif JP}
.ch-tags{gap:8px;margin:0 0 34px;padding:0;list-style:none;display:flex;flex-wrap:wrap}
.ch-tags li{border:1px solid var(--ink);letter-spacing:.12em;padding:8px 16px;font:600 13px Noto Sans JP}

.co-how{background:var(--navy);color:#fff}
.co-how>small{color:#c9d1d8}
.co-how h2{letter-spacing:-.04em;margin:26px 0 60px;font:600 clamp(32px,4vw,58px)/1.4 Noto Serif JP}
.co-how ol{grid-template-columns:repeat(3,1fr);gap:48px;margin:0;padding:0;list-style:none;display:grid}
.co-how li{border-top:2px solid #fff;padding-top:26px}
.co-how li>span{color:var(--red);font:700 56px/1 Barlow Condensed;display:block;-webkit-text-stroke:0}
.co-how h3{margin:18px 0 14px;font:600 clamp(20px,1.8vw,26px)/1.5 Noto Serif JP}
.co-how p{color:#c9d1d8;margin:0;font:400 14px/2.1 Noto Serif JP}

.co-cta{background:var(--paper)}
.co-cta-head h2{letter-spacing:-.04em;margin:26px 0 22px;font:600 clamp(30px,3.6vw,52px)/1.45 Noto Serif JP}
.co-cta-head p{color:#43505b;max-width:38em;margin:0 0 56px;font:400 15px/2.1 Noto Serif JP}
.co-cta .ways-list{grid-template-columns:1fr 1fr;gap:24px;display:grid}

/* トップの入口 */
.coaching-top .coaching-menus{color:var(--ink);margin:0 0 34px;font:600 15px/2 Noto Serif JP}

/* 動き：ゆっくり現れるだけ。「動きを減らす」設定では何もしない */
html.co-motion .reveal{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
html.co-motion .reveal.on{opacity:1;transform:none}
html.co-motion .ch-photo.reveal{opacity:1;transform:none}
html.co-motion .ch-photo.reveal img{clip-path:inset(0 0 100% 0);transform:scale(1.12);transition:clip-path 1.2s cubic-bezier(.75,0,.2,1),transform 1.8s cubic-bezier(.2,.7,.2,1)}
html.co-motion .ch-photo.reveal.on img{clip-path:inset(0);transform:none}
html.co-motion .ch-photo .ch-num{opacity:0;transform:translateX(-50px) skewX(-8deg);transition:opacity .6s ease .7s,transform 1s cubic-bezier(.16,1,.3,1) .7s}
html.co-motion .ch-photo.on .ch-num{opacity:1;transform:none}
html.co-motion .ch-body>.reveal:nth-child(2){transition-delay:.08s}
html.co-motion .ch-body>.reveal:nth-child(3){transition-delay:.16s}
html.co-motion .ch-body>.reveal:nth-child(4){transition-delay:.24s}
html.co-motion .ch-body>.reveal:nth-child(5){transition-delay:.32s}
html.co-motion .co-how li.reveal:nth-child(2){transition-delay:.15s}
html.co-motion .co-how li.reveal:nth-child(3){transition-delay:.3s}

@media (width<=900px){
  .co-lead{padding:110px 24px 80px}
  .co-lead p{font-size:15px}
  .ch{grid-template-columns:1fr;gap:34px;min-height:0;padding:80px 24px}
  .ch.flip .ch-photo{order:0}
  .ch-photo{aspect-ratio:4/3;max-height:none}
  .ch-num{font-size:110px;bottom:14px;left:16px}
  .co-how ol{grid-template-columns:1fr;gap:36px}
  .co-cta .ways-list{grid-template-columns:1fr;gap:18px}
}
