/* ═══════════════════════════════════════
   MUSE Solutions — ページ固有CSS
   ═══════════════════════════════════════ */

/* ══════════════════════════════
   PAGE HERO — 2段グリッド対角線
   ══════════════════════════════ */
/* (pg-hero base → tokens.css) */
.pg-hero__grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  grid-template-rows:auto clamp(40px,6vh,80px) auto;
  width:100%;
  position:relative;z-index:1;
}
/* Row 1 左: タイトル */
.pg-hero__left{
  grid-column:1;grid-row:1;
  display:flex;flex-direction:column;
}
/* Row 2-3 右: コピー（下に配置） */
.pg-hero__right{
  grid-column:2;grid-row:2 / 4;
  display:flex;flex-direction:column;
  justify-content:flex-end;
}
.pg-hero__ey{
  font-family:var(--fm);font-size:clamp(6px,.5vw,8px);
  letter-spacing:.36em;text-transform:uppercase;color:var(--k6);
  display:flex;align-items:center;gap:12px;
  margin-bottom:clamp(20px,3vh,36px);
}
.pg-hero__ey::before{content:'';width:26px;height:1px;background:var(--k7);flex-shrink:0}
.pg-hero__title{
  font-family:var(--fd);font-weight:800;
  font-size:clamp(72px,10vw,152px);
  letter-spacing:-.05em;line-height:.78;color:var(--k);
}
.pg-hero__title .--dot{
  color:var(--bl);
  text-shadow:0 0 18px rgba(24,71,204,.4),0 0 40px rgba(24,71,204,.15);
}
.pg-hero__title-sub{
  display:block;
  font-family:var(--fd);font-weight:800;
  font-size:clamp(28px,3.5vw,52px);
  letter-spacing:-.03em;line-height:1;color:var(--k);
  margin-top:clamp(10px,1.5vh,18px);
  text-transform:none; /* tokens.cssのuppercase漏れ防止 */
}
.pg-hero__sub-en{
  font-family:var(--fb);font-size:clamp(8px,.6vw,10px);
  letter-spacing:.06em;color:var(--k6);
  margin-top:clamp(14px,2vh,24px);
}
.pg-hero__mission{
  font-family:var(--fjs);font-weight:500;
  font-size:clamp(18px,2vw,28px);
  line-height:1.7;letter-spacing:.06em;color:var(--k3);
}
.pg-hero__mission em{
  font-style:normal;color:var(--bl);font-weight:600;
}
.pg-hero__rule{
  width:clamp(28px,3vw,44px);height:1px;flex-shrink:0;
  background:linear-gradient(90deg,var(--bl),rgba(24,71,204,.08));
  margin:clamp(24px,3vh,40px) 0 clamp(14px,2vh,20px);
}
.pg-hero__copy{
  font-family:var(--fj);font-weight:350;
  font-size:clamp(12px,.88vw,14px);
  line-height:2.1;letter-spacing:.04em;color:var(--k5);
}
.pg-hero__copy strong{color:var(--k3);font-weight:500}
.pg-hero__count{
  display:flex;align-items:baseline;gap:6px;
  margin-top:clamp(16px,2vh,24px);
}
.pg-hero__count-num{
  font-family:var(--fd);font-weight:800;
  font-size:clamp(28px,3.5vw,44px);
  line-height:1;letter-spacing:-.04em;color:var(--k3);
}
.pg-hero__count-num .--s{font-size:.45em;color:var(--bl)}
.pg-hero__count-label{
  font-family:var(--fm);font-size:clamp(7px,.55vw,9px);
  letter-spacing:.22em;text-transform:uppercase;color:var(--k6);
}

@media(max-width:767px){
  .pg-hero{padding:clamp(120px,15vh,160px) clamp(20px,5vw,32px) clamp(44px,6vh,64px)}
  .pg-hero__grid{
    grid-template-columns:1fr;
    grid-template-rows:auto auto;
  }
  .pg-hero__left{grid-column:1;grid-row:1}
  .pg-hero__right{grid-column:1;grid-row:2;margin-top:clamp(28px,5vh,40px)}
  .pg-hero__title{font-size:clamp(52px,14vw,80px)}
  .pg-hero__title-sub{font-size:clamp(22px,6vw,32px)}
  .pg-hero__mission{font-size:clamp(16px,4.5vw,22px)}
}


