/* company.css（Page-only / site.css+site.js compatible）
   - 共通（font / header / nav / dropdown / burger / reveal / underline / footer / buttons）は site.css に委譲
   - ここには「ページ固有」のみを置く
   - ★Access は index.html の ACCESS と同一デザイン（ここに移植）
*/

:root{
  --ink:#163a5c;
  --ink2:#244e7a;

  --paper1:#faf7ef;
  --paper2:#f5f1e8;
}

/* 背景（services/cargo と同思想：site.css のCSS変数で差し替え） */
body.services-page{
  --page-bg:
    radial-gradient(1200px 800px at 10% -10%, rgba(255,255,255,.8) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, var(--paper1) 0%, var(--paper2) 100%);
  --page-fg: var(--ink);
  color: var(--page-fg);
}

/* ===== Sub Hero（company固有） ===== */
.sub-hero{
  position:relative;
  min-height:220px;
  display:grid;
  place-items:center;
  text-align:center;
  overflow:hidden;
  margin-top:64px; /* fixed header offset */
}
.sub-hero--company{
  background:url("../images/company01.jpg") center/cover no-repeat;
}
.sub-hero__overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(22,58,92,.78) 0%, rgba(22,58,92,.72) 100%);
}
.sub-hero__inner{ position:relative; z-index:1; }
.sub-hero__title{
  margin:0;
  font-size:clamp(26px,3vw,36px);
  font-weight:900;
  letter-spacing:.02em;
  color:#eaf4ff;
  text-shadow:0 2px 14px rgba(0,0,0,.35);
}
.sub-hero__lead{
  margin:6px 0 0;
  font-size:14px;
  letter-spacing:.14em;
  color:#bfe2ff;
  text-transform:uppercase;
}

/* ===== Layout ===== */
.sub-main{ padding:34px 0 0; }
.sub-container{
  max-width:1100px;
  margin:0 auto;
  padding:40px 20px;
}

/* ===== Philosophy ===== */
.philosophy-section{
  padding-top:36px;
  padding-bottom:8px;
  border-bottom:1px dashed rgba(25,90,166,.25);
}

.sub-lead{
  font-size:18px;
  line-height:1.95;
  color:#23496f;
  margin:0 0 16px;
  font-weight:500;
  letter-spacing:.015em;
}
.sub-body{
  font-size:15px;
  line-height:1.9;
  color:#2a527f;
  margin:0;
}
.sub-body--lg{ font-size:17px; }

