/* ============================================================
   ClearRiver — TECHNO EDITORIAL
   Sub-page shared components
   ============================================================ */

/* ---- Page header (compact hero) ---- */
.p-phead{
  position:relative; overflow:hidden; padding-top:150px; padding-bottom:clamp(56px,7vw,92px);
  background:
    radial-gradient(ellipse 80% 70% at 82% 12%, rgba(var(--accent-rgb),.14), transparent 60%),
    var(--bg);
  border-bottom:1px solid var(--line-faint);
}
.p-phead__field{ position:absolute; inset:0; z-index:0; }
.p-phead .fx-glow--blue{ width:560px; height:560px; top:-200px; right:-140px; }
.p-phead__watermark{
  position:absolute; right:-1%; bottom:-14%; font-family:var(--font-display); font-weight:900;
  font-variation-settings:"wght" 900,"wdth" 96; font-size:min(20vw,230px); line-height:.9;
  color:transparent; -webkit-text-stroke:1.5px rgba(255,255,255,.05); pointer-events:none; z-index:0; user-select:none;
}
body[data-theme="light"] .p-phead__watermark{ -webkit-text-stroke-color:rgba(10,15,30,.07); }
.c-sphere--phead{ --d:clamp(180px,22vw,320px); top:-40px; right:4%; opacity:.9; }
.p-phead__inner{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }

.c-breadcrumb{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:30px; font-family:var(--font-mono); font-size:11.5px; letter-spacing:.06em; }
.c-breadcrumb a{ color:var(--ink-mute); transition:color .2s; }
.c-breadcrumb a:hover{ color:var(--accent-br); }
.c-breadcrumb span[aria-current]{ color:var(--ink); }
.c-breadcrumb .sep{ color:var(--ink-faint); }

.p-phead__eyebrow{ font-family:var(--font-mono); font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent-br); display:flex; align-items:center; margin-bottom:24px; }
.p-phead__title{ font-family:var(--font-jp); font-weight:900; color:var(--ink); font-size:clamp(30px,4.6vw,60px); line-height:1.24; letter-spacing:.01em; max-width:34ch; text-wrap:balance; }
.p-phead__title em{ font-style:normal; color:var(--accent-br); }
.p-phead__lead{ margin-top:26px; color:var(--ink-mute); font-size:clamp(15px,1.2vw,16.5px); line-height:2.05; max-width:62ch; }

/* generic sub-page section */
.l-sub{ padding:var(--sec-y) 0; }
.l-sub--alt{ background:var(--bg-2); border-top:1px solid var(--line-faint); border-bottom:1px solid var(--line-faint); }
.l-sub__inner{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad); }
.l-sub__inner--narrow{ max-width:920px; }