/* ══════════════════════════════
   CARD LIST
   ══════════════════════════════ */
.biz-list{
  max-width:1240px;margin:0 auto;
  padding:clamp(20px,3vh,40px) var(--sp-wrap) var(--sp-page-bottom);
  display:flex;flex-direction:column;
  gap:var(--sp-section);
  position:relative;z-index:1;
}

/* ══════════════════════════════
   BIZ CARD — from v3b + 互い違い
   ══════════════════════════════ */
.biz{
  width:100%;
  position:relative;overflow:hidden;
  background:var(--w);
  box-shadow:
    inset 1px 1px 0 rgba(255,255,255,.9),
    var(--shadow-section);
  opacity:0;transform:translateY(24px);
  transition:opacity 1s var(--smooth),transform 1s var(--smooth);
}
.biz.--in{opacity:1;transform:none}

/* グレインテクスチャ */
.biz::after{
  content:'';position:absolute;inset:0;pointer-events:none;z-index:0;
  background:
    var(--grain-fine),
    linear-gradient(155deg, transparent 20%, rgba(212,220,233,.28) 65%, rgba(168,181,204,.15) 100%);
  background-size:200px 200px, 100% 100%;
  opacity:.35;mix-blend-mode:multiply;
}

/* ── Upper: 2-column zone ── */
.biz__upper{
  display:grid;
  grid-template-columns:1fr clamp(220px,36%,400px);
}
/* 偶数カード: 画像左/テキスト右 */
.biz--rev .biz__upper{
  grid-template-columns:clamp(220px,36%,400px) 1fr;
}
.biz--rev .biz__ct{order:2}
.biz--rev .biz__img{order:1}
@media(max-width:720px){
  .biz__upper{grid-template-columns:1fr !important}
  .biz--rev .biz__ct{order:initial}
  .biz--rev .biz__img{order:-1}
}

/* ── Content column ── */
.biz__ct{display:flex;flex-direction:column;min-width:0;position:relative;z-index:2}

/* ── Image column ── */
.biz__img{position:relative;overflow:hidden}
.biz__img img{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.8) contrast(1.06);
  transition:transform 10s var(--smooth),filter 1.2s;
}
.biz:hover .biz__img img{transform:scale(1.06);filter:saturate(.95) contrast(1.06)}
.biz__img-grad{
  position:absolute;inset:0;pointer-events:none;z-index:2;
  background:
    linear-gradient(to right,rgba(255,255,255,.5) 0%,transparent 35%),
    linear-gradient(to bottom,rgba(255,255,255,.08),transparent 12%,transparent 88%,rgba(255,255,255,.08));
}
/* 偶数カード: 右からグラデ */
.biz--rev .biz__img-grad{
  background:
    linear-gradient(to left,rgba(255,255,255,.5) 0%,transparent 35%),
    linear-gradient(to bottom,rgba(255,255,255,.08),transparent 12%,transparent 88%,rgba(255,255,255,.08));
}
.biz__img-num{
  position:absolute;z-index:3;pointer-events:none;
  bottom:clamp(14px,2.5vw,28px);right:clamp(14px,2.5vw,28px);
  font-family:var(--fd);font-size:clamp(60px,8vw,100px);font-weight:800;
  line-height:1;letter-spacing:-.04em;
  color:rgba(255,255,255,.55);
  text-shadow:0 2px 20px rgba(6,11,24,.25);
}
.biz--rev .biz__img-num{right:auto;left:clamp(14px,2.5vw,28px)}
.biz__img-bar{
  position:absolute;z-index:4;left:0;top:10%;bottom:10%;width:3px;
  background:linear-gradient(to bottom,transparent,var(--bl),transparent);
  opacity:0;transform:scaleY(0);
  transition:opacity .8s 1s var(--smooth),transform 1.2s 1s var(--spring);
}
.biz.--in .biz__img-bar{opacity:.5;transform:scaleY(1)}
.biz--rev .biz__img-bar{left:auto;right:0}
@media(max-width:720px){
  .biz__img{height:200px;min-height:auto;order:-1}
  .biz__img-grad{background:linear-gradient(to bottom,transparent 65%,rgba(255,255,255,.4)) !important}
  .biz__img-num{font-size:56px;bottom:10px;right:14px}
  .biz--rev .biz__img-num{right:14px;left:auto}
  .biz__img-bar{display:none}
}