/* ===== Overview Card ===== */
.company-overview{ padding:32px 0 8px; }
.company-overview__card{
  border-radius:16px;
  background:linear-gradient(180deg, #1e3a75 0%, #264d91 100%);
  color:#f6fbff;
  box-shadow:0 18px 34px rgba(0,0,0,.28);
  border:1px solid rgba(174,227,255,.20);
  overflow:hidden;
}
.company-table{ padding:18px 20px; }
.company-table .row{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:10px;
  align-items:start;
  padding:12px 0;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.company-table .row:last-child{ border-bottom:none; }
.company-table dt{
  color:#aee3ff;
  font-weight:700;
  letter-spacing:.02em;
}
.company-table dd{ margin:0; color:#ffffff; }
.company-table a{ color:#ffffff; text-decoration:underline; }

/* =========================================================
   ACCESS（index.html と同一デザイン：移植）
========================================================= */
.access-block{
  background: linear-gradient(180deg, #244377 0%, #1a2f55 100%);
  color:#f6fbff;
  padding:60px 20px;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.access-inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(320px,2fr);
  gap:32px;
  align-items:start;
}
.access-label{
  font-size:clamp(13px,1vw,14px);
  letter-spacing:.18em;
  color:#8ed8ff;
  font-weight:700;
  text-transform:uppercase;
  margin:0 0 12px;
}
.access-address,
.access-tel{
  margin:0 0 10px;
  font-size:15px;
  line-height:1.7;
  color:#d2deee;
}
.access-tel a{
  color:#ffffff;
  text-decoration:none;
}
.access-tel a:hover{ text-decoration:underline; }

.access-list{
  margin:12px 0 0;
  padding-left:18px;
  color:#d2deee;
  line-height:1.85;
}

.access-mapwrap{
  position:relative;
  width:100%;
  min-height:260px;
  border-radius:16px;
  overflow:hidden;
  background:#000;
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 24px 40px rgba(0,0,0,.60);
}
.access-mapwrap iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
  filter:grayscale(10%) contrast(105%) brightness(95%);
}

/* ACCESS見出しも index と同じトーン（site.cssの.section-headlineに色だけ足す） */
.access-text .section-headline{
  color:#ffffff;
  text-shadow:
    0 2px 4px rgba(0,0,0,.32),
    0 0 18px rgba(255,255,255,.35);
}

/* SPは地図をフルブリード（帯表示） */
@media(max-width:800px){
  .access-block{ padding:60px 0; }
  .access-inner{ grid-template-columns:1fr; padding:0 20px; }
  .access-mapwrap{
    border-radius:0;
    border:0;
    width:100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    min-height:240px;
    box-shadow: 0 18px 34px rgba(0,0,0,.60);
  }
}

/* ===== Responsive tweaks ===== */
@media (max-width: 860px){
  .company-table .row{ grid-template-columns:1fr; }
}

@media (max-width: 640px){
  .sub-container{ padding:34px 14px; }
}

/* =========================================================
   ACCESS（company.html）
   - index.css の ACCESS と同一デザインへ統一
   - フルブリード禁止：常にコンテナ内 100%
========================================================= */

.company-page .access-block{
  background: linear-gradient(180deg, #244377 0%, #1a2f55 100%);
  color:#f6fbff;
  padding:60px 20px;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}

.company-page .access-inner{
  max-width:1200px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(260px,1fr) minmax(320px,2fr);
  gap:32px;
  align-items:start;
}

.company-page .access-label{
  font-size:clamp(13px,1vw,14px);
  letter-spacing:.18em;
  color:#8ed8ff;
  font-weight:700;
  text-transform:uppercase;
  margin:0 0 12px;
}

.company-page .access-address,
.company-page .access-tel{
  margin:0 0 10px;
  font-size:15px;
  line-height:1.7;
  color:#d2deee;
}

.company-page .access-tel a{ color:#ffffff; text-decoration:none; }
.company-page .access-tel a:hover{ text-decoration:underline; }

/* company固有の access-list があるので、色味だけ index に寄せる */
.company-page .access-list{
  margin:12px 0 0;
  padding-left:18px;
  color:#d2deee;
  line-height:1.8;
}
.company-page .access-list li{ margin:6px 0; }

/* map */
.company-page .access-mapwrap{
  position:relative;
  width:100%;
  min-height:260px;
  border-radius:16px;
  overflow:hidden;
  background:#000;
  border:1px solid rgba(255,255,255,.15);
  box-shadow:0 24px 40px rgba(0,0,0,.6);
}

.company-page .access-mapwrap iframe{
  position:absolute; inset:0;
  width:100%;
  height:100%;
  border:0;
  filter:grayscale(10%) contrast(105%) brightness(95%);
}

/* SP：縦積み（indexと同じ思想） */
@media (max-width:800px){
  .company-page .access-inner{
    grid-template-columns:1fr;
    padding:0;
  }
  .company-page .access-mapwrap{
    border-radius:14px;
    width:100%;
    margin:0;
    border:1px solid rgba(255,255,255,.15);
    min-height:240px;
    box-shadow:0 18px 34px rgba(0,0,0,.60);
  }
}

/* 見出し：index同様の白＋発光 */
.company-page .access-text .section-headline{
  color:#ffffff;
  text-shadow:
    0 2px 4px rgba(0,0,0,.32),
    0 0 18px rgba(255,255,255,.35);
}

/* reveal：indexと同様にゆっくり */
.company-page .access-block .reveal-up{
  transition: opacity 1.6s ease,
              transform 1.6s cubic-bezier(.2,.8,.2,1);
}