/* ===========================
   COZEO Corporate page — 法人窓口
   依存: cozeo-common.css のみ
   方針: cozeo-about と同じエディトリアル基調（navy + gold accent + sky tint + 章節序号）
         ただし B2B 提案ページとして密度・CTA を強める
   =========================== */

.corp{
  font-family:var(--font-jp);color:var(--text);
  overflow-x:hidden;
}
.corp *,
.corp *::before,
.corp *::after{box-sizing:border-box;}

/* ===========================
   HERO
   =========================== */
.corp-hero{
  background:linear-gradient(180deg, #f5f9ff 0%, #fafcff 60%, #ffffff 100%);
  position:relative;overflow:hidden;
  padding:120px 0 140px;
}
.corp-hero .bg{
  position:absolute;inset:0;z-index:0;
  background-position:center 35%;background-size:cover;background-repeat:no-repeat;
  opacity:.55;
  filter:saturate(1.08) contrast(1.05) brightness(1.04);
}
.corp-hero .bg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(95deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.7) 28%, rgba(255,255,255,.32) 55%, rgba(255,255,255,.05) 80%, transparent 100%),
    linear-gradient(180deg, rgba(255,255,255,.18) 0%, transparent 12%, transparent 80%, rgba(255,255,255,.85) 100%);
}
.corp-hero::before{
  content:"";position:absolute;z-index:1;pointer-events:none;
  top:-120px;right:-80px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle, rgba(245,184,31,.22) 0%, transparent 65%);
}
.corp-hero::after{
  content:"";position:absolute;z-index:1;pointer-events:none;
  bottom:-160px;left:-80px;width:560px;height:560px;border-radius:50%;
  background:radial-gradient(circle, rgba(25,118,237,.14) 0%, transparent 70%);
}
.corp-hero-inner{
  position:relative;z-index:2;
  max-width:1180px;margin:0 auto;padding:0 48px;
}
.corp-hero .eyebrow{
  font-family:var(--font-en);font-size:11px;font-weight:700;
  color:var(--gold-deep);letter-spacing:.4em;
  display:inline-flex;align-items:center;gap:14px;margin-bottom:36px;
}
.corp-hero .eyebrow::after{content:"";width:42px;height:1px;background:var(--gold-deep);}
.corp-hero h1{
  font-size:clamp(34px, 5.2vw, 60px);font-weight:900;
  color:var(--navy);letter-spacing:-.015em;line-height:1.35;
  margin-bottom:36px;max-width:920px;
  text-shadow:0 1px 0 rgba(255,255,255,.5);
}
.corp-hero h1 .accent{color:var(--gold-deep);}
.corp-hero .rule{display:block;width:48px;height:3px;background:var(--gold);margin-bottom:28px;}
.corp-hero p.lead{
  font-size:14.5px;color:var(--text-sub);line-height:2.1;
  max-width:580px;letter-spacing:.02em;margin-bottom:36px;
}
.corp-hero p.lead strong{color:var(--navy);font-weight:700;}
.corp-hero .hero-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:16px 32px;border-radius:99px;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:var(--navy-deep);font-size:13.5px;font-weight:800;letter-spacing:.06em;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(245,184,31,.3);
  transition:transform .25s ease, box-shadow .25s ease;
}
.corp-hero .hero-cta:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 36px rgba(245,184,31,.42);
}
.corp-hero .hero-cta svg{width:18px;height:14px;transition:transform .25s ease;}
.corp-hero .hero-cta:hover svg{transform:translateX(4px);}

/* ===========================
   CHAP（章節）共通スカフォールド — about と同じ語彙
   =========================== */