/* ── Header ── */
.biz__head{padding:var(--pad) var(--pad) clamp(14px,1.8vw,20px);position:relative;z-index:2}
.biz__num{
  font-family:var(--fm);font-size:clamp(9px,.7vw,11px);font-weight:700;
  letter-spacing:.35em;color:var(--bl);opacity:.55;
}
.biz__en{
  font-family:var(--fd);font-size:clamp(32px,4.5vw,56px);font-weight:800;
  letter-spacing:-.04em;line-height:.9;color:var(--k);margin-top:8px;
}
.biz__en .--dot{color:var(--bl)}
.biz__ja{
  font-family:var(--fjs);font-size:clamp(12px,1.1vw,15px);font-weight:500;
  letter-spacing:.1em;color:var(--k4);margin-top:8px;
}
.biz__meta{display:flex;align-items:center;gap:10px;margin-top:clamp(10px,1.2vw,14px)}
.biz__badge{
  font-family:var(--fd);font-size:8px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;color:var(--bl);
  padding:4px 10px;background:rgba(37,99,235,.05);border:1px solid rgba(37,99,235,.08);
}
.biz__scope{
  font-family:var(--fm);font-size:8px;font-weight:400;
  letter-spacing:.08em;color:var(--k6);
}

/* ── Divider ── */
.biz__div{
  height:1px;margin:0 var(--pad);position:relative;z-index:2;
  background:linear-gradient(90deg,var(--bl),rgba(37,99,235,.12) 60%,transparent);
  transform:scaleX(0);transform-origin:left;
  transition:transform 1.4s .4s var(--smooth);
}
.biz.--in .biz__div{transform:scaleX(1)}
.biz--rev .biz__div{transform-origin:right}

/* ── Body ── */
.biz__body{padding:clamp(16px,2.2vw,26px) var(--pad);position:relative;z-index:2}
.biz__desc{
  font-family:var(--fj);font-size:clamp(12px,.88vw,14px);
  font-weight:380;line-height:2.1;letter-spacing:.035em;color:var(--k4);
}

/* ── Supplement ── */
.biz__sup{margin-top:clamp(16px,2vw,24px)}
.biz__sup-toggle{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--fd);font-size:9px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--bl);opacity:.45;
  cursor:pointer;border:none;background:none;padding:4px 0;
  transition:opacity .3s,gap .3s var(--smooth);
}
.biz__sup-toggle:hover{opacity:.75;gap:11px}
.biz__sup-toggle svg{
  width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.8;
  transition:transform .4s var(--spring);
}
.biz__sup-toggle.--open svg{transform:rotate(45deg)}
.biz__sup-body{max-height:0;overflow:hidden;transition:max-height .6s var(--smooth),opacity .4s;opacity:0}
.biz__sup-body.--open{opacity:1}
.biz__tags{display:flex;flex-wrap:wrap;gap:5px;padding-top:clamp(10px,1.2vw,14px)}
.biz__tag{
  font-family:var(--fj);font-size:10px;font-weight:400;
  letter-spacing:.03em;color:var(--k5);
  padding:4px 10px;background:rgba(37,99,235,.035);border:1px solid rgba(37,99,235,.05);
  transition:background .3s,border-color .3s;
}
.biz__tag:hover{background:rgba(37,99,235,.07);border-color:rgba(37,99,235,.1)}

/* ══ Lower: full-width ══ */
.biz__lower{
  border-top:1px solid rgba(0,0,0,.04);position:relative;z-index:2;
  background:var(--w);
  box-shadow:var(--shadow-section);
}