/* ---- Recommend list (こんな方に) ---- */
.c-reco{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.c-reco__item{ display:flex; gap:18px; align-items:flex-start; padding:24px 26px; background:var(--bg-2); border:1px solid var(--line-faint); border-radius:3px; transition:border-color .3s, transform .3s var(--ease); }
.l-sub--alt .c-reco__item{ background:var(--bg); }
.c-reco__item:hover{ border-color:var(--accent); transform:translateY(-3px); }
.c-reco__check{ width:30px; height:30px; flex-shrink:0; border-radius:50%; background:rgba(var(--accent-rgb),.14); display:flex; align-items:center; justify-content:center; }
.c-reco__check::after{ content:""; width:7px; height:12px; border-right:2.5px solid var(--accent-br); border-bottom:2.5px solid var(--accent-br); transform:rotate(40deg) translateY(-1px); }
.c-reco__text{ font-size:14.5px; color:var(--ink); line-height:1.75; }
@media (max-width:768px){ .c-reco{ grid-template-columns:1fr; } }

/* ---- Style flow (制作スタイル: 7工程) ---- */
.c-pipeline{ display:flex; flex-wrap:wrap; gap:12px; align-items:stretch; }
.c-pipeline__step{ position:relative; flex:1; min-width:130px; background:var(--bg-2); border:1px solid var(--line-faint); border-radius:3px; padding:22px 20px; }
.l-sub--alt .c-pipeline__step{ background:var(--bg); }
.c-pipeline__step::after{ content:"→"; position:absolute; right:-14px; top:50%; transform:translateY(-50%); color:var(--accent-br); font-weight:700; z-index:2; }
.c-pipeline__step:last-child::after{ display:none; }
.c-pipeline__n{ font-family:var(--font-mono); font-size:11px; color:var(--accent-br); letter-spacing:.1em; }
.c-pipeline__t{ font-family:var(--font-jp); font-weight:700; font-size:15px; color:var(--ink); margin-top:10px; line-height:1.5; }
@media (max-width:900px){ .c-pipeline__step::after{ content:"↓"; right:auto; left:50%; top:auto; bottom:-15px; transform:translateX(-50%); } }

/* ---- Package detail ---- */
.c-package{ display:grid; grid-template-columns:.9fr 1.1fr; border:1px solid var(--line); border-radius:5px; overflow:hidden; }
.c-package__head{ position:relative; background:linear-gradient(160deg,var(--bg-3),var(--bg)); padding:46px 42px; overflow:hidden; }
.c-package__head::after{ content:""; position:absolute; right:-90px; bottom:-90px; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle, rgba(var(--accent-rgb),.4), transparent 65%); filter:blur(44px); opacity:var(--glow-strength); }
.c-package__badge{ position:relative; z-index:2; display:inline-block; font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:.08em; background:var(--accent); color:var(--accent-ink); padding:6px 12px; border-radius:2px; margin-bottom:22px; }
.c-package__name{ position:relative; z-index:2; font-family:var(--font-jp); font-weight:900; font-size:22px; color:var(--ink); line-height:1.5; margin-bottom:28px; }
.c-package__amount{ position:relative; z-index:2; display:flex; align-items:baseline; gap:6px; }
.c-package__amount strong{ font-family:var(--font-display); font-weight:900; font-variation-settings:"wght" 900,"wdth" 105; font-size:82px; line-height:.85; color:var(--ink); letter-spacing:-.02em; }
.c-package__amount span{ font-family:var(--font-jp); font-weight:700; font-size:22px; color:var(--accent-br); }
.c-package__note{ position:relative; z-index:2; font-size:12.5px; color:var(--ink-mute); margin-top:18px; line-height:1.85; }
.c-package__body{ background:var(--bg); padding:46px 42px; }
.c-package__body-title{ font-family:var(--font-jp); font-weight:700; font-size:16px; color:var(--ink); margin-bottom:24px; }
.c-included{ display:grid; grid-template-columns:1fr; gap:14px; }
.c-included li{ position:relative; padding-left:30px; font-size:13.5px; color:var(--ink-mute); line-height:1.7; }
.c-included li strong{ color:var(--ink); font-weight:700; }
.c-included li::before{ content:""; position:absolute; left:0; top:3px; width:18px; height:18px; border-radius:50%; background:rgba(var(--accent-rgb),.16); }
.c-included li::after{ content:""; position:absolute; left:6px; top:6px; width:5px; height:9px; border-right:2px solid var(--accent-br); border-bottom:2px solid var(--accent-br); transform:rotate(40deg); }
.c-included__num{ display:inline-block; font-family:var(--font-mono); font-size:11px; color:var(--accent-br); margin-right:8px; }
@media (max-width:900px){ .c-package{ grid-template-columns:1fr; } }

.c-notes{ margin-top:28px; border-left:2px solid var(--line-strong); padding:4px 0 4px 20px; display:flex; flex-direction:column; gap:10px; }
.c-notes li{ font-size:12.5px; color:var(--ink-mute); line-height:1.8; }
.c-notes li::before{ content:"※ "; color:var(--accent-br); }

/* ---- Tables (option / company / comparison) ---- */
.c-table-wrap{ border:1px solid var(--line); border-radius:4px; overflow:hidden; }
.c-table{ width:100%; border-collapse:collapse; font-size:14px; }
.c-table th, .c-table td{ padding:18px 22px; text-align:left; border-bottom:1px solid var(--line-faint); vertical-align:top; }
.c-table thead th{ background:var(--bg-3); font-family:var(--font-mono); font-size:11.5px; letter-spacing:.08em; color:var(--accent-br); text-transform:uppercase; font-weight:700; }
.c-table tbody tr:last-child td{ border-bottom:0; }
.c-table tbody tr{ transition:background .25s; }
.c-table tbody tr:hover{ background:var(--bg-2); }
.c-table td:first-child{ color:var(--ink); font-weight:600; }
.c-table .price{ font-family:var(--font-display); font-weight:800; color:var(--accent-br); white-space:nowrap; font-variation-settings:"wght" 800,"wdth" 100; }
.c-table .muted{ color:var(--ink-mute); font-weight:400; font-size:13px; }

