/* セールスレター部分（読ませる段） */
.letter{padding:clamp(90px,14vh,180px) var(--pad);position:relative;z-index:1}
.lt-in{max-width:760px;margin:0 auto}
.letter .label{color:#c9ced6;margin-bottom:clamp(16px,1.6vw,26px)}
.lt-h{font-size:clamp(28px,3.4vw,58px);font-weight:500;line-height:1.3;letter-spacing:-.02em;margin-bottom:clamp(30px,3.4vw,56px);text-wrap:balance}
.lt-in>p,.ex p,.case-foot p{font-size:clamp(16px,1.08vw,18px);line-height:2.05;color:#d5dae0;margin-bottom:1.5em;text-wrap:pretty}
.lt-in strong{color:#fff;font-weight:600;background:linear-gradient(transparent 62%,rgba(31,99,224,.55) 62%)}
.lt-key{font-size:clamp(22px,2.1vw,36px)!important;line-height:1.5!important;font-weight:500;color:var(--ink)!important;margin:1.6em 0!important;letter-spacing:-.01em;text-wrap:balance}
.myth-no{color:var(--accent);filter:brightness(1.6);margin-bottom:clamp(14px,1.4vw,22px)}
.myth{border-top:1px solid var(--line)}
.myth .lt-h{font-size:clamp(30px,3.8vw,66px)}

/* 2択の比較 */
.vs{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.4vw,22px);margin:2em 0 2.2em}
.vs-c{border:1px solid var(--line);border-radius:8px;padding:clamp(20px,2vw,32px);background:rgba(16,23,31,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.vs-c .mono{color:#9aa3ad}
.vs-c h3{font-size:clamp(18px,1.4vw,24px);font-weight:500;line-height:1.4;margin:.5em 0 .6em}
.vs-c p:not(.mono){color:#c9ced6;font-size:15px;line-height:1.9}

/* 実例の枠 */
.ex{margin:2.4em 0;padding:clamp(22px,2.4vw,40px);border-left:2px solid var(--accent);background:rgba(16,23,31,.6);border-radius:0 8px 8px 0}
.ex .mono{color:#9aa3ad;margin-bottom:1em}
.ex p:last-child{margin-bottom:0}

.lt-list{list-style:none;margin:1.4em 0 1.8em;border-top:1px solid var(--line)}
.lt-list li{padding:14px 0 14px 1.6em;border-bottom:1px solid var(--line);font-size:clamp(15px,1.02vw,17px);color:#d5dae0;position:relative}
.lt-list li::before{content:"+";position:absolute;left:0;font-family:var(--mono);color:#9aa3ad}

/* いま担当している仕事 */
.case{padding:clamp(90px,14vh,180px) var(--pad);border-top:1px solid var(--line)}
.case-head{max-width:1100px;margin:0 auto clamp(40px,5vw,80px)}
.case-head .label{color:#c9ced6}
.case .sec-title{text-align:left;margin:14px 0 24px;text-wrap:balance}
.case-lead{color:#c9ced6;font-size:clamp(15px,1.02vw,17px);line-height:2;max-width:760px}
.case-grid{list-style:none;max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden}
.case-grid li{background:var(--bg);padding:clamp(20px,1.8vw,30px);min-height:220px;transition:background .4s}
.case-grid li:hover{background:#111a24}
.case-grid .mono{color:var(--accent);filter:brightness(1.6)}
.case-grid h3{font-size:clamp(17px,1.25vw,21px);font-weight:500;line-height:1.45;margin:.8em 0 .6em}
.case-grid p{color:#aab2bc;font-size:14px;line-height:1.85}
.case-foot{max-width:760px;margin:clamp(50px,6vw,100px) auto 0}

.concept-note{color:#9aa3ad;font-size:clamp(14px,1vw,17px);margin-top:clamp(10px,1.4vw,24px)}

/* 3つの選び方 */
.choose{border-top:1px solid var(--line)}
.choose .lt-in{max-width:1100px}
.ch3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.4vw,22px)}
.ch-c{border:1px solid var(--line);border-radius:8px;padding:clamp(22px,2vw,34px);background:rgba(16,23,31,.55)}
.ch-c .mono{color:#9aa3ad}
.ch-c h3{font-size:clamp(18px,1.35vw,23px);font-weight:500;line-height:1.45;margin:.7em 0 .7em}
.ch-c p:not(.mono){color:#aab2bc;font-size:15px;line-height:1.9}
.ch-c.on{border-color:var(--accent);background:rgba(31,99,224,.14)}
.ch-c.on .mono{color:#fff}

.ps{max-width:640px;margin:clamp(40px,5vw,70px) auto 0;text-align:left;color:#9aa3ad;font-size:14px;line-height:2;border-top:1px solid var(--line);padding-top:24px}

/* 段落がふわっと出る */
.fx{opacity:0;transform:translateY(18px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.fx.in{opacity:1;transform:none}

@media (max-width:820px){
  .vs,.ch3{grid-template-columns:1fr}
  .case-grid{grid-template-columns:1fr 1fr}
  .case-grid li{min-height:0}
}
@media (max-width:480px){
  .case-grid{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.fx{opacity:1;transform:none;transition:none}}
.nb{display:inline-block}
.ln-myths{display:flex;flex-direction:column;gap:10px;align-items:center;margin-top:clamp(24px,3vw,44px);color:#c9ced6}
.ln-myths span{border:1px solid var(--line);border-radius:999px;padding:8px 18px;text-transform:none}
.concept-note.top{margin:0 0 clamp(16px,2vw,30px);line-height:2;max-width:820px}
@media (max-width:820px){#cross .case-grid li:last-child:nth-child(odd),#know .case-grid li:last-child:nth-child(odd){grid-column:1/-1}}
@media (min-width:821px){#cross .case-grid,#know .case-grid{grid-template-columns:repeat(3,1fr)}}
/* 副業人材の段：Chinu-maruさんのイラスト4枚（Adobe Stock 625426558） */
.ppl{list-style:none;margin:clamp(40px,5vw,80px) auto 0;padding:0;max-width:1100px;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.2vw,18px)}
.ppl li{border-radius:6px;overflow:hidden;aspect-ratio:1}
.ppl img{display:block;width:100%;height:100%;object-fit:cover}
.ppl li.fx:nth-child(2){transition-delay:.08s}.ppl li.fx:nth-child(3){transition-delay:.16s}.ppl li.fx:nth-child(4){transition-delay:.24s}
@media (max-width:820px){.ppl{grid-template-columns:repeat(2,1fr)}}
/* AIの段：Chinu-maruさんのイラスト（Adobe Stock 1991567610） */
.ai-ill{margin:clamp(28px,3vw,48px) 0 clamp(32px,3.4vw,56px);border-radius:6px;overflow:hidden;aspect-ratio:3/2}
.ai-ill img{display:block;width:100%;height:100%;object-fit:cover}