/* ── FAQ ── */
.biz__faq-wrap{padding:clamp(10px,1.2vw,16px) var(--pad)}
.biz__faq-toggle{
  display:flex;align-items:center;gap:10px;
  font-family:var(--fj);font-size:clamp(12px,.92vw,14px);font-weight:500;
  letter-spacing:.04em;color:var(--k4);
  cursor:pointer;border:none;
  background:linear-gradient(135deg,rgba(37,99,235,.04),rgba(37,99,235,.02));
  padding:clamp(11px,1.3vw,15px) clamp(16px,2vw,22px);
  width:100%;text-align:left;
  transition:background .3s,color .3s,gap .3s var(--smooth);
  position:relative;overflow:hidden;
}
.biz__faq-toggle::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:0;
  background:rgba(37,99,235,.06);transition:width .5s var(--smooth);
}
.biz__faq-toggle:hover::before{width:100%}
.biz__faq-toggle:hover{color:var(--bl)}
.biz__faq-toggle span{position:relative;z-index:1;display:flex;align-items:center;gap:inherit}
.biz__faq-toggle svg{
  width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;
  flex-shrink:0;transition:transform .4s var(--spring);position:relative;z-index:1;
}
.biz__faq-toggle.--open svg{transform:rotate(180deg)}
.biz__faq-body{max-height:0;overflow:hidden;transition:max-height .7s var(--smooth),opacity .5s;opacity:0}
.biz__faq-body.--open{opacity:1}
.biz__faq-inner{
  padding:clamp(10px,1.2vw,14px) 0 clamp(16px,2vw,24px);
  display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,3vw,40px);
}
@media(max-width:720px){.biz__faq-inner{grid-template-columns:1fr}}
.faq+.faq{border-top:1px solid rgba(0,0,0,.035)}
.faq__row{
  display:flex;align-items:baseline;gap:clamp(8px,1vw,12px);
  padding:clamp(10px,1.1vw,14px) 0 2px;
}
.faq__q-num{font-family:var(--fm);font-size:9px;font-weight:700;color:var(--bl);opacity:.45;flex-shrink:0;width:20px}
.faq__q-text{flex:1;font-family:var(--fj);font-size:clamp(11px,.85vw,13px);font-weight:500;letter-spacing:.02em;color:var(--k3)}
.faq__a-text{
  font-family:var(--fj);font-size:clamp(11px,.78vw,12px);
  font-weight:350;line-height:1.95;letter-spacing:.02em;color:var(--k5);
  padding:2px 0 clamp(10px,1.1vw,14px) 28px;
}

/* ── Detail link — HOMEのz-ctaボタンと同じ文法 ── */
.biz__more{
  display:flex;align-items:center;justify-content:space-between;
  padding:clamp(16px,2vw,22px) var(--pad);
  border-top:1px solid rgba(0,0,0,.04);
  text-decoration:none;
  transition:background .4s,padding-left .5s var(--smooth);
  position:relative;z-index:2;
}
.biz__more::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--bl3),var(--bl));
  transform:scaleY(0);transform-origin:bottom;transition:transform .4s var(--smooth);
}
.biz__more:hover::before{transform:scaleY(1)}
.biz__more:hover{background:rgba(37,99,235,.015);padding-left:calc(var(--pad) + 6px)}
.biz__more-left{display:flex;flex-direction:column;gap:2px}
.biz__more-label{
  font-family:var(--fd);font-size:clamp(11px,.88vw,13px);font-weight:700;
  letter-spacing:.06em;color:var(--k2);transition:color .3s;
}
.biz__more:hover .biz__more-label{color:var(--bl)}
.biz__more-sub{font-family:var(--fj);font-size:9px;font-weight:350;letter-spacing:.03em;color:var(--k6)}
.biz__more-arrow{
  width:36px;height:36px;display:grid;place-items:center;
  background:var(--k);flex-shrink:0;position:relative;overflow:hidden;
  transition:transform .4s var(--smooth);
}
.biz__more-arrow::before{
  content:'';position:absolute;inset:0;background:var(--bl);
  transform:translateX(-101%);transition:transform .4s var(--smooth);
}
.biz__more:hover .biz__more-arrow::before{transform:translateX(0)}
.biz__more:hover .biz__more-arrow{transform:translateX(3px)}
.biz__more-arrow svg{
  width:14px;height:14px;fill:none;stroke:var(--w);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:1;
}