/* comparison table */
.c-compare{ width:100%; border-collapse:collapse; font-size:14px; }
.c-compare th, .c-compare td{ padding:16px 18px; text-align:center; border-bottom:1px solid var(--line-faint); border-right:1px solid var(--line-faint); }
.c-compare th:first-child, .c-compare td:first-child{ text-align:left; }
.c-compare td:last-child, .c-compare th:last-child{ border-right:0; }
.c-compare thead th{ background:var(--bg-3); font-family:var(--font-jp); font-weight:700; font-size:13.5px; color:var(--ink); }
.c-compare thead th.is-us{ background:var(--accent); color:var(--accent-ink); position:relative; }
.c-compare thead th.is-us small{ display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; opacity:.85; margin-top:3px; font-weight:400; }
.c-compare tbody td:first-child{ color:var(--ink); font-weight:600; font-size:13.5px; }
.c-compare .col-us{ background:rgba(var(--accent-rgb),.06); color:var(--ink); font-weight:700; }
.c-compare .mk{ font-family:var(--font-display); font-weight:800; font-size:18px; line-height:1; }
.c-compare .mk--o{ color:var(--accent-br); }
.c-compare .mk--good{ color:var(--teal); }
.c-compare .mk--mid{ color:var(--ink-mute); }
.c-compare .mk--bad{ color:var(--ink-faint); }
.c-compare tbody tr:last-child td{ border-bottom:0; }
.c-compare tbody tr:last-child{ font-family:var(--font-jp); }
.c-compare .cell-note{ display:block; font-size:10.5px; color:var(--ink-mute); font-weight:400; margin-top:2px; }
@media (max-width:768px){
  .c-table-wrap{ overflow-x:auto; }
  .c-compare, .c-table{ min-width:620px; }
}

/* ---- Process detail (2 columns: us / client) ---- */
.c-process{ display:flex; flex-direction:column; gap:0; }
.c-process__step{ display:grid; grid-template-columns:130px 1fr 1fr; gap:0; border:1px solid var(--line-faint); border-bottom:0; }
.c-process__step:last-child{ border-bottom:1px solid var(--line-faint); }
.c-process__meta{ background:var(--bg-3); padding:26px 24px; }
.c-process__n{ font-family:var(--font-display); font-weight:900; font-variation-settings:"wght" 900,"wdth" 90; font-size:34px; color:var(--accent-br); line-height:1; }
.c-process__phase{ font-family:var(--font-jp); font-weight:700; font-size:14px; color:var(--ink); margin-top:12px; line-height:1.4; }
.c-process__period{ display:inline-block; font-family:var(--font-mono); font-size:10.5px; color:var(--accent-br); border:1px solid var(--line); padding:3px 8px; border-radius:2px; margin-top:12px; }
.c-process__col{ padding:26px 28px; border-left:1px solid var(--line-faint); }
.c-process__col-label{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.1em; color:var(--ink-faint); text-transform:uppercase; margin-bottom:12px; }
.c-process__col--us .c-process__col-label{ color:var(--accent-br); }
.c-process__col-text{ font-size:13.5px; color:var(--ink-mute); line-height:1.85; }
@media (max-width:900px){
  .c-process__step{ grid-template-columns:1fr; }
  .c-process__col{ border-left:0; border-top:1px solid var(--line-faint); }
}

/* ---- FAQ accordion ---- */
.c-faq{ display:flex; flex-direction:column; gap:12px; }
.c-faq__item{ border:1px solid var(--line-faint); border-radius:3px; background:var(--bg-2); overflow:hidden; transition:border-color .3s; }
.l-sub--alt .c-faq__item{ background:var(--bg); }
.c-faq__item.is-open{ border-color:var(--accent); }
.c-faq__q{ display:flex; align-items:center; gap:18px; width:100%; text-align:left; padding:22px 26px; background:none; border:0; cursor:pointer; color:var(--ink); }
.c-faq__qmark{ font-family:var(--font-display); font-weight:900; font-size:18px; color:var(--accent-br); line-height:1; flex-shrink:0; }
.c-faq__qtext{ flex:1; font-family:var(--font-jp); font-weight:700; font-size:15px; line-height:1.6; }
.c-faq__toggle{ position:relative; width:18px; height:18px; flex-shrink:0; }
.c-faq__toggle::before, .c-faq__toggle::after{ content:""; position:absolute; background:var(--accent-br); transition:transform .3s var(--ease); }
.c-faq__toggle::before{ left:0; top:8px; width:18px; height:2px; }
.c-faq__toggle::after{ left:8px; top:0; width:2px; height:18px; }
.c-faq__item.is-open .c-faq__toggle::after{ transform:scaleY(0); }
.c-faq__a{ max-height:0; overflow:hidden; transition:max-height .4s var(--ease); }
.c-faq__a-inner{ padding:0 26px 24px 62px; font-size:13.5px; color:var(--ink-mute); line-height:1.95; }

