/* ============================================================
   CONSULT（相談レイヤー）専用スタイル
   ベース：ブランドサイトと同じ黒系
   配色：提案用PowerPoint「パターンD」に準拠
     シアン #0AD3E8 ／ ブルー #1E74E0 ／ パープル #7A3FD4
     ダーク #141822 ／ 明サブ #C5CCD8 ／ 微サブ #8A92A0
   構造：luxurycard.co.jp/business の情報設計を参考
============================================================ */
:root{
  --cyan:#0AD3E8;
  --blue:#1E74E0;
  --purple:#7A3FD4;
  --violet:#5B4FDC;
  --sky:#2AA8E6;
  --ink-cool:#141822;      /* PowerPointのダーク */
  --ink-cool-2:#11141A;
  --sub-light:#C5CCD8;
  --sub-mid:#8A92A0;
  --sub-dim:#B6BCC6;
  --grad: linear-gradient(90deg, var(--cyan) 0%, var(--blue) 50%, var(--purple) 100%);
}

/* 相談レイヤーは寒色寄りのダークで、ブランドサイトとの層の違いを示す */
body.consult{ background:var(--ink-cool); }
.consult section{ padding:12vh 0; }
.consult header{ background:rgba(17,20,26,.94); border-bottom:1px solid rgba(255,255,255,.12); }
.consult nav a.nav-cta{ background:var(--cyan); color:#0b1016; box-shadow:0 6px 20px rgba(10,211,232,.28); }
.consult nav a.nav-cta:hover{ opacity:.88; color:#0b1016; }
.consult .sticky-cta{ background:var(--cyan); color:#0b1016; }

/* グラデーションの細いライン（PowerPointの見出し装飾に対応） */
.grad-line{ height:3px; width:88px; background:var(--grad); border-radius:2px; margin-bottom:1.6rem; }

/* ============================================================
   日本語の改行制御
   .nb で囲んだ「文節」は途中で割れない。折り返しは文節と文節の間だけ。
============================================================ */
.nb{ display:inline-block; }

/* HERO */
.c-hero{
  position:relative; padding:24vh 0 10vh;
  background:
    radial-gradient(1100px 520px at 88% -12%, rgba(10,211,232,.20), transparent 60%),
    radial-gradient(900px 480px at 8% 8%, rgba(122,63,212,.22), transparent 62%),
    linear-gradient(180deg, #11141A 0%, #141822 100%);
  border-bottom:1px solid rgba(255,255,255,.1);
  overflow:hidden;
}
.c-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--grad); opacity:.85; }
.c-eyebrow{ font-family:var(--font-display); font-weight:700; font-size:.82rem; letter-spacing:.2em; color:var(--cyan); margin-bottom:1.2rem; }
.c-hero h1{ font-weight:700; font-size:clamp(1.9rem,4vw,3.1rem); line-height:1.45; letter-spacing:.01em; margin-bottom:2rem; color:#fff; }
.c-hero h1 em{ font-style:normal; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
.c-hero .c-lead{ color:#D8DFE8; font-size:1.08rem; line-height:2.1; max-width:44em; margin-bottom:2.4rem; }
/* 「詰まり」の定義（初出のみ強調し、以降は説明なしで使う） */
.def-term{
  display:block; color:#fff; font-weight:700; font-size:1.06rem; line-height:2.0;
  border-left:3px solid var(--cyan); padding:.9rem 0 .9rem 1.2rem;
  margin-bottom:1.4rem; background:linear-gradient(90deg, rgba(10,211,232,.10), transparent 70%);
}
.def-term a{ color:var(--cyan); text-decoration:underline; text-underline-offset:.25em; text-decoration-thickness:1px; }
.def-term a:hover{ opacity:.8; }

/* キーワードのチップ列 */
.chips{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom:2.6rem; }
.chips span{
  font-size:.83rem; font-weight:700; letter-spacing:.03em; color:var(--sub-light);
  border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.04);
  padding:.5rem 1.05rem; border-radius:999px;
}
.chips span::before{ content:"#"; color:var(--cyan); margin-right:.35rem; }

/* CTA（パターンD配色） */
.btn-cyan{ background:var(--cyan); color:#0b1016; box-shadow:0 10px 30px rgba(10,211,232,.28); }
.btn-cyan:hover{ opacity:.9; transform:translateY(-2px); color:#0b1016; }
.btn-line{ border:1px solid rgba(255,255,255,.5); color:#fff; }
.btn-line:hover{ background:rgba(255,255,255,.1); }
.c-note{ font-size:.84rem; color:var(--sub-mid); margin-top:1.1rem; }

/* ヒーローの写真コラージュ（参考サイトの写真グリッドに対応） */
.c-hero-inner{ display:grid; grid-template-columns:1.15fr .85fr; gap:4.5vw; align-items:center; }
.hero-collage{ display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem; }
.hero-collage img{
  width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:4px;
  border:1px solid rgba(255,255,255,.12);
}
.hero-collage img:nth-child(2){ margin-top:1.6rem; }
.hero-collage img:nth-child(3){ margin-top:3.2rem; }
.hero-collage img:nth-child(5){ margin-top:1.6rem; }
.hero-collage img:nth-child(6){ margin-top:3.2rem; }
@media(max-width:980px){
  .c-hero-inner{ grid-template-columns:1fr; gap:3rem; }
  .hero-collage img:nth-child(n){ margin-top:0; }
  .hero-collage img{ aspect-ratio:1/1; }
}

/* ワイドの写真帯 */
.photo-band{ position:relative; height:38vh; min-height:230px; overflow:hidden; }
.photo-band img{ width:100%; height:100%; object-fit:cover; }
.photo-band::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(20,24,34,.55) 0%, rgba(20,24,34,.85) 100%);
}
.photo-band .band-copy{
  position:absolute; inset:0; display:flex; align-items:center; z-index:2;
}
.photo-band .band-copy p{
  max-width:var(--maxw); margin:0 auto; padding:0 7vw; width:100%;
  font-weight:700; font-size:clamp(1.1rem,2.4vw,1.7rem); line-height:1.7; color:#fff;
  text-shadow:0 2px 14px rgba(0,0,0,.6);
}

/* セクション見出し */
.c-sec-num{ font-family:var(--font-display); font-weight:700; font-size:.86rem; letter-spacing:.2em; margin-bottom:.9rem; }
.c-sec-num.cy{ color:var(--cyan); } .c-sec-num.bl{ color:var(--blue); } .c-sec-num.pu{ color:var(--purple); }
.c-sec-head{ font-weight:700; font-size:clamp(1.6rem,3.4vw,2.5rem); line-height:1.5; letter-spacing:.02em; margin-bottom:1.1rem; color:#fff; }
.c-sec-sub{ color:var(--sub-light); max-width:42em; font-size:.99rem; line-height:1.95; margin-bottom:3rem; }

/* 01 ご相談いただく方 */
.t-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.t-card{
  display:block; position:relative; background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.14); border-radius:6px; padding:2.2rem 1.8rem 2rem;
  transition:transform .3s, border-color .3s, background .3s; overflow:hidden;
}
.t-card::before{ content:""; position:absolute; left:0; top:0; width:100%; height:3px; background:var(--c,var(--cyan)); opacity:.9; }
.t-card:hover{ transform:translateY(-4px); border-color:rgba(255,255,255,.3); background:rgba(255,255,255,.06); }
.t-card .t-en{ font-family:var(--font-display); font-size:.68rem; letter-spacing:.16em; color:var(--c,var(--cyan)); margin-bottom:.9rem; font-weight:700; }
.t-card h3{ font-size:1.1rem; font-weight:700; line-height:1.55; margin-bottom:.8rem; color:#fff; }
.t-card p{ font-size:.88rem; color:var(--sub-light); line-height:1.85; }
.t-card .t-go{ margin-top:1.2rem; font-size:.82rem; font-weight:700; color:var(--c,var(--cyan)); }
.t-card .t-go::after{ content:" →"; }
@media(max-width:900px){ .t-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:560px){ .t-grid{ grid-template-columns:1fr; } }

/* 02 こんなケース */
.k-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.3rem; }
.k-card{
  display:block; background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.14);
  border-radius:6px; padding:2.1rem 2rem 1.8rem; transition:transform .3s,border-color .3s,background .3s;
}
.k-card:hover{ transform:translateY(-4px); border-color:var(--c,var(--cyan)); background:rgba(255,255,255,.07); }
.k-card{ padding:0; overflow:hidden; }
.k-thumb{ position:relative; aspect-ratio:16/9; overflow:hidden; }
.k-thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.k-card:hover .k-thumb img{ transform:scale(1.05); }
.k-thumb::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,24,34,.15) 0%, rgba(20,24,34,.75) 100%); }
.k-body{ padding:1.7rem 1.9rem 1.7rem; }
.k-card .k-tag{
  display:inline-block; font-family:var(--font-display); font-size:.66rem; font-weight:700; letter-spacing:.14em;
  color:#0b1016; background:var(--c,var(--cyan)); padding:.24rem .7rem; border-radius:2px; margin-bottom:1.1rem;
  position:absolute; left:1.1rem; bottom:1.1rem; z-index:2;
}
.k-card h3{ font-size:1.13rem; font-weight:700; line-height:1.7; margin-bottom:.9rem; color:#fff; }
.k-card h3 .qm{ color:var(--c,var(--cyan)); }
.k-card p{ font-size:.9rem; color:var(--sub-light); line-height:1.85; margin-bottom:1.3rem; }
.k-card .k-more{ font-size:.84rem; font-weight:700; color:var(--c,var(--cyan)); }
.k-card .k-more::after{ content:" →"; }
@media(max-width:760px){ .k-grid{ grid-template-columns:1fr; } }

/* 03 ご相談の流れ */
.flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.2rem; counter-reset:fl; }
.flow-item{ position:relative; background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.14); border-radius:6px; padding:2rem 1.6rem; }
.flow-item::before{
  counter-increment:fl; content:"STEP 0" counter(fl);
  font-family:var(--font-display); font-size:.68rem; font-weight:700; letter-spacing:.14em;
  color:var(--c,var(--cyan)); display:block; margin-bottom:.9rem;
}
.flow-item h3{ font-size:1.02rem; font-weight:700; margin-bottom:.7rem; color:#fff; line-height:1.55; }
.flow-item p{ font-size:.86rem; color:var(--sub-light); line-height:1.85; }
@media(max-width:900px){ .flow{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:520px){ .flow{ grid-template-columns:1fr; } }

/* 7STEP 帯 */
.step-strip{ display:flex; flex-wrap:wrap; align-items:center; gap:.4rem 0; margin:1.8rem 0 2.2rem; padding:1.6rem 0; border-top:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); }
.step-strip b{ font-family:var(--font-display); font-weight:700; font-size:clamp(.8rem,1.5vw,1rem); letter-spacing:.05em; color:#fff; }
.step-strip i{ font-style:normal; padding:0 .65rem; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:700; }

/* FAQ */
.faq{ max-width:48em; border-top:1px solid rgba(255,255,255,.14); }
.faq details{ border-bottom:1px solid rgba(255,255,255,.14); }
.faq summary{ cursor:pointer; list-style:none; padding:1.5rem 2.5rem 1.5rem 2.6rem; position:relative; font-weight:700; color:#fff; font-size:1rem; line-height:1.7; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::before{ content:"Q"; position:absolute; left:0; top:1.5rem; font-family:var(--font-display); font-weight:700; color:var(--cyan); }
.faq summary::after{ content:"＋"; position:absolute; right:.4rem; top:1.5rem; color:var(--cyan); transition:transform .3s; }
.faq details[open] summary::after{ content:"−"; }
.faq .a{ padding:0 1rem 1.7rem 2.6rem; color:var(--sub-light); font-size:.94rem; line-height:1.95; position:relative; }
.faq .a::before{ content:"A"; position:absolute; left:0; top:0; font-family:var(--font-display); font-weight:700; color:var(--purple); }

/* 最終CTA（参考サイトの「まずはお気軽にお問い合わせください」に対応） */
.final-cta{
  position:relative;
  background:
    linear-gradient(180deg, rgba(17,20,26,.90) 0%, rgba(17,20,26,.94) 100%),
    radial-gradient(760px 380px at 12% 0%, rgba(10,211,232,.20), transparent 60%),
    radial-gradient(760px 380px at 88% 100%, rgba(122,63,212,.24), transparent 62%),
    url('../images/c-band-cta.jpg') center/cover no-repeat,
    var(--ink-cool-2);
  border-top:1px solid rgba(255,255,255,.12);
}
.final-cta h2{ font-weight:700; font-size:clamp(1.5rem,3.2vw,2.3rem); line-height:1.55; margin-bottom:1.1rem; color:#fff; }
.final-cta p{ color:var(--sub-light); max-width:40em; margin-bottom:2rem; }
.ask-list{ list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem 2rem; max-width:46em; margin-bottom:2.6rem; }
.ask-list li{ position:relative; padding-left:1.8rem; color:var(--sub-light); font-size:.95rem; line-height:1.8; }
.ask-list li::before{ content:"✓"; position:absolute; left:0; color:var(--cyan); font-weight:700; }
@media(max-width:640px){ .ask-list{ grid-template-columns:1fr; } }

/* フッターも寒色に寄せる */
.consult footer{ background:var(--ink-cool-2); }