/* ==========================================================================
   AOKI TRAVEL — page-company.css（会社概要・固有）
   会社概要：の型：暗い写真ヒーロー（白の筆記体h1＋白スクイグル＋セリフ副題）
   → 導入文（800px列・中央）→ 会社情報 → 沿革 → スタッフ → 安全 → 写真カード → アクセス
   値は tokens.css の変数のみ。base.css のクラスは再定義しない（ページ内スコープの微調整のみ）。
   ========================================================================== */

/* ---------- 1. 暗い写真ヒーロー ---------- */
.company-head{padding-top:22px;padding-bottom:88px}
.company-head__crumbs{margin-bottom:70px}
.company-head__eyebrow{margin-bottom:16px;color:var(--buff);text-shadow:0 1px 10px rgba(0,0,0,.55)}
.company-head .page-head__title{text-shadow:0 2px 22px rgba(0,0,0,.3)}
.company-head .page-head__sub{text-shadow:0 1px 14px rgba(0,0,0,.4)}
@media (max-width:1023px){
  .company-head{padding-bottom:70px}
  .company-head__crumbs{margin-bottom:52px}
}
@media (max-width:767px){
  .company-head{padding-top:16px;padding-bottom:52px}
  .company-head__crumbs{margin-bottom:36px}
  .company-head__eyebrow{margin-bottom:12px;letter-spacing:.1em}
}

/* ---------- 2. 導入文（疎：ゆったり・中央） ---------- */
.company-intro{padding-top:70px;padding-bottom:60px}
.company-intro__catch{margin-bottom:22px;text-wrap:balance}
.company-intro__txt{max-width:720px;margin:0 auto;color:var(--ink-2);font-size:17px;line-height:1.95}
.company-intro__links{gap:14px 32px;margin-top:28px}
/* キャッチは1行で収める（PC 752px列＝28px／タブレット 720px列＝26px） */
@media (min-width:1024px){.company-intro__catch{font-size:28px}}
@media (min-width:768px) and (max-width:1023px){.company-intro__catch{font-size:26px}}
@media (max-width:767px){
  .company-intro{padding-top:44px;padding-bottom:44px}
  .company-intro__txt{font-size:16px;line-height:1.9}
  .company-intro__links{gap:12px 24px;margin-top:22px}
}

/* ---------- 3. 会社情報（密：紙色の面に白い表） ---------- */
#profile{padding-top:66px;padding-bottom:78px}
.company-table{max-width:920px;margin:0 auto;grid-template-columns:200px 1fr;background:var(--white);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.company-table dt,.company-table dd{padding:15px 20px}
.company-table dt{letter-spacing:.02em}
.company-table dt:last-of-type,.company-table dd:last-of-type{border-bottom:0}
.company-table a{color:var(--orange-text);font-weight:700}
.company-table a:hover{color:var(--orange-2)}
.company-table__en{display:block;margin-top:2px;letter-spacing:.04em}
@media (max-width:1023px){
  #profile{padding-top:56px;padding-bottom:64px}
  .company-table{grid-template-columns:150px 1fr}
}
@media (max-width:767px){
  #profile{padding-top:44px;padding-bottom:48px}
  .company-table dt{padding:14px 18px 2px}
  .company-table dd{padding:2px 18px 14px}
}

/* ---------- 4. 沿革（左＝タイムライン／右＝バフ枠の写真） ---------- */
#history{padding-bottom:86px}
.history{grid-template-columns:1.12fr .88fr;gap:56px;align-items:start}
.history__list{margin-top:4px}
.history .timeline__item:last-child{padding-bottom:0}
.history__photo{margin:0}
.history__photo img{aspect-ratio:3/2;object-fit:cover}
.history__photo figcaption{margin-top:14px;line-height:1.7}
@media (max-width:1023px){
  #history{padding-bottom:70px}
  .history{gap:40px}
}
@media (max-width:767px){
  #history{padding-bottom:52px}
  .history{gap:32px}
  .history__photo{margin-top:4px}
}

/* ---------- 5. スタッフ（3名・写真は紙フレーム） ---------- */
.staff-grid{gap:36px 26px}
.staff{display:flex;flex-direction:column;gap:18px}
.staff__photo{display:block;width:100%}
.staff__photo img{width:100%;aspect-ratio:4/5;object-fit:cover}
.staff__body{display:flex;flex-direction:column;flex:1}
.staff__body .eyebrow{letter-spacing:.12em}
.staff__name{margin:6px 0 2px}
.staff__role{margin:0 0 12px;font-size:var(--fs-small);font-weight:700;color:var(--olive);letter-spacing:.02em}
.staff__txt{margin:0 0 14px;color:var(--ink-2)}
.staff__duty{margin:auto 0 0;padding-top:12px;border-top:1px solid var(--line);line-height:1.75}
@media (max-width:1023px){
  .staff-grid{gap:32px 20px}
  .staff{gap:14px}
}
@media (max-width:767px){
  .staff-grid{gap:34px}
  .staff__photo img{aspect-ratio:4/3}
}

/* ---------- 6. 安全への取り組み（左＝チェックリスト／右＝写真） ---------- */
#safety{padding-top:80px;padding-bottom:90px}
.safety{grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.safety__head{margin-bottom:26px}
.safety__head .sec-head__lead{margin-top:16px}
.safety__list li{margin-bottom:14px;line-height:1.75}
.safety__list li:last-child{margin-bottom:0}
.safety__photo{margin:0}
.safety__photo img{aspect-ratio:3/2;object-fit:cover}
.safety__photo figcaption{margin-top:14px;line-height:1.7}
@media (max-width:1023px){
  #safety{padding-top:62px;padding-bottom:68px}
  .safety{gap:40px}
}
@media (max-width:767px){
  #safety{padding-top:46px;padding-bottom:52px}
  .safety{gap:30px}
}

/* ---------- 7. 写真カード（Explore） ---------- */
#explore{padding-bottom:96px}
.explore-grid{gap:26px}
@media (max-width:1023px){#explore{padding-bottom:72px}.explore-grid{gap:22px 20px}}
@media (max-width:767px){
  #explore{padding-bottom:52px}
  .explore-grid{gap:18px}
  .explore-grid .card-photo img{aspect-ratio:4/3}
  .explore-grid .card-photo__title{font-size:30px}
}

/* ---------- 8. アクセス（左＝情報／右＝地図） ---------- */
#access{padding-top:76px;padding-bottom:96px}
.access{grid-template-columns:.86fr 1.14fr;gap:48px;align-items:start}
.access__head{margin-bottom:24px}
.access__dl{margin:0}
.access__dl dt{margin-top:18px;font-size:var(--fs-small);font-weight:700;letter-spacing:.06em;color:var(--orange-text)}
.access__dl dt:first-child{margin-top:0}
.access__dl dd{margin:4px 0 0;font-family:var(--font-serif);font-weight:700;font-size:17px;line-height:1.65}
.access__dl dd a{color:var(--orange-text)}
.access__dl dd a:hover{color:var(--orange-2)}
.access__note{margin:24px 0 0;font-size:var(--fs-small);line-height:var(--lh-small);color:var(--ink-2)}
.access .btn-row{margin-top:24px}
.map{position:relative}
.map iframe{display:block;width:100%;aspect-ratio:16/10;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--paper)}
@media (max-width:1023px){
  #access{padding-top:60px;padding-bottom:76px}
  .access{grid-template-columns:1fr;gap:36px}
  .map iframe{aspect-ratio:2/1}
}
@media (max-width:767px){
  #access{padding-top:46px;padding-bottom:56px}
  .access{gap:28px}
  .map iframe{aspect-ratio:4/3}
}