/* ---- MVV ---- */
.c-mvv{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-faint); border:1px solid var(--line-faint); }
.c-mvv__item{ background:var(--bg); padding:38px 32px; }
.l-sub--alt .c-mvv__item{ background:var(--bg-2); }
.c-mvv__tag{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.14em; color:var(--accent-br); text-transform:uppercase; }
.c-mvv__jp{ font-size:11.5px; color:var(--ink-faint); margin-top:4px; }
.c-mvv__text{ font-family:var(--font-jp); font-weight:900; font-size:21px; color:var(--ink); line-height:1.55; margin-top:22px; }
@media (max-width:900px){ .c-mvv{ grid-template-columns:1fr; } }

/* value list */
.c-values{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; margin-top:40px; }
.c-values__item{ display:flex; gap:18px; padding:24px 26px; border:1px solid var(--line-faint); border-radius:3px; background:var(--bg-2); }
.l-sub--alt .c-values__item{ background:var(--bg); }
.c-values__n{ font-family:var(--font-display); font-weight:900; font-size:26px; color:var(--accent-br); line-height:1; flex-shrink:0; }
.c-values__t{ font-family:var(--font-jp); font-weight:700; font-size:15px; color:var(--ink); margin-bottom:8px; }
.c-values__d{ font-size:13px; color:var(--ink-mute); line-height:1.8; }
@media (max-width:768px){ .c-values{ grid-template-columns:1fr; } }

/* ---- Representative message ---- */
.c-message{ display:grid; grid-template-columns:1fr .7fr; gap:56px; align-items:center; }
.c-message__title{ font-family:var(--font-jp); font-weight:900; font-size:clamp(22px,2.6vw,32px); color:var(--ink); line-height:1.5; margin-bottom:30px; }
.c-message__title em{ font-style:normal; color:var(--accent-br); }
.c-message__body{ font-size:14.5px; color:var(--ink-mute); line-height:2.1; }
.c-message__body p{ margin-bottom:18px; }
.c-message__sign{ margin-top:28px; font-family:var(--font-mono); font-size:12.5px; color:var(--ink); letter-spacing:.04em; }
.c-message__sign strong{ display:block; font-family:var(--font-jp); font-weight:700; font-size:16px; margin-top:6px; }
.c-message__photo{ position:relative; aspect-ratio:4/5; border:1px solid var(--line); border-radius:4px; background:linear-gradient(160deg,#0d1019,#070910); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; overflow:hidden; }
body[data-theme="light"] .c-message__photo{ background:linear-gradient(160deg,#e7ebf3,#f4f6fb); }
.c-message__photo > svg{ width:80px; height:80px; color:var(--line-strong); z-index:2; }
.c-message__photo-note{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--ink-faint); z-index:2; }
.c-sphere--msg{ --d:200px; right:-50px; top:-40px; opacity:.85; }
@media (max-width:900px){ .c-message{ grid-template-columns:1fr; gap:40px; } .c-message__photo{ max-width:380px; } }

/* ---- Profile highlights ---- */
.c-profile-hl{ display:flex; flex-direction:column; gap:14px; margin-top:8px; }
.c-profile-hl li{ position:relative; padding-left:26px; font-size:14px; color:var(--ink); line-height:1.7; }
.c-profile-hl li::before{ content:""; position:absolute; left:0; top:9px; width:8px; height:8px; background:var(--accent); }

/* section heading helper for left-aligned sub sections */
.c-heading--mb-md{ margin-bottom:clamp(36px,4vw,56px); }

/* ---- Sub CTA reuse note: pages use existing .c-cta ---- */

/* breadcrumb tick uses fx-tick already */

/* ============================================================
   Additional sub-page components (all pages)
   ============================================================ */

/* 下層ページでは光沢のある暗い球体を非表示（TOPのみ表示） */
.c-sphere{ display:none !important; }

/* ---- Service hub cards ---- */
.c-svc-hub{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line-faint); border:1px solid var(--line-faint); }
.c-svc-hub__card{ position:relative; background:var(--bg); padding:44px 34px 40px; display:flex; flex-direction:column; transition:background .35s; overflow:hidden; }
.l-sub--alt .c-svc-hub__card{ background:var(--bg-2); }
.c-svc-hub__card::before{ content:""; position:absolute; left:0; top:0; width:100%; height:3px; background:var(--accent); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease); }
.c-svc-hub__card:hover::before{ transform:scaleX(1); }
.c-svc-hub__badge{ position:absolute; top:20px; right:20px; font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:.08em; background:var(--accent); color:var(--accent-ink); padding:5px 10px; border-radius:2px; }
.c-svc-hub__num{ font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; color:var(--accent-br); margin-bottom:18px; }
.c-svc-hub__icon{ width:50px; height:50px; color:var(--accent-br); margin-bottom:20px; }
.c-svc-hub__icon svg{ width:100%; height:100%; }
.c-svc-hub__title{ font-family:var(--font-jp); font-weight:900; font-size:24px; color:var(--ink); margin-bottom:12px; }
.c-svc-hub__catch{ font-weight:700; font-size:14px; color:var(--accent-br); margin-bottom:16px; }
.c-svc-hub__body{ font-size:13.5px; color:var(--ink-mute); line-height:2; margin-bottom:28px; flex:1; }
.c-svc-hub__link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; color:var(--ink); }
.c-svc-hub__link svg{ width:16px; height:16px; transition:transform .3s var(--ease); }
.c-svc-hub__card:hover .c-svc-hub__link{ color:var(--accent-br); }
.c-svc-hub__card:hover .c-svc-hub__link svg{ transform:translateX(4px); }
@media (max-width:900px){ .c-svc-hub{ grid-template-columns:1fr; } }

