/**
 * COCONOVA Corporation Page Styles
 * front-page.css と併用（共通スタイルはfront-page.cssで定義済み）
 */

/* ===== Additional CSS Variables (amber系 - front-page.cssにないもの) ===== */
:root {
  --amber-50: #FFFBF0;
  --amber-100: #FFF3D6;
  --amber-200: #FFE4A8;
  --amber-500: #CC9230;
  --amber-700: #8A6410;
}

/* ===== Corporation Hero ===== */
.corp-hero {
  padding: 160px 0 80px;
  background: linear-gradient(160deg, var(--mint-800) 0%, var(--mint-900) 50%, #0D3B2D 100%);
  text-align: center; position: relative; overflow: hidden;
}
.corp-hero::before {
  content: ''; position: absolute; top: -150px; right: -150px;
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(42,172,172,0.1) 0%, transparent 70%);
}
.corp-hero::after {
  content: ''; position: absolute; bottom: -100px; left: -100px;
  width: 350px; height: 350px; border-radius: 50%;
  background: radial-gradient(circle, rgba(232,168,64,0.06) 0%, transparent 70%);
}
.corp-hero .section-label { color: var(--mint-300); }
.corp-hero .section-title { color: #fff; font-size: clamp(30px, 5vw, 44px); margin-bottom: 12px; }
.corp-hero-sub { font-family: var(--font-heading); font-size: 16px; color: rgba(255,255,255,0.55); letter-spacing: 0.08em; }

/* ===== Mission ===== */
.corp-mission { padding: var(--section-padding) 0; }
.corp-mission-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.corp-mission-photos { position: relative; }
.corp-mission-photos .photo-main {
  border-radius: 20px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.08);
}
.corp-mission-photos .photo-sub {
  position: absolute; bottom: -24px; right: -20px; width: 55%;
  border-radius: 16px; overflow: hidden; border: 5px solid #fff;
  box-shadow: 0 8px 28px rgba(0,0,0,0.1);
}
.corp-mission-photos img { width: 100%; height: 100%; object-fit: cover; }

/* ===== Corp Info Table ===== */
.corp-info {
  padding: var(--section-padding) 0;
  background: linear-gradient(180deg, var(--amber-50) 0%, var(--warm-50) 100%);
}
.corp-info .section-label { color: var(--amber-600); }
.corp-info-head { text-align: center; margin-bottom: 56px; }
.corp-table {
  max-width: 780px; margin: 0 auto;
  background: #fff; border-radius: 20px; overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,0.04);
}
.corp-table-row {
  display: grid; grid-template-columns: 200px 1fr; border-bottom: 1px solid var(--gray-100);
}
.corp-table-row:last-child { border-bottom: none; }
.corp-table-label {
  padding: 20px 28px; font-size: 14px; font-weight: 500; color: var(--gray-700);
  background: var(--amber-50);
}
.corp-table-value { padding: 20px 28px; font-size: 14px; color: var(--gray-600); line-height: 1.7; }