.corp .chap{padding:96px 0;position:relative;}
.corp .chap-inner{max-width:1180px;margin:0 auto;padding:0 48px;position:relative;}
.corp .chap-01{background:#fff;}
.corp .chap-02{background:var(--bg);}
.corp .chap-03{background:#fff;}

/* ===========================
   見出し共通（eyebrow + sec-title）
   =========================== */
.corp .eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  font-family:var(--font-en);font-size:11px;font-weight:700;
  color:var(--blue);letter-spacing:.32em;margin-bottom:18px;
}
.corp .eyebrow::before{content:"";width:24px;height:1px;background:var(--blue);}
.corp .sec-title{
  font-size:clamp(28px, 3.6vw, 40px);font-weight:900;
  color:var(--navy);letter-spacing:-.015em;line-height:1.4;
  margin-bottom:20px;
}
.corp .sec-title .accent{color:var(--gold-deep);}

/* ===========================
   FEATURE ROW（図文交替の基本ユニット）
   =========================== */
.corp .feature-row{
  display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;
  margin-bottom:120px;
}
.corp .feature-row:last-child{margin-bottom:0;}
.corp .feature-row-reverse .feature-text{order:2;}
.corp .feature-row-reverse .feature-figure{order:1;}

.corp .feature-text{min-width:0;max-width:540px;}
.corp .feature-row-reverse .feature-text{margin-left:auto;}
.corp .feature-text h3{
  font-size:clamp(22px, 2.4vw, 28px);font-weight:900;
  color:var(--navy);letter-spacing:-.01em;line-height:1.45;
  margin-bottom:18px;
}
.corp .feature-text p{
  font-size:14.5px;color:var(--text-sub);line-height:2.05;
  letter-spacing:.02em;margin-bottom:22px;
}
.corp .feature-text p:last-of-type{margin-bottom:24px;}
.corp .feature-text p strong{color:var(--navy);font-weight:700;}

.corp .feature-text .keywords{
  display:flex;flex-wrap:wrap;gap:6px;
}
.corp .feature-text .keywords span{
  font-family:var(--font-en);font-size:10.5px;font-weight:700;
  color:var(--blue);letter-spacing:.18em;
  padding:5px 12px;background:rgba(25,118,237,.06);border-radius:99px;
}

/* FIGURE — 写真ブロック */
.corp .feature-figure{
  position:relative;margin:0;
  border-radius:18px;overflow:hidden;
  aspect-ratio:4/3;background:var(--bg);
  box-shadow:0 20px 50px rgba(30,42,82,.08);
}
.corp .feature-figure img{
  width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.95) contrast(1.04);
  transition:transform .6s ease;
}
.corp .feature-row:hover .feature-figure img{transform:scale(1.03);}
.corp .feature-figure::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(135deg, rgba(25,118,237,.08) 0%, transparent 60%);
  pointer-events:none;
}

/* ===========================
   SOLUTIONS / INQUIRY イントロ
   =========================== */
.corp .solutions-intro{
  text-align:center;max-width:720px;margin:0 auto 72px;
}
.corp .solutions-intro .eyebrow{display:inline-flex;}
.corp .solutions-intro p{
  font-size:13.5px;color:var(--text-sub);line-height:2;
  letter-spacing:.02em;max-width:560px;margin:0 auto;
}

/* ===========================
   共通: CTA エディオール（btn-gold / cta-headline 等）
   =========================== */
.corp .cta-eyebrow{
  position:relative;z-index:1;
  font-family:var(--font-en);font-size:11px;font-weight:700;
  color:var(--blue);letter-spacing:.32em;
  display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;
}
.corp .cta-eyebrow::before,
.corp .cta-eyebrow::after{content:"";width:24px;height:1px;background:var(--blue);}
.corp .cta-headline{
  position:relative;z-index:1;
  font-family:var(--font-jp);
  font-size:clamp(26px, 3.6vw, 40px);font-weight:900;
  color:var(--navy);letter-spacing:-.015em;line-height:1.45;
  display:flex;flex-direction:column;gap:6px;
  margin-bottom:22px;text-align:center;
}
.corp .cta-headline .accent{color:var(--blue);}
.corp .cta-lead{
  position:relative;z-index:1;
  font-size:13.5px;color:var(--text-sub);line-height:1.95;
  letter-spacing:.02em;max-width:580px;margin:0 auto 32px;text-align:center;
}
.corp .cta-row{
  position:relative;z-index:1;
  display:inline-flex;align-items:center;gap:24px;flex-wrap:wrap;
  justify-content:center;
}
.corp .btn-gold{
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:15px 30px;border-radius:99px;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  color:var(--navy-deep);font-size:13.5px;font-weight:800;letter-spacing:.06em;
  text-decoration:none;border:none;cursor:pointer;font-family:inherit;
  box-shadow:0 10px 22px rgba(245,184,31,.28);
  transition:transform .25s ease, box-shadow .25s ease;
  min-width:240px;
}
.corp .btn-gold:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(245,184,31,.4);
}
.corp .btn-gold svg{width:18px;height:14px;transition:transform .25s ease;}
.corp .btn-gold:hover svg{transform:translateX(4px);}

/* ===========================
   03 INQUIRY FORM
   =========================== */
.corp .form-card{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:18px;
  padding:48px 48px;
  position:relative;overflow:hidden;
}
.corp .form-card::before{
  content:"";position:absolute;top:-140px;right:-140px;width:380px;height:380px;border-radius:50%;
  background:radial-gradient(circle, rgba(245,184,31,.08) 0%, transparent 70%);pointer-events:none;
}