/* ---- Generic feature grid (strength / env / recommend-like) ---- */
.c-feat{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.c-feat--2{ grid-template-columns:repeat(2,1fr); }
.c-feat__item{ padding:32px 30px; border:1px solid var(--line-faint); border-radius:3px; background:var(--bg-2); transition:border-color .3s, transform .3s var(--ease); }
.l-sub--alt .c-feat__item{ background:var(--bg); }
.c-feat__item:hover{ border-color:var(--accent); transform:translateY(-4px); }
.c-feat__n{ font-family:var(--font-display); font-weight:900; font-variation-settings:"wght" 900,"wdth" 90; font-size:32px; color:var(--accent-br); line-height:1; }
.c-feat__icon{ width:42px; height:42px; color:var(--accent-br); margin-bottom:18px; }
.c-feat__icon svg{ width:100%; height:100%; }
.c-feat__head{ display:flex; align-items:center; gap:14px; margin-bottom:16px; }
.c-feat__head .c-feat__icon{ width:40px; height:40px; margin:0; }
.c-feat__head .c-feat__n{ font-size:26px; }
.c-feat__t{ font-family:var(--font-jp); font-weight:700; font-size:17px; color:var(--ink); margin:16px 0 10px; line-height:1.5; }
.c-feat__d{ font-size:13.5px; color:var(--ink-mute); line-height:1.9; }
@media (max-width:900px){ .c-feat,.c-feat--2{ grid-template-columns:1fr; } }

/* ---- Filter chips ---- */
.c-filter{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:40px; }
.c-filter__chip{ font-family:var(--font-mono); font-size:12px; letter-spacing:.04em; padding:9px 18px; border:1px solid var(--line); border-radius:2px; color:var(--ink-mute); background:transparent; cursor:pointer; transition:.25s; }
.c-filter__chip:hover{ border-color:var(--line-strong); color:var(--ink); }
.c-filter__chip[aria-pressed="true"]{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }

/* works/blog grids reuse p-works__grid / p-blog__grid from sections.css */
.c-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.c-grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
@media (max-width:900px){ .c-grid-3{ grid-template-columns:1fr; } }
@media (max-width:768px){ .c-grid-2{ grid-template-columns:1fr; } }

/* ---- Form ---- */
.c-form{ display:flex; flex-direction:column; gap:22px; }
.c-form__row{ display:flex; flex-direction:column; gap:10px; }
.c-form__label{ font-family:var(--font-jp); font-weight:700; font-size:14px; color:var(--ink); display:flex; align-items:center; gap:10px; }
.c-form__req{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; padding:3px 8px; border-radius:2px; background:var(--accent); color:var(--accent-ink); }
.c-form__opt{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; padding:3px 8px; border-radius:2px; border:1px solid var(--line-strong); color:var(--ink-mute); }
.c-form__input, .c-form__textarea, .c-form__select{
  width:100%; background:var(--bg); border:1px solid var(--line); border-radius:3px; color:var(--ink);
  font-family:var(--font-body); font-size:15px; padding:14px 16px; transition:border-color .25s, box-shadow .25s;
}
.l-sub--alt .c-form__input, .l-sub--alt .c-form__textarea, .l-sub--alt .c-form__select{ background:var(--bg-2); }
.c-form__input::placeholder, .c-form__textarea::placeholder{ color:var(--ink-faint); }
.c-form__input:focus, .c-form__textarea:focus, .c-form__select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(var(--accent-rgb),.18); }
.c-form__textarea{ min-height:140px; resize:vertical; line-height:1.8; }
.c-form__grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
@media (max-width:640px){ .c-form__grid{ grid-template-columns:1fr; } }
.c-form__consent{ display:flex; gap:12px; align-items:flex-start; font-size:13px; color:var(--ink-mute); line-height:1.7; }
.c-form__consent input{ margin-top:3px; width:18px; height:18px; accent-color:var(--accent); flex-shrink:0; }
.c-form__consent a{ color:var(--accent-br); text-decoration:underline; }
.c-form__submit{ margin-top:8px; }
.c-form__note{ font-size:12.5px; color:var(--ink-mute); }