/* ===== Profile ===== */
.corp-profile {
  padding: var(--section-padding) 0;
  background: linear-gradient(160deg, var(--mint-800) 0%, var(--mint-900) 40%, #0D3B2D 100%);
  color: #fff; position: relative; overflow: hidden;
}
.corp-profile::before {
  content: ''; position: absolute; top: -200px; right: -200px;
  width: 500px; height: 500px; border-radius: 50%;
  background: radial-gradient(circle, rgba(42,172,172,0.12) 0%, transparent 70%);
}
.corp-profile-inner { display: grid; grid-template-columns: 1fr 1.2fr; gap: 60px; align-items: start; position: relative; }
.corp-profile-img { border-radius: 20px; overflow: hidden; aspect-ratio: 3/4; max-width: 380px; }
.corp-profile-img img { width: 100%; height: 100%; object-fit: cover; }
.corp-profile .section-label { color: var(--mint-300); }
.corp-profile .section-title { color: #fff; }
.corp-profile-name { font-family: var(--font-heading); font-size: 13px; color: rgba(255,255,255,0.45); margin-bottom: 28px; }
.corp-profile-text { font-size: 15px; line-height: 2; color: rgba(255,255,255,0.78); margin-bottom: 24px; }
.corp-profile-quals { margin-top: 32px; padding-top: 28px; border-top: 1px solid rgba(255,255,255,0.1); }
.corp-profile-quals h3 { font-family: var(--font-heading); font-size: 14px; font-weight: 500; color: rgba(255,255,255,0.6); margin-bottom: 12px; background: none !important; padding: 0 !important; border: none !important; }
.qual-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qual-tag {
  display: inline-block; padding: 5px 14px; font-size: 12px;
  background: rgba(255,255,255,0.07); color: rgba(255,255,255,0.7);
  border-radius: 20px; border: 1px solid rgba(255,255,255,0.1);
  list-style: none !important;
}

/* ===== Services ===== */
.corp-services { padding: var(--section-padding) 0; background: #fff; }
.corp-services-head { text-align: center; margin-bottom: 56px; }
.corp-services-head .section-desc { margin: 0 auto; }
.corp-services-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.corp-svc-card {
  background: var(--gray-50); border-radius: 16px; overflow: hidden;
  transition: transform 0.3s, box-shadow 0.3s;
}
.corp-svc-card:hover { transform: translateY(-4px); box-shadow: 0 8px 28px rgba(0,0,0,0.08); }
.corp-svc-card-img { aspect-ratio: 16/10; overflow: hidden; }
.corp-svc-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.corp-svc-card:hover .corp-svc-card-img img { transform: scale(1.04); }
.corp-svc-card-body { padding: 20px 18px; }
.corp-svc-tag {
  display: inline-block; font-size: 10px; font-weight: 500; padding: 2px 10px;
  border-radius: 10px; margin-bottom: 8px;
}
.tag-futoko { background: var(--mint-50); color: var(--mint-600); }
.tag-hattatsu { background: #EDE7FE; color: #5B4AB7; }
.tag-jigyosho { background: var(--warm-100); color: var(--amber-600); }
.corp-svc-card h3 { font-family: var(--font-heading); font-size: 15px; font-weight: 700; margin-bottom: 6px; line-height: 1.4; background: none !important; padding: 0 !important; border: none !important; }
.corp-svc-card p { font-size: 12px; color: var(--gray-500); line-height: 1.7; }
.corp-svc-link {
  display: inline-flex; align-items: center; gap: 4px; margin-top: 10px;
  font-size: 12px; font-weight: 500; color: var(--mint-500);
}

/* ===== Access ===== */
.corp-access { padding: var(--section-padding) 0; background: var(--gray-50); }
.corp-access-head { text-align: center; margin-bottom: 48px; }
.corp-access-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: start; }
.corp-access-info h3 { font-family: var(--font-heading); font-size: 16px; font-weight: 700; margin-bottom: 16px; color: var(--gray-800); background: none !important; padding: 0 !important; border: none !important; }
.corp-access-detail { font-size: 14px; color: var(--gray-600); line-height: 1.9; margin-bottom: 20px; }
.corp-access-sns { display: flex; gap: 12px; margin-top: 24px; }
.corp-access-sns a {
  display: inline-flex; align-items: center; gap: 8px; padding: 10px 20px;
  border: 1px solid var(--gray-200); border-radius: 28px; font-size: 13px;
  font-weight: 500; color: var(--gray-600); transition: all 0.2s;
}
.corp-access-sns a:hover { border-color: var(--mint-400); color: var(--mint-500); }
.corp-map {
  border-radius: 16px; overflow: hidden; aspect-ratio: 4/3;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}
.corp-map iframe { width: 100%; height: 100%; border: 0; }

/* ===== Cocoon Override (corporation page) ===== */
.coconova-corporation-page h1,
.coconova-corporation-page h2,
.coconova-corporation-page h3,
.coconova-corporation-page h4 { background: none !important; padding: 0 !important; border: none !important; }
.coconova-corporation-page ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.coconova-corporation-page img { border: none !important; }

/* ===== Responsive (corporation-specific) ===== */
@media (max-width: 1024px) {
  .corp-services-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .corp-mission-inner { grid-template-columns: 1fr; gap: 32px; }
  .corp-mission-photos .photo-sub { position: relative; bottom: auto; right: auto; width: 70%; margin-top: -40px; margin-left: auto; }
  .corp-table-row { grid-template-columns: 1fr; }
  .corp-table-label { padding: 14px 20px 4px; font-size: 12px; color: var(--amber-600); }
  .corp-table-value { padding: 4px 20px 14px; }
  .corp-profile-inner { grid-template-columns: 1fr; gap: 32px; }
  .corp-profile-img { max-width: 240px; }
  .corp-services-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .corp-access-inner { grid-template-columns: 1fr; }
  .corp-hero { padding: 120px 0 60px; }
}
@media (max-width: 480px) {
  .corp-services-grid { grid-template-columns: 1fr; gap: 16px; }
}