.corp .corp-form{position:relative;z-index:1;}
.corp .form-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:24px 32px;
  margin-bottom:32px;
}
.corp .form-row{
  display:flex;flex-direction:column;gap:8px;min-width:0;
}
.corp .form-row-full{grid-column:1 / -1;}

.corp .form-label{
  font-size:13px;font-weight:700;color:var(--navy);
  letter-spacing:.04em;line-height:1.5;
  display:flex;align-items:center;gap:8px;
}
.corp .form-label .req{
  background:var(--red);color:#fff;font-size:9px;font-weight:800;
  padding:2px 6px;border-radius:3px;letter-spacing:.05em;
  font-family:var(--font-en);line-height:1.3;display:inline-block;
}
.corp .form-label .opt{
  background:var(--bg-soft);color:var(--text-sub);font-size:9px;font-weight:800;
  padding:2px 6px;border-radius:3px;letter-spacing:.05em;
  font-family:var(--font-en);line-height:1.3;display:inline-block;
}

.corp .form-input,
.corp .form-select,
.corp .form-textarea{
  width:100%;font-family:var(--font-jp);font-size:14px;
  color:var(--navy);background:#fff;
  border:1px solid var(--line);border-radius:10px;
  padding:13px 16px;line-height:1.5;
  transition:border-color .15s, box-shadow .15s;
}
.corp .form-textarea{
  min-height:140px;resize:vertical;
  font-family:var(--font-jp);line-height:1.85;
}
.corp .form-input::placeholder,
.corp .form-textarea::placeholder{color:var(--text-mute);}
.corp .form-input:focus,
.corp .form-select:focus,
.corp .form-textarea:focus{
  outline:none;border-color:var(--blue);
  box-shadow:0 0 0 3px rgba(25,118,237,.12);
}
.corp .form-select{
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%231e2a52' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='1 1.5 6 6.5 11 1.5'/></svg>");
  background-repeat:no-repeat;background-position:right 16px center;
  padding-right:42px;cursor:pointer;
}

/* エラー表示（EC-CUBE は Bootstrap form theme） */
.corp .form-input.is-invalid,
.corp .form-select.is-invalid,
.corp .form-textarea.is-invalid{
  border-color:#d33;
  box-shadow:0 0 0 3px rgba(211,51,51,.08);
}
.corp .invalid-feedback,
.corp .invalid-feedback.d-block{
  display:block;
  font-size:12px;color:#d33;letter-spacing:.02em;line-height:1.5;
  margin-top:2px;
}
.corp .form-row ul{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:3px;
}
.corp .form-row ul li{
  font-size:12px;color:#d33;letter-spacing:.02em;line-height:1.5;
}

/* 送信エリア — 縦並びの中央寄せ（privacy 上、ボタン下） */
.corp .form-submit{
  display:flex;flex-direction:column;align-items:center;
  gap:20px;
  padding-top:32px;margin-top:8px;
  border-top:1px solid var(--line);
}
.corp .privacy-note{
  font-size:12.5px;color:var(--text-sub);line-height:1.8;
  letter-spacing:.02em;margin:0;text-align:center;
  max-width:520px;
}
.corp .privacy-note a{
  color:var(--navy);font-weight:700;
  text-decoration:underline;text-decoration-color:var(--blue);
  text-underline-offset:3px;text-decoration-thickness:1px;
  transition:color .15s, text-decoration-color .15s;
}
.corp .privacy-note a:hover{color:var(--blue);text-decoration-color:var(--blue);}

/* 送信ボタン — submit 専用、navy グラデ + 視覚的に重い */
.corp .btn-submit{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:14px;
  padding:18px 56px;border-radius:99px;border:none;cursor:pointer;
  background:linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color:#fff;font-size:15px;font-weight:800;letter-spacing:.06em;
  font-family:inherit;
  box-shadow:
    0 14px 32px rgba(30,42,82,.28),
    inset 0 1px 0 rgba(255,255,255,.12);
  transition:transform .25s ease, box-shadow .25s ease;
  min-width:280px;
}
.corp .btn-submit::before{
  content:"";position:absolute;inset:0;border-radius:99px;
  background:linear-gradient(135deg, var(--gold) 0%, var(--gold-deep) 100%);
  opacity:0;transition:opacity .35s ease;z-index:0;
}
.corp .btn-submit > *{position:relative;z-index:1;}
.corp .btn-submit:hover{
  transform:translateY(-2px);
  box-shadow:
    0 20px 44px rgba(30,42,82,.36),
    inset 0 1px 0 rgba(255,255,255,.18);
}
.corp .btn-submit:hover::before{opacity:1;}
.corp .btn-submit:hover{color:var(--navy-deep);}
.corp .btn-submit svg{
  width:20px;height:16px;transition:transform .25s ease;
}
.corp .btn-submit:hover svg{transform:translateX(5px);}
.corp .btn-submit:active{transform:translateY(0);}

/* アンカースクロール時、header に隠れないよう offset を確保 */
.corp #inquiry{scroll-margin-top:80px;}

/* ===========================
   COMPLETE 画面
   =========================== */
.corp .corp-complete{
  background:linear-gradient(180deg, #f5f9ff 0%, #fafcff 60%, #ffffff 100%);
  padding:120px 0 140px;position:relative;overflow:hidden;
}
.corp .corp-complete::before{
  content:"";position:absolute;top:-160px;right:-100px;width:480px;height:480px;border-radius:50%;
  background:radial-gradient(circle, rgba(245,184,31,.16) 0%, transparent 70%);pointer-events:none;
}
.corp .corp-complete::after{
  content:"";position:absolute;bottom:-180px;left:-100px;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle, rgba(25,118,237,.14) 0%, transparent 70%);pointer-events:none;
}
.corp .corp-complete-inner{
  position:relative;z-index:1;
  max-width:920px;margin:0 auto;padding:0 48px;
}
.corp .complete-card{
  background:#fff;border:1px solid var(--line);border-radius:22px;
  padding:80px 64px;text-align:center;
  box-shadow:0 16px 40px rgba(30,42,82,.06);
  display:flex;flex-direction:column;align-items:center;
}
.corp .check-circle{
  width:88px;height:88px;border-radius:50%;
  background:rgba(25,118,237,.06);color:var(--blue);
  display:grid;place-items:center;margin-bottom:32px;
  position:relative;
}
.corp .check-circle::before{
  content:"";position:absolute;inset:-8px;border-radius:50%;
  background:rgba(25,118,237,.04);z-index:-1;
}
.corp .check-circle svg{width:44px;height:44px;}
.corp .complete-card .cta-eyebrow{color:var(--blue);}
.corp .complete-card .cta-eyebrow::before,
.corp .complete-card .cta-eyebrow::after{background:var(--blue);}

/* ===========================
   RESPONSIVE
   =========================== */
@media (max-width: 960px){
  .corp-hero{padding:96px 0 100px;}
  .corp-hero-inner{padding:0 24px;}
  .corp .chap{padding:72px 0;}
  .corp .chap-inner{padding:0 24px;}
  .corp .feature-row{
    grid-template-columns:1fr;gap:32px;margin-bottom:72px;
  }
  .corp .feature-row-reverse .feature-text{order:0;}
  .corp .feature-row-reverse .feature-figure{order:0;}
  .corp .feature-text{max-width:none;}
  .corp .feature-row-reverse .feature-text{margin-left:0;}
  .corp .feature-figure{aspect-ratio:16/10;}
  .corp .solutions-intro{margin-bottom:56px;}
  .corp .form-card{padding:36px 28px;}
  .corp .form-grid{grid-template-columns:1fr;gap:20px;}
  .corp .form-submit{justify-content:center;}
  .corp .btn-gold,
  .corp .btn-submit{min-width:0;width:100%;}
  .corp .btn-submit{padding:16px 32px;font-size:14px;}
  .corp .corp-complete{padding:80px 0 96px;}
  .corp .corp-complete-inner{padding:0 24px;}
  .corp .complete-card{padding:56px 32px;}
}
@media (max-width: 760px){
  .corp-hero{padding:72px 0 80px;}
  .corp-hero-inner{padding:0 16px;}
  .corp .chap{padding:56px 0;}
  .corp .chap-inner{padding:0 16px;}
  .corp .feature-row{gap:24px;margin-bottom:56px;}
  .corp .feature-figure{aspect-ratio:4/3;border-radius:14px;}
  .corp .sec-title{font-size:26px;}
  .corp .form-card{padding:28px 20px;border-radius:14px;}
  .corp .cta-headline{font-size:26px;}
  .corp .corp-complete{padding:64px 0 80px;}
  .corp .corp-complete-inner{padding:0 18px;}
  .corp .complete-card{padding:48px 24px;border-radius:18px;}
  .corp .check-circle{width:72px;height:72px;}
  .corp .check-circle svg{width:36px;height:36px;}
}