/* contact side info / assurances */
.c-contact{ display:grid; grid-template-columns:1.2fr .8fr; gap:56px; align-items:start; }
.c-contact__aside{ position:sticky; top:100px; display:flex; flex-direction:column; gap:24px; }
.c-contact__card{ border:1px solid var(--line); border-radius:4px; padding:30px 28px; background:var(--bg-2); }
.l-sub--alt .c-contact__card{ background:var(--bg); }
.c-contact__card-label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; color:var(--accent-br); text-transform:uppercase; margin-bottom:14px; }
.c-contact__tel{ font-family:var(--font-display); font-weight:900; font-variation-settings:"wght" 900,"wdth" 105; font-size:34px; color:var(--ink); }
.c-contact__tel-note{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-mute); margin-top:6px; }
.c-assure{ display:flex; flex-direction:column; gap:14px; }
.c-assure li{ position:relative; padding-left:26px; font-size:13.5px; color:var(--ink-mute); line-height:1.7; }
.c-assure li::before{ content:""; position:absolute; left:0; top:6px; width:9px; height:9px; border-right:2px solid var(--teal); border-bottom:2px solid var(--teal); transform:rotate(40deg); }
@media (max-width:900px){ .c-contact{ grid-template-columns:1fr; gap:40px; } .c-contact__aside{ position:static; } }

/* thanks state */
.c-thanks{ text-align:center; max-width:620px; margin:0 auto; }
.c-thanks__icon{ width:74px; height:74px; margin:0 auto 28px; border-radius:50%; background:rgba(var(--accent-rgb),.14); display:flex; align-items:center; justify-content:center; }
.c-thanks__icon::after{ content:""; width:20px; height:34px; border-right:4px solid var(--accent-br); border-bottom:4px solid var(--accent-br); transform:rotate(40deg) translateY(-3px); }

/* ---- Steps list (numbered, for flow alt / selection process) ---- */
.c-steplist{ display:flex; flex-direction:column; gap:0; counter-reset:step; }
.c-steplist__item{ display:grid; grid-template-columns:64px 1fr; gap:24px; padding:28px 0; border-bottom:1px solid var(--line-faint); }
.c-steplist__item:last-child{ border-bottom:0; }
.c-steplist__n{ font-family:var(--font-display); font-weight:900; font-variation-settings:"wght" 900,"wdth" 90; font-size:30px; color:var(--accent-br); line-height:1; }
.c-steplist__t{ font-family:var(--font-jp); font-weight:700; font-size:17px; color:var(--ink); margin-bottom:8px; }
.c-steplist__d{ font-size:13.5px; color:var(--ink-mute); line-height:1.9; }

/* ---- Article (blog detail) prose ---- */
.c-article{ max-width:760px; margin:0 auto; }
.c-article__meta{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.c-article__cat{ font-family:var(--font-mono); font-size:11px; background:rgba(var(--accent-rgb),.14); color:var(--accent-br); padding:4px 10px; border-radius:2px; letter-spacing:.04em; }
.c-article__date{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink-faint); }
.c-article__hero{ aspect-ratio:16/8; border:1px solid var(--line-faint); border-radius:4px; background:linear-gradient(150deg,#0e1220,#080a12); display:flex; align-items:center; justify-content:center; margin:34px 0; }
body[data-theme="light"] .c-article__hero{ background:linear-gradient(150deg,#e7ebf3,#f4f6fb); }
.c-article__hero span{ font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); }
.c-prose{ font-size:15.5px; line-height:2.05; color:var(--ink-mute); }
.c-prose > * + *{ margin-top:22px; }
.c-prose h2{ font-family:var(--font-jp); font-weight:900; font-size:25px; color:var(--ink); margin-top:50px; padding-left:18px; border-left:4px solid var(--accent); line-height:1.5; }
.c-prose h3{ font-family:var(--font-jp); font-weight:700; font-size:19px; color:var(--ink); margin-top:36px; }
.c-prose p{ text-wrap:pretty; }
.c-prose strong{ color:var(--ink); font-weight:700; }
.c-prose ul{ display:flex; flex-direction:column; gap:12px; padding-left:4px; }
.c-prose ul li{ position:relative; padding-left:24px; }
.c-prose ul li::before{ content:""; position:absolute; left:0; top:11px; width:8px; height:8px; background:var(--accent); }
.c-prose blockquote{ border-left:2px solid var(--accent); padding:6px 0 6px 22px; color:var(--ink); font-family:var(--font-jp); }

/* table of contents */
.c-toc{ border:1px solid var(--line); border-radius:4px; padding:26px 28px; background:var(--bg-2); margin:34px 0; }
body[data-theme="light"] .c-toc{ background:var(--bg-2); }
.c-toc__label{ font-family:var(--font-mono); font-size:11px; letter-spacing:.12em; color:var(--accent-br); text-transform:uppercase; margin-bottom:16px; }
.c-toc ol{ display:flex; flex-direction:column; gap:10px; counter-reset:toc; }
.c-toc li{ counter-increment:toc; position:relative; padding-left:32px; font-size:14px; }
.c-toc li::before{ content:counter(toc,decimal-leading-zero); position:absolute; left:0; top:0; font-family:var(--font-mono); font-size:12px; color:var(--accent-br); }
.c-toc a{ color:var(--ink-mute); transition:color .2s; }
.c-toc a:hover{ color:var(--accent-br); }

/* author / share */
.c-author{ display:flex; align-items:center; gap:16px; margin-top:48px; padding-top:32px; border-top:1px solid var(--line-faint); }
.c-author__av{ width:54px; height:54px; border-radius:50%; background:var(--accent); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; font-family:var(--font-display); font-weight:800; font-size:20px; flex-shrink:0; }
.c-author__name{ font-weight:700; font-size:14px; color:var(--ink); }
.c-author__role{ font-size:12.5px; color:var(--ink-mute); margin-top:3px; }

/* ---- Recruit: member cards ---- */
.c-member{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.c-member__card{ border:1px solid var(--line-faint); border-radius:4px; overflow:hidden; background:var(--bg-2); transition:border-color .35s, transform .35s var(--ease); }
.l-sub--alt .c-member__card{ background:var(--bg); }
.c-member__card:hover{ border-color:var(--accent); transform:translateY(-4px); }
.c-member__photo{ aspect-ratio:4/3; background:linear-gradient(150deg,#0e1220,#080a12); display:flex; align-items:center; justify-content:center; }
body[data-theme="light"] .c-member__photo{ background:linear-gradient(150deg,#e7ebf3,#f4f6fb); }
.c-member__photo svg{ width:56px; height:56px; color:var(--line-strong); }
.c-member__body{ padding:24px 26px 28px; }
.c-member__role{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; color:var(--accent-br); }
.c-member__name{ font-family:var(--font-jp); font-weight:700; font-size:17px; color:var(--ink); margin:8px 0 14px; }
.c-member__quote{ font-size:13.5px; color:var(--ink-mute); line-height:1.9; }
@media (max-width:900px){ .c-member{ grid-template-columns:1fr; } }

/* job cards */
.c-jobs{ display:flex; flex-direction:column; gap:14px; }
.c-job{ display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; padding:26px 30px; border:1px solid var(--line-faint); border-radius:3px; background:var(--bg-2); transition:border-color .3s, transform .3s var(--ease); }
.l-sub--alt .c-job{ background:var(--bg); }
.c-job:hover{ border-color:var(--accent); transform:translateX(6px); }
.c-job__tags{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.c-job__tag{ font-family:var(--font-mono); font-size:10.5px; padding:3px 9px; border:1px solid var(--line); border-radius:2px; color:var(--ink-mute); }
.c-job__title{ font-family:var(--font-jp); font-weight:700; font-size:18px; color:var(--ink); }
.c-job__desc{ font-size:13px; color:var(--ink-mute); margin-top:8px; line-height:1.7; }
.c-job__arrow{ width:44px; height:44px; border-radius:50%; border:1px solid var(--line-strong); display:flex; align-items:center; justify-content:center; color:var(--ink); transition:.3s; flex-shrink:0; }
.c-job:hover .c-job__arrow{ background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
.c-job__arrow svg{ width:18px; height:18px; }
@media (max-width:640px){ .c-job{ grid-template-columns:1fr; } }

/* big mission band (recruit FV alt copy) */
.c-band{ position:relative; text-align:center; padding:clamp(48px,6vw,80px) 0; }
.c-band__text{ font-family:var(--font-jp); font-weight:900; font-size:clamp(24px,3.4vw,40px); line-height:1.6; color:var(--ink); max-width:24ch; margin:0 auto; text-wrap:balance; }
.c-band__text em{ font-style:normal; color:var(--accent-br); }

/* ---- LP specifics ---- */
.lp-sticky{ position:fixed; left:0; bottom:0; width:100%; z-index:80; background:rgba(12,15,24,.9); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px); border-top:1px solid var(--line-strong); transform:translateY(100%); transition:transform .4s var(--ease); }
body[data-theme="light"] .lp-sticky{ background:rgba(245,246,250,.92); }
.lp-sticky.is-visible{ transform:translateY(0); }
.lp-sticky__inner{ max-width:var(--maxw); margin:0 auto; padding:14px var(--pad); display:flex; align-items:center; justify-content:space-between; gap:20px; }
.lp-sticky__txt{ font-family:var(--font-jp); font-weight:700; font-size:15px; color:var(--ink); }
.lp-sticky__txt span{ color:var(--accent-br); }
.lp-sticky__btns{ display:flex; gap:12px; }
@media (max-width:768px){ .lp-sticky__txt{ display:none; } .lp-sticky__btns{ width:100%; } .lp-sticky__btns .c-button{ flex:1; justify-content:center; } }

/* ---- Wave flow (制作フロー: 波形タイムライン) ---- */
.c-wave{ position:relative; padding:30px 0 10px; }
.c-wave__bg{ position:absolute; left:0; right:0; top:56px; width:100%; height:200px; z-index:0; pointer-events:none; }
.c-wave__bg svg{ width:100%; height:100%; }
.c-wave__bg path{ stroke:var(--accent); stroke-width:2; fill:none; opacity:.5; stroke-dasharray:5 7; }
.c-wave__track{ position:relative; z-index:1; display:grid; grid-template-columns:repeat(6,1fr); gap:14px; align-items:start; }
.c-wave__step{ text-align:center; }
.c-wave__step:nth-child(even){ margin-top:150px; }
.c-wave__node{ position:relative; width:74px; height:74px; border-radius:50%; margin:0 auto 18px; display:flex; align-items:center; justify-content:center; background:var(--bg); border:1px solid var(--line-strong); transition:.3s var(--ease); }
.l-sub--alt .c-wave__node{ background:var(--bg-2); }
.c-wave__step:hover .c-wave__node{ background:var(--accent); border-color:var(--accent); transform:translateY(-4px); box-shadow:0 12px 30px rgba(var(--accent-rgb),.3); }
.c-wave__node svg{ width:32px; height:32px; color:var(--accent-br); transition:.3s; }
.c-wave__step:hover .c-wave__node svg{ color:var(--accent-ink); }
.c-wave__num{ position:absolute; top:-6px; right:-6px; width:28px; height:28px; border-radius:50%; background:var(--accent); color:var(--accent-ink); font-family:var(--font-display); font-weight:800; font-size:13px; display:flex; align-items:center; justify-content:center; border:2px solid var(--bg); }
.l-sub--alt .c-wave__num{ border-color:var(--bg-2); }
.c-wave__period{ display:inline-block; font-family:var(--font-mono); font-size:10.5px; color:var(--accent-br); border:1px solid var(--line); padding:3px 9px; border-radius:2px; margin-bottom:12px; }
.c-wave__t{ font-family:var(--font-jp); font-weight:700; font-size:15px; color:var(--ink); margin-bottom:14px; line-height:1.45; }
.c-wave__d{ font-size:12px; color:var(--ink-mute); line-height:1.7; text-align:left; }
.c-wave__d b{ display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.06em; color:var(--accent-br); text-transform:uppercase; margin:9px 0 2px; font-weight:700; }
.c-wave--7 .c-wave__track{ grid-template-columns:repeat(7,1fr); }
@media (max-width:900px){
  .c-wave__bg{ display:none; }
  .c-wave__track, .c-wave--7 .c-wave__track{ grid-template-columns:1fr; gap:0; }
  .c-wave__step{ text-align:left; display:grid; grid-template-columns:74px 1fr; gap:20px; padding-bottom:30px; position:relative; }
  .c-wave__step:nth-child(even){ margin-top:0; }
  .c-wave__step::before{ content:""; position:absolute; left:37px; top:74px; bottom:0; width:2px; background:var(--accent); opacity:.4; }
  .c-wave__step:last-child::before{ display:none; }
  .c-wave__node{ margin:0; }
  .c-wave__period{ margin-top:2px; }
  .c-wave__d{ text-align:left; }
}

/* privacy prose */
.c-legal{ max-width:820px; margin:0 auto; font-size:14.5px; line-height:2; color:var(--ink-mute); }
.c-legal h2{ font-family:var(--font-jp); font-weight:700; font-size:19px; color:var(--ink); margin:44px 0 16px; padding-left:16px; border-left:3px solid var(--accent); }
.c-legal p{ margin-bottom:16px; }
.c-legal ul{ display:flex; flex-direction:column; gap:10px; margin:0 0 16px; padding-left:4px; }
.c-legal ul li{ position:relative; padding-left:22px; }
.c-legal ul li::before{ content:""; position:absolute; left:0; top:11px; width:7px; height:7px; background:var(--accent); }
.c-legal__updated{ font-family:var(--font-mono); font-size:12px; color:var(--ink-faint); margin-bottom:8px; }