/* ============================================================
   グッドキャリッジ建設 採用サイト — デザインシステム
   信頼感 × 人の温度 × 仕事の躍動感 × 洗練
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700;800&family=Noto+Sans+JP:wght@300;400;500;600;700&display=swap');

:root{
  /* --- Color --- */
  --ink:        #1c1b17;
  --ink-soft:   #4a473f;
  --bg:         #faf8f4;
  --bg-alt:     #efeadf;
  --bg-deep:    #16233d;   /* navy: 信頼 */
  --bg-deep-2:  #0e1a30;
  --rust:       #a35a34;   /* テラコッタ: 人の温度 */
  --rust-deep:  #8a4a29;
  --accent-light: #e7a483; /* 紺背景上のアクセント（キッカー・サブコピー） */
  --line:       #d8d2c2;
  --line-on-deep: rgba(255,255,255,.22);
  --white:      #ffffff;

  /* --- Type --- */
  --serif: 'Shippori Mincho', serif;
  --sans:  'Noto Sans JP', sans-serif;

  /* --- Layout --- */
  --max: 1200px;
  --edge: clamp(20px, 4vw, 64px);
  --radius: 2px;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin:0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 400;
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
  letter-spacing: .01em;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
button{ font-family: inherit; cursor:pointer; }
h1,h2,h3,h4{ margin:0; font-family: var(--serif); font-weight:600; letter-spacing: .02em; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ------------------------------------------------------------
   Layout helpers
   ------------------------------------------------------------ */
.wrap{ max-width: var(--max); margin:0 auto; padding-left: var(--edge); padding-right: var(--edge); }
.section{ padding: clamp(64px, 9vw, 132px) 0; }
.section--tight{ padding: clamp(48px,6vw,84px) 0; }
.section--alt{ background: var(--bg-alt); }
.section--deep{ background: var(--bg-deep); color: #f2efe6; }
.section--deep h1,.section--deep h2,.section--deep h3{ color: #fff; }

.section-head{ margin-bottom: clamp(32px,5vw,64px); }
.section-num{
  display:block; font-family: var(--serif); font-size: 14px; letter-spacing:.18em;
  color: var(--rust); margin-bottom: 14px;
}
.section-kicker{
  display:block; font-family: var(--serif); font-size: 15px; letter-spacing:.1em;
  color: var(--ink-soft); margin-bottom: 10px;
}
.section-title{ font-size: clamp(28px, 3.6vw, 44px); line-height:1.35; }
.section-title--lg{ font-size: clamp(34px,4.6vw,58px); }
.section-lead{
  margin-top: 18px; max-width: 40em; color: var(--ink-soft); font-size: 16px; line-height:2;
}
.section--deep .section-lead{ color: #cfd4e0; }

/* photo placeholder — 写真用途ラベル */
.ph{
  position:relative; width:100%; background: var(--bg-alt);
  border:1px solid var(--line); overflow:hidden;
  display:flex; align-items:flex-end; justify-content:flex-start;
  color: var(--ink-soft);
}
.ph::before{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(135deg, transparent 48%, var(--line) 48.5%, var(--line) 51.5%, transparent 52%);
  opacity:.5;
}
.ph span{
  position:relative; z-index:1; display:inline-block; margin: 14px;
  font-size:12px; letter-spacing:.08em; padding: 5px 10px;
  background: rgba(28,27,23,.78); color:#fff; font-family: var(--sans);
}
.ph--16x9{ aspect-ratio: 16/9; }
.ph--4x5{ aspect-ratio: 4/5; }
.ph--1x1{ aspect-ratio: 1/1; }
.ph--3x2{ aspect-ratio: 3/2; }
.ph--wide{ aspect-ratio: 21/9; }

/* ------------------------------------------------------------
   Buttons / links
   ------------------------------------------------------------ */
.btn{
  display:inline-flex; align-items:center; gap:10px;
  padding: 15px 30px; border:1px solid var(--ink); font-size:14.5px;
  letter-spacing:.06em; background:transparent; color:var(--ink);
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.btn:hover{ background: var(--ink); color:#fff; }
.btn-arrow{ transition: transform .25s ease; }
.btn:hover .btn-arrow{ transform: translateX(5px); }

.btn--primary{ background: var(--rust); border-color: var(--rust); color:#fff; }
.btn--primary:hover{ background: var(--rust-deep); border-color: var(--rust-deep); }

.btn--on-deep{ border-color: rgba(255,255,255,.55); color:#fff; }
.btn--on-deep:hover{ background:#fff; color: var(--bg-deep); }

.text-link{
  display:inline-flex; align-items:center; gap:8px; font-size:14.5px;
  border-bottom:1px solid currentColor; padding-bottom:3px;
}
.text-link .btn-arrow{ transition: transform .25s ease; }
.text-link:hover .btn-arrow{ transform: translateX(5px); }

/* ------------------------------------------------------------
   Header
   ------------------------------------------------------------ */
.gh{
  position: fixed; top:0; left:0; right:0; z-index: 500;
  display:flex; align-items:center; justify-content:space-between;
  padding: 0 var(--edge); height: 76px;
  background: rgba(250,248,244,.9); backdrop-filter: blur(10px);
  border-bottom: 1px solid transparent;
  transition: border-color .3s ease, background .3s ease;
}
.gh.is-scrolled{ border-color: var(--line); }
.gh__logo{ font-family: var(--serif); font-size: 18px; letter-spacing:.06em; }
.gh__logo b{ color: var(--rust); font-weight:600; }
.gh__nav{ display:flex; align-items:center; gap: 40px; }
.gh__links{ display:flex; align-items:center; gap: 34px; }
.gh__links a{
  font-size: 14.5px; letter-spacing:.03em; position:relative; padding: 6px 0;
}
.gh__links a::after{
  content:''; position:absolute; left:0; right:100%; bottom:0; height:1px; background: var(--rust);
  transition: right .25s ease;
}
.gh__links a:hover::after{ right:0; }
.gh__entry{
  padding: 11px 24px; background: var(--rust); color:#fff; font-size:14px; letter-spacing:.05em;
  border:1px solid var(--rust); transition: background .25s ease;
}
.gh__entry:hover{ background: var(--rust-deep); border-color: var(--rust-deep); }
.gh__burger{ display:none; width:30px; height:22px; position:relative; border:none; background:none; }
.gh__burger span{
  position:absolute; left:0; right:0; height:1.5px; background: var(--ink);
  transition: transform .3s ease, opacity .3s ease;
}
.gh__burger span:nth-child(1){ top:0; }
.gh__burger span:nth-child(2){ top:10px; }
.gh__burger span:nth-child(3){ top:20px; }
.gh__burger.is-open span:nth-child(1){ transform: translateY(10px) rotate(45deg); }
.gh__burger.is-open span:nth-child(2){ opacity:0; }
.gh__burger.is-open span:nth-child(3){ transform: translateY(-10px) rotate(-45deg); }

.gh__mobile{
  position: fixed; inset: 76px 0 0 0; background: var(--bg);
  transform: translateY(-8px); opacity:0; pointer-events:none;
  transition: opacity .25s ease, transform .25s ease;
  z-index: 480; padding: 30px var(--edge); overflow-y:auto;
}
.gh__mobile.is-open{ opacity:1; transform: translateY(0); pointer-events:auto; }
.gh__mobile a{ display:block; padding: 16px 0; border-bottom:1px solid var(--line); font-size:17px; font-family: var(--serif); }
.gh__mobile .gh__entry{ display:inline-block; margin-top:24px; }

@media (max-width: 980px){
  .gh__links, .gh__entry.gh__entry--desktop{ display:none; }
  .gh__burger{ display:block; }
}

/* ------------------------------------------------------------
   Footer
   ------------------------------------------------------------ */
.gf{ background: var(--bg-deep-2); color: #cfd4e0; }
.gf a:hover{ color:#fff; }
.gf__top{ padding: clamp(56px,7vw,88px) 0 40px; border-bottom:1px solid var(--line-on-deep); }
.gf__brand{ font-family: var(--serif); color:#fff; font-size: 20px; margin-bottom: 14px; }
.gf__brand-link{ font-size: 13.5px; display:inline-flex; gap:8px; align-items:center; border-bottom:1px solid rgba(255,255,255,.3); padding-bottom:2px; }
.gf__grid{ display:grid; grid-template-columns: 1.1fr repeat(4, 1fr); gap: 32px; margin-top: 48px; }
.gf__col h4{ font-family: var(--sans); font-weight:600; color:#fff; font-size:13.5px; letter-spacing:.06em; margin-bottom:18px; }
.gf__col li{ margin-bottom: 12px; font-size: 13.5px; }
.gf__col--entry{ background: rgba(255,255,255,.04); padding: 22px; border: 1px solid var(--line-on-deep); }
.gf__col--entry h4{ color: var(--accent-light,#e7a483); }
.gf__bottom{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px;
  padding: 22px 0; font-size:12.5px; color:#8790a3;
}
.gf__bottom a{ margin-right: 18px; }

@media (max-width: 900px){
  .gf__grid{ grid-template-columns: 1fr 1fr; }
  .gf__col--wide{ grid-column: 1/-1; }
}
@media (max-width: 560px){
  .gf__grid{ grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------
   FV (First View)
   ------------------------------------------------------------ */
.fv{
  position:relative; min-height: 92vh; display:flex; align-items:flex-end;
  padding-top: 76px; overflow:hidden; background: var(--bg-deep);
  color:#fff;
}
.fv__media{ position:absolute; inset:0; }
.fv__media .ph{ height:100%; border:none; background:
    linear-gradient(180deg, rgba(14,26,48,.15), rgba(14,26,48,.86)),
    linear-gradient(135deg, #223454 0%, #16233d 60%, #0e1a30 100%);
}
.fv__media .ph span{ position:absolute; bottom:24px; left:24px; margin:0; }
.fv__content{ position:relative; z-index:2; width:100%; padding: 0 var(--edge) 64px; }
.fv__eyebrow{ overflow:hidden; margin-bottom: 22px; }
.fv__eyebrow span{ display:inline-block; font-size:13.5px; letter-spacing:.16em; color:var(--accent-light,#e7a483); }
.fv__copy{ font-size: clamp(32px, 5.4vw, 66px); line-height:1.4; max-width: 15em; }
.fv__copy .line{ overflow:hidden; }
.fv__copy .line span{ display:inline-block; transform: translateY(110%); }
.fv__lead{ margin-top:26px; max-width: 34em; font-size:15.5px; color:#cfd4e0; opacity:0; }
.fv__scroll{
  position:absolute; right: var(--edge); bottom: 34px; z-index:2;
  display:flex; align-items:center; gap:10px; font-size:12px; letter-spacing:.14em; color:#cfd4e0;
  opacity:0;
}
.fv__scroll .bar{ width:1px; height:38px; background: rgba(255,255,255,.4); position:relative; overflow:hidden; }
.fv__scroll .bar::after{ content:''; position:absolute; top:-100%; left:0; right:0; height:100%; background:var(--accent-light,#e7a483); animation: scrollbar 1.8s ease-in-out infinite; }
@keyframes scrollbar{ 0%{ top:-100%; } 50%{ top:0; } 100%{ top:100%; } }

/* Sub-page FV */
.sfv{
  position:relative; padding: 168px var(--edge) 76px; background: var(--bg-deep); color:#fff; overflow:hidden;
}
.sfv::after{
  content:''; position:absolute; right:-8%; top:-30%; width:60%; aspect-ratio:1/1; border-radius:50%;
  background: radial-gradient(circle at 30% 30%, rgba(163,90,52,.35), transparent 65%);
}
.sfv__inner{ position:relative; z-index:1; max-width: var(--max); margin:0 auto; }
.sfv__breadcrumb{ font-size:12.5px; color:#a9b0c2; letter-spacing:.04em; margin-bottom:22px; }
.sfv__breadcrumb a:hover{ color:#fff; }
.sfv__kicker{ font-family: var(--serif); font-size:15px; letter-spacing:.14em; color:var(--accent-light,#e7a483); display:block; margin-bottom:16px; }
.sfv__title{ font-size: clamp(30px,4.6vw,52px); }
.sfv__lead{ margin-top:18px; max-width:34em; color:#cfd4e0; font-size:15px; }

/* ------------------------------------------------------------
   NEWS block (shared component)
   ------------------------------------------------------------ */
.news-strip{ border-top:1px solid var(--line); }
.news-row{
  display:flex; align-items:center; gap: 28px; padding: 26px 0; border-bottom:1px solid var(--line);
  transition: background .25s ease; position:relative;
}
.news-row:hover{ background: var(--bg-alt); }
.news-row__date{ font-family: var(--serif); font-size:14px; color: var(--ink-soft); width:100px; flex:none; }
.news-row__cat{
  flex:none; font-size:11.5px; letter-spacing:.04em; border:1px solid var(--line); padding: 5px 12px; color: var(--ink-soft);
}
.news-row__title{ flex:1; font-size:15px; }
.news-row__arrow{ flex:none; transition: transform .25s ease; }
.news-row:hover .news-row__arrow{ transform: translateX(6px); }
@media (max-width:640px){
  .news-row{ flex-wrap:wrap; gap:10px 16px; }
  .news-row__title{ width:100%; order:3; }
}

/* ------------------------------------------------------------
   Cards (used sparingly, varied styles)
   ------------------------------------------------------------ */
.card-min{ border-top:1px solid var(--ink); padding-top:22px; }
.card-min__num{ font-family: var(--serif); font-size:13px; color: var(--rust); letter-spacing:.1em; }

/* Blog / job cards */
.grid-3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
@media (max-width: 860px){ .grid-3{ grid-template-columns: 1fr; gap: 48px; } }

.article-card__cat{ font-size:11.5px; letter-spacing:.04em; color: var(--rust); margin-bottom: 10px; display:block; }
.article-card__date{ font-size:12.5px; color: var(--ink-soft); }
.article-card__title{ font-size:17px; margin-top:12px; line-height:1.6; }
.article-card__excerpt{ margin-top:10px; font-size:14.5px; color: var(--ink-soft); line-height:1.95; }
.article-card{ display:block; }
.article-card__img{ margin-bottom:20px; }
.article-card:hover .article-card__img{ opacity:.92; }

/* Job list */
.job-row{
  display:grid; grid-template-columns: 1.1fr 1fr 1fr auto; gap: 24px; align-items:center;
  padding: 30px 0; border-bottom:1px solid var(--line);
}
.job-row__title{ font-size:20px; }
.job-row__meta{ font-size:14px; color: var(--ink-soft); }
.job-row__meta span{ display:block; margin-bottom:4px; }
@media (max-width:820px){
  .job-row{ grid-template-columns:1fr; gap:10px; }
}

/* ------------------------------------------------------------
   FAQ accordion
   ------------------------------------------------------------ */
.faq{ border-top:1px solid var(--line); }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-q{
  width:100%; display:flex; align-items:center; gap:20px; text-align:left; background:none; border:none;
  padding: 26px 0; font-size:15.5px; color: var(--ink);
}
.faq-q__mark{
  flex:none; width:30px; height:30px; border-radius:50%; border:1px solid var(--ink); display:flex; align-items:center; justify-content:center;
  font-family: var(--serif); font-size:14px;
}
.faq-q__plus{ margin-left:auto; font-size:20px; font-weight:300; transition: transform .3s ease; flex:none; }
.faq-item.is-open .faq-q__plus{ transform: rotate(45deg); }
.faq-a{ max-height:0; overflow:hidden; transition: max-height .35s ease; }
.faq-a__in{ padding: 0 0 28px 50px; font-size:14.5px; color: var(--ink-soft); line-height:2; }
.faq-a__in a{ border-bottom:1px solid var(--ink-soft); }

/* ------------------------------------------------------------
   Numbers / stats
   ------------------------------------------------------------ */
.stat-grid{ display:grid; grid-template-columns: repeat(3,1fr); border-top:1px solid var(--line-on-deep); border-left:1px solid var(--line-on-deep); }
.stat{ border-right:1px solid var(--line-on-deep); border-bottom:1px solid var(--line-on-deep); padding: 34px 30px; }
.stat__label{ font-size:13px; color:#a9b0c2; letter-spacing:.04em; }
.stat__value{ margin-top:14px; font-family: var(--serif); font-size: clamp(38px,4vw,54px); color:#fff; line-height:1; }
.stat__unit{ font-size:16px; color:#a9b0c2; margin-left:4px; }
@media (max-width:760px){ .stat-grid{ grid-template-columns: repeat(2,1fr); } }

/* ------------------------------------------------------------
   ENTRY CTA (shared)
   ------------------------------------------------------------ */
.entry-cta{
  position:relative; background: var(--bg-deep); color:#fff; overflow:hidden;
  padding: clamp(64px,9vw,120px) 0;
}
.entry-cta__inner{ position:relative; z-index:1; display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap: 36px; }
.entry-cta__bgtype{
  /* inline SVG: textLength により文字幅を親幅へ固定（フォント幅非依存）。
     !important は Claude Design 等が付与する inline style への防御 */
  position:absolute !important; left: var(--edge) !important; right: var(--edge) !important;
  bottom: -2.6vw !important; width: auto !important; height: auto !important; max-width:none !important;
  font-size: 0 !important; line-height: 0 !important;
  display:block; z-index:0; pointer-events:none; overflow:visible;
}
.entry-cta__bgtype text{ font-family: var(--serif); font-weight:700; font-size:150px; fill: rgba(255,255,255,.055); letter-spacing:0; }
.entry-cta__sub{ margin-top:14px; font-family: var(--serif); font-size: clamp(17px,1.8vw,22px); color:var(--accent-light,#e7a483); letter-spacing:.06em; }
.entry-cta__kicker{ font-family: var(--serif); color:var(--accent-light,#e7a483); font-size:15px; letter-spacing:.1em; display:block; margin-bottom:14px; }
.entry-cta__title{ font-size: clamp(28px,4vw,46px); max-width: 14em; }
.entry-cta__actions{ display:flex; gap:16px; flex-wrap:wrap; }
.entry-cta__actions .btn{ padding: 18px 34px; }

/* ------------------------------------------------------------
   Next Page CTA
   ------------------------------------------------------------ */
.next-cta{
  display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;
  padding: 34px var(--edge); background: var(--bg-alt); border:1px solid var(--line);
}
.next-cta__label{ font-size:12.5px; color: var(--ink-soft); letter-spacing:.05em; }
.next-cta__title{ font-size: clamp(19px,2.4vw,26px); margin-top:8px; }

/* ------------------------------------------------------------
   Reveal animation (single orchestrated on-scroll pattern)
   ------------------------------------------------------------ */
.reveal{ opacity:0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); }
.reveal.is-visible{ opacity:1; transform: translateY(0); }
.reveal-stagger > *{ opacity:0; transform: translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.reveal-stagger.is-visible > *{ opacity:1; transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1){ transition-delay: .02s; }
.reveal-stagger.is-visible > *:nth-child(2){ transition-delay: .1s; }
.reveal-stagger.is-visible > *:nth-child(3){ transition-delay: .18s; }
.reveal-stagger.is-visible > *:nth-child(4){ transition-delay: .26s; }
.reveal-stagger.is-visible > *:nth-child(5){ transition-delay: .34s; }
.reveal-stagger.is-visible > *:nth-child(6){ transition-delay: .42s; }

/* ------------------------------------------------------------
   Misc utility layouts used across sections
   ------------------------------------------------------------ */
.split{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(28px,5vw,80px); align-items:center; }
@media (max-width: 900px){ .split{ grid-template-columns: 1fr; } }
.split--rev .split__media{ order:2; }
@media (max-width:900px){ .split--rev .split__media{ order:0; } }

.eq-cols{ display:grid; grid-template-columns: 320px 1fr; gap: clamp(28px,6vw,90px); }
@media (max-width: 860px){ .eq-cols{ grid-template-columns: 1fr; } }

.pager{ display:flex; justify-content:center; gap:10px; margin-top: 56px; }
.pager button{
  width:38px; height:38px; border:1px solid var(--line); background:none; font-size:13px; color: var(--ink-soft);
  transition: all .2s ease;
}
.pager button.is-active, .pager button:hover{ border-color: var(--ink); color: var(--ink); }

.filter-bar{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 44px; }
.filter-chip{
  padding: 9px 18px; border:1px solid var(--line); font-size:13.5px; color: var(--ink-soft); background:none;
  transition: all .2s ease;
}
.filter-chip.is-active{ background: var(--ink); border-color: var(--ink); color:#fff; }

.breadcrumb{ font-size:12.5px; color: var(--ink-soft); margin-bottom: 34px; }
.breadcrumb a:hover{ color: var(--ink); }

.detail-hero__cat{ font-size:12px; color: var(--rust); letter-spacing:.04em; }
.detail-hero__title{ margin-top:16px; font-size: clamp(26px,3.6vw,40px); line-height:1.5; }
.detail-hero__meta{ margin-top:18px; font-size:13px; color: var(--ink-soft); }
.detail-body{ max-width: 46em; margin-top: 48px; font-size:15.5px; line-height:2.1; }
.detail-body p{ margin:0 0 1.6em; }

.spec-table{ width:100%; border-collapse:collapse; }
.spec-table th, .spec-table td{ text-align:left; padding: 18px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.spec-table th{ width: 200px; font-weight:500; color: var(--ink-soft); font-size:14px; }
.spec-table td{ font-size:14.5px; line-height:1.9; }
@media (max-width:640px){
  .spec-table, .spec-table tbody, .spec-table tr, .spec-table th, .spec-table td{ display:block; width:100%; }
  .spec-table th{ padding-bottom:6px; border-bottom:none; }
  .spec-table td{ padding-top:0; }
}

/* ============================================================
   第1回ブラッシュアップ追加分
   ============================================================ */

/* ---- WORK: 写真を主役にした左右交互（比率強調） ---- */
.work-row{
  display:grid; grid-template-columns: 1.35fr 1fr; gap: clamp(28px,5vw,72px); align-items:center;
  padding: clamp(40px,6vw,64px) 0; border-bottom:1px solid var(--line);
}
.work-row:last-child{ border-bottom:none; }
.work-row--rev{ grid-template-columns: 1fr 1.35fr; }
.work-row--rev .work-row__media{ order:2; }
.work-row--rev .work-row__body{ order:1; }
.work-row__media .ph{ aspect-ratio: 4/3; }
@media (max-width:900px){
  .work-row, .work-row--rev{ grid-template-columns:1fr; }
  .work-row--rev .work-row__media, .work-row--rev .work-row__body{ order:0; }
}

/* ---- PEOPLE: 縦スクロールで一人ずつ出会う構成 ---- */
.people-row{
  display:grid; grid-template-columns: 1fr 1.05fr; gap: clamp(28px,5vw,80px); align-items:center;
  padding: clamp(56px,7vw,96px) 0;
}
.people-row + .people-row{ border-top:1px solid var(--line); }
.people-row--rev{ grid-template-columns: 1.05fr 1fr; }
.people-row--rev .people-row__media{ order:2; }
.people-row--rev .people-row__body{ order:1; }
.people-row__media .ph{ aspect-ratio: 3/4; }
.people-row__meta{ font-size:13px; color: var(--ink-soft); letter-spacing:.03em; }
.people-row__meta b{ color: var(--rust); font-weight:500; }
.people-row__name{ margin-top:14px; font-size: clamp(22px,2.6vw,28px); }
.people-row__copy{
  margin-top:20px; font-family: var(--serif); font-size: clamp(19px,2.2vw,24px); line-height:1.7; color: var(--ink);
}
.people-row__bio{ margin-top:20px; font-size:14.5px; line-height:2; color: var(--ink-soft); max-width: 30em; }
@media (max-width:900px){
  .people-row, .people-row--rev{ grid-template-columns:1fr; }
  .people-row--rev .people-row__media, .people-row--rev .people-row__body{ order:0; }
}

/* ---- OFFICE TOUR: 大小の写真で巡る構成 ---- */
.tour-gallery{ display:flex; flex-direction:column; gap: 2px; }
.tour-item{ display:grid; grid-template-columns: 1.5fr 1fr; gap: 2px; }
.tour-item--rev{ grid-template-columns: 1fr 1.5fr; }
.tour-item--rev .tour-item__main{ order:2; }
.tour-item--rev .tour-item__sub{ order:1; }
.tour-item__main .ph{ aspect-ratio: 16/10; border:none; }
.tour-item__sub{ display:flex; flex-direction:column; justify-content:center; gap:2px; background: var(--bg-alt); padding: clamp(24px,3vw,40px); }
.tour-item__sub .ph{ aspect-ratio: 4/3; border:none; margin-bottom:18px; }
.tour-item__num{ font-family: var(--serif); font-size:13px; color: var(--rust); }
.tour-item__title{ margin-top:10px; font-size:19px; }
.tour-item__desc{ margin-top:12px; font-size:13.5px; color: var(--ink-soft); line-height:1.9; }
@media (max-width:820px){
  .tour-item, .tour-item--rev{ grid-template-columns:1fr; }
  .tour-item--rev .tour-item__main, .tour-item--rev .tour-item__sub{ order:0; }
}

/* ---- 募集要項詳細：職種別ENTRY（最重要CTA） ---- */
.job-cta{
  margin-top: 56px; padding: clamp(40px,5vw,56px); background: var(--bg-deep); color:#fff; text-align:center;
  position:relative; overflow:hidden;
}
.job-cta::before{
  content:''; position:absolute; right:-15%; top:-40%; width:55%; aspect-ratio:1/1; border-radius:50%;
  background: radial-gradient(circle at 40% 40%, rgba(163,90,52,.32), transparent 65%);
}
.job-cta__kicker{ position:relative; z-index:1; display:block; font-size:13px; letter-spacing:.08em; color:var(--accent-light,#e7a483); }
.job-cta__title{ position:relative; z-index:1; margin-top:14px; font-size: clamp(21px,2.8vw,29px); line-height:1.6; color:#fff; }
.job-cta__btn{
  position:relative; z-index:1; display:inline-flex; align-items:center; gap:10px; margin-top:28px;
  padding: 18px 38px; background: var(--rust); color:#fff; font-size:15px; letter-spacing:.04em;
  border:1px solid var(--rust); transition: background .25s ease;
}
.job-cta__btn:hover{ background: var(--rust-deep); border-color: var(--rust-deep); }
.job-cta__note{ position:relative; z-index:1; margin-top:18px; font-size:12.5px; color:#a9b0c2; }
.job-cta__note a{ border-bottom:1px solid #a9b0c2; }
.job-cta__note a:hover{ color:#fff; border-color:#fff; }

/* ---- 共通ENTRY CTA：ページのクライマックスとして強化 ---- */
.entry-cta{ padding: clamp(88px,11vw,148px) 0 clamp(120px,15vw,210px); border-top: 1px solid rgba(255,255,255,.08); }
.entry-cta__kicker{ font-size:16px; }
.entry-cta__title{ font-size: clamp(32px,4.6vw,52px); }
.entry-cta__actions .btn{ padding: 19px 38px; font-size:15px; }
.gf{ border-top: 2px solid var(--rust); }

/* ============================================================
   不具合・レスポンシブ修正（2026-09-02）
   ============================================================ */

/* 固定ヘッダー（76px）にアンカー先の見出しが隠れないようにする */
[id]{ scroll-margin-top: 96px; }

/* TOP「採用について」ダイジェスト（PCは従来のインラインgridと同値） */
.digest-recruit-grid{
  margin-top:56px; display:grid; grid-template-columns: repeat(4,1fr); gap:1px; background: var(--line-on-deep);
}
@media (max-width:900px){ .digest-recruit-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width:520px){ .digest-recruit-grid{ grid-template-columns: 1fr; } }

/* TOP「WORK」ダイジェスト（PCは従来のインラインgridと同値） */
.digest-work-grid{
  margin-top:18px; display:grid; grid-template-columns: 2fr 1fr 1fr; gap:2px; background: var(--line);
}
@media (max-width:760px){
  .digest-work-grid{ grid-template-columns: 1fr 1fr; }
  .digest-work-grid > .ph--16x9{ grid-column: 1 / -1; }
}

/* company.html「BUSINESS」（PCは従来のインラインgridと同値） */
.business-grid{
  margin-top:56px; display:grid; grid-template-columns: 1fr 1fr; gap:2px; background: var(--line);
}
@media (max-width:760px){ .business-grid{ grid-template-columns: 1fr; } }

/* ============================================================
   TOP 再設計（2026-09）
   「スクロールするほど、会社の骨格が組み上がる。」
   演出は top.js（index.html のみ読み込み）。JS無効・reduced-motion時は
   すべて静的な完成状態で表示される。
   ============================================================ */

/* ---- JS無効時の保険 ---- */
.no-js .reveal, .no-js .reveal-stagger > *{ opacity:1 !important; transform:none !important; }

/* ---- ヘッダー：社名が長くなった分の調整 ---- */
@media (max-width:1200px){ .gh__logo{ font-size:16px; } .gh__links{ gap:24px; } .gh__nav{ gap:28px; } }

/* ---- TOP共通 ---- */
main.top{ position:relative; }
main.top > section:not(.fv){ position:relative; z-index:1; }
.top-news{ background:var(--bg); border-top:1px solid var(--line); }
.top-news + .about{ padding-top: clamp(24px,4vw,56px); }

/* アウトライン文字（骨格の言語として共通化） */
.t-outline{ color:transparent; -webkit-text-stroke:1px var(--ink); }

/* ---- 骨格線（スパイン） ---- */
.spine{
  position:absolute; top:0; height:0; width:1px; z-index:4; pointer-events:none; display:none;
  left: max(16px, calc((100% - var(--max)) / 2 - 40px));
}
@media (min-width:1024px){ .spine{ display:block; } }
.spine__base{ position:absolute; inset:0; background: var(--ink); opacity:.08; }
.spine__prog{ position:absolute; top:0; left:0; width:1px; height:0; background: var(--rust); opacity:.45; }
.spine__node{
  position:absolute; left:50%; width:9px; height:9px; margin-left:-4.5px; margin-top:-4.5px; border-radius:50%;
  border:1px solid var(--rust); background: var(--bg); opacity:.3; transition: opacity .4s ease, background .4s ease;
}
.spine__node.is-on{ opacity:1; background: var(--rust); }
.spine__node b{
  position:absolute; right:16px; top:-3px; font: 500 11px/1 var(--serif); letter-spacing:.12em; color: var(--rust);
  white-space:nowrap; opacity:0; transition: opacity .4s ease;
}
.spine__node.is-on b{ opacity:.9; }

/* ---- FV：sticky（NEWSが上に滑り込む） ---- */
.fv--sticky{ position:sticky; top:0; z-index:0; min-height:100vh; min-height:100svh; }
.fv__en{ margin-top:16px; font-family: var(--serif); font-size: clamp(12px,1.1vw,15px); letter-spacing:.24em; color:var(--accent-light,#e7a483); opacity:0; }
.fv--sticky .fv__lead{ margin-top:22px; font-size: clamp(15px,1.3vw,17px); line-height:2; }

/* ============================================================
   01 ABOUT
   ============================================================ */
.about{ background: var(--bg); }
.about-stage{ --about-stage-h: 280vh; height: var(--about-stage-h); }
.about-stage__sticky{ position:sticky; top:0; height:100vh; height:100svh; display:flex; align-items:center; }
.about-stage__grid{ width:100%; position:relative; display:grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px,6vw,96px); align-items:center; }
.about-stage__num{
  position:absolute; left: calc(var(--edge) - .12em); top:-.62em; pointer-events:none; z-index:0;
  font: 600 clamp(96px,14vw,200px)/1 var(--serif); letter-spacing:-.02em;
  color:transparent; -webkit-text-stroke:1px var(--line);
}
.about-stage__copy{ position:relative; z-index:1; }
.about-stage__copy .section-kicker{ margin-bottom: clamp(24px,3vw,40px); }
.about-line{ margin:0; font-family: var(--serif); font-size: clamp(24px,3vw,40px); line-height:1.6; color: var(--ink); transition: opacity .5s ease, transform .5s ease; }
.about-line + .about-line{ margin-top: clamp(16px,2.2vw,30px); }
.about-stage.is-driven .about-line{ opacity:0; transform: translateY(14px); }
.about-stage.is-driven .about-line.is-on{ opacity:.35; transform:none; }
.about-stage.is-driven .about-line.is-cur{ opacity:1; }
.about-stage__figure{ position:relative; aspect-ratio: 600/420; }
.about-stage__photo{ position:absolute; inset:0; border:none; transition: opacity .9s ease; }
.about-stage.is-driven .about-stage__photo{ opacity:0; }
.about-stage.is-driven.is-built .about-stage__photo{ opacity:1; }
.skeleton{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.skeleton .sk{ fill:none; stroke: var(--ink); stroke-width:1.2; stroke-linecap:square; }
.skeleton .sk--diag{ stroke: var(--rust); }
.skeleton .sk-joints circle{ fill: var(--bg); stroke: var(--rust); stroke-width:1.2; transition: opacity .4s ease; }
.about-stage.is-driven .sk-joints{ opacity:0; }
.about-stage.is-driven.is-jointed .sk-joints{ opacity:1; }
@media (max-width:900px){
  .about-stage{ height:auto; }
  .about-stage__sticky{ position:static; height:auto; padding: 56px 0 24px; }
  .about-stage__grid{ grid-template-columns:1fr; gap:32px; }
  .about-stage__num{ font-size:72px; top:-.3em; }
  .about-line{ font-size: clamp(22px,6vw,28px); }
}

.about-land{ padding: clamp(40px,6vw,88px) 0 clamp(64px,8vw,110px); }
.about-land__big{ margin:0; font: 600 clamp(72px,13vw,190px)/1 var(--serif); letter-spacing:.02em; color:transparent; -webkit-text-stroke:1.5px var(--ink); }
.about-land__sub{ margin-top:28px; font-size: clamp(16px,1.5vw,19px); line-height:2; color: var(--ink-soft); }

.about-body{ background: var(--bg-alt); padding: clamp(72px,9vw,128px) 0; }
.about-message__text{ margin-top:18px; font-size:15px; line-height:2.1; color: var(--ink-soft); max-width:32em; }
.about-message__text:first-of-type{ margin-top:26px; }
.about-message__sign{ margin-top:26px; font-family: var(--serif); font-size:16px; }
.about-message .text-link{ display:inline-flex; }
.about-business{ margin-top: clamp(80px,10vw,140px); }
.about-business__grid{ display:grid; grid-template-columns: 60% 1fr; gap: clamp(24px,4vw,56px); align-items:start; margin-top:48px; }
.about-business__item--civil{ margin-top: clamp(32px,5vw,72px); }
.about-business__item .card-min__num{ display:block; margin-top:18px; }
.about-business__item h3{ font-size:20px; margin-top:8px; }
.about-business__item p{ margin-top:10px; font-size:14px; line-height:1.95; color: var(--ink-soft); }
.about-numbers{ margin-top: clamp(80px,10vw,140px); }
.about-numbers__rule{ position:relative; height:1px; background: var(--ink); opacity:.3; }
.about-numbers__rule i{ position:absolute; top:-4px; width:1px; height:9px; background: var(--ink); }
.about-numbers__rule i:first-child{ left:0; } .about-numbers__rule i:last-child{ right:0; }
.about-numbers__list{ display:grid; grid-template-columns: repeat(3,1fr); gap:24px; margin-top:28px; }
.about-numbers__list b{ display:block; font: 600 clamp(56px,7vw,112px)/1 var(--serif); color:transparent; -webkit-text-stroke:1.2px var(--ink); letter-spacing:-.01em; }
.about-numbers__list b em{ font-style:normal; font-size:.42em; }
.about-numbers__list span{ display:block; margin-top:10px; font-size:12px; letter-spacing:.16em; color: var(--rust); }
.about-numbers__list small{ display:block; margin-top:6px; font-size:13.5px; color: var(--ink-soft); }
.about-numbers .text-link{ margin-top:36px; }
@media (max-width:900px){
  .about-business__grid{ grid-template-columns:1fr; }
  .about-business__item--civil{ margin-top:0; }
  .about-numbers__list{ grid-template-columns:1fr; gap:20px; }
  .about-numbers__list li{ display:grid; grid-template-columns:auto 1fr; gap:4px 16px; align-items:baseline; }
  .about-numbers__list b{ grid-row:1/3; }
}

/* ============================================================
   02 PROJECT / WORKS
   ============================================================ */
.project{ background: var(--bg-deep); color:#fff; }
.project-runway{ --project-tempo: 1.1; position:relative; }
.project-sticky{ position:relative; padding: 110px 0 56px; }
.project-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:32px; flex-wrap:wrap; }
.project-head .section-lead{ max-width:34em; color:#cfd4e0; margin-top:0; font-size:15px; }
.project-track{ position:relative; display:flex; align-items:flex-start; gap: clamp(48px,6vw,110px); margin-top: 40px; will-change: transform; }
.project-track::before{ content:''; position:absolute; left:-100vw; right:-100vw; bottom: 22px; height:1px; background: rgba(255,255,255,.14); }
.project-slide{ position:relative; flex:none; }
.project-slide__num{
  position:absolute; left:-.18em; top:-.58em; z-index:0; pointer-events:none;
  font: 600 clamp(96px,12vw,180px)/1 var(--serif); color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.35);
}
.project-slide__photo{ position:relative; z-index:1; border:none; }
.project-slide__sub{ position:absolute; z-index:2; width:12vw; aspect-ratio:1/1; right:-5vw; top:-5vh; border:1px solid rgba(255,255,255,.25); background: var(--bg-deep-2); }
.project-slide__cap{ margin-top:18px; max-width:32em; }
.project-slide__tag{ font-size:11.5px; letter-spacing:.14em; color:var(--accent-light,#e7a483); }
.project-slide__title{ margin-top:8px; font-size: clamp(18px,1.6vw,22px); color:#fff; }
.project-slide__copy{ margin:10px 0 0; font-family: var(--serif); font-size: clamp(17px,1.5vw,21px); line-height:1.6; color:#fff; }
.project-slide__desc{ margin:8px 0 0; font-size:13.5px; line-height:1.9; color:#a9b0c2; }
.project-end{ flex:none; align-self:center; }
.project-end__copy{ margin:0; font-family: var(--serif); font-size: clamp(22px,2.4vw,32px); line-height:1.7; color:#fff; }
.project-progress{ display:flex; align-items:center; gap:10px; font: 500 13px/1 var(--serif); letter-spacing:.12em; color:#cfd4e0; }
.project-progress__cur{ color:#fff; }
.project-progress__bar{ display:block; width:120px; height:1px; background: rgba(255,255,255,.2); position:relative; }
.project-progress__bar b{ position:absolute; left:0; top:0; height:1px; width:0; background: var(--rust); }

/* PC駆動モード（top.js が .is-driven を付与） */
.project.is-driven .project-sticky{ position:sticky; top:0; height:100vh; height:100svh; overflow:hidden; display:flex; flex-direction:column; padding: 96px 0 0; }
.project.is-driven .project-head{ flex:none; }
.project.is-driven .project-track{ flex:1; padding-left: max(var(--edge), calc((100vw - var(--max)) / 2 + var(--edge))); padding-right: 10vw; }
.project.is-driven .project-slide--1 .project-slide__photo{ width:46vw; aspect-ratio:16/10; }
.project.is-driven .project-slide--2{ margin-top:5vh; margin-left:-4vw; }
.project.is-driven .project-slide--2 .project-slide__photo{ width:22vw; aspect-ratio:3/4; }
.project.is-driven .project-slide--3{ margin-top:2vh; }
.project.is-driven .project-slide--3 .project-slide__photo{ width:42vw; aspect-ratio:16/9; }
.project.is-driven .project-slide--4{ margin-top:7vh; }
.project.is-driven .project-slide--4 .project-slide__photo{ width:34vw; aspect-ratio:3/2; }
.project.is-driven .project-end{ width:34vw; padding-left:2vw; }
.project.is-driven .project-progress{ position:absolute; right: var(--edge); bottom:28px; }
.project.is-driven .section-title{ font-size: clamp(26px,3vw,38px); }
.project.is-driven .project-head .section-lead{ font-size:14px; line-height:1.9; }
.project.is-driven .project-track{ margin-top:24px; }
/* 写真高さが 100svh を超えないよう上限 */
.project.is-driven .project-slide__photo{ max-height: 46svh; }

/* 非駆動モード（SP／タッチ／reduced-motion／JS無効）＝横スワイプ */
.project:not(.is-driven) .project-head{ padding: 0 var(--edge); max-width: var(--max); margin:0 auto; }
.project:not(.is-driven) .project-track{
  overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
  padding: 36px var(--edge) 28px; gap:24px; scrollbar-width:none; align-items:stretch;
}
.project:not(.is-driven) .project-track::-webkit-scrollbar{ display:none; }
.project:not(.is-driven) .project-track::before{ display:none; }
.project:not(.is-driven) .project-slide{ scroll-snap-align:start; width:min(82vw,520px); }
.project:not(.is-driven) .project-slide__photo{ width:100%; aspect-ratio:4/3; }
.project:not(.is-driven) .project-slide__sub{ display:none; }
.project:not(.is-driven) .project-slide__num{ font-size:80px; top:-.5em; left:-.1em; }
.project:not(.is-driven) .project-end{ width:min(70vw,360px); padding: 0 24px 0 8px; }
.project:not(.is-driven) .project-progress{ padding: 8px var(--edge) 0; max-width: var(--max); margin:0 auto; }

/* ============================================================
   03 WORK
   ============================================================ */
.work-top{ background: var(--bg); }
.work-top__head{ display:grid; grid-template-columns: 1fr 1fr; gap:48px; align-items:end; }
.work-top__head .section-lead{ margin-top:0; }
.work-top__spread{ margin-top:64px; display:grid; grid-template-columns: repeat(12,1fr); gap: 20px 24px; }
.work-top__fig{ margin:0; position:relative; }
.work-top__fig--main{ grid-column:1/9; grid-row:1/3; display:flex; flex-direction:column; }
.work-top__fig--main .ph{ flex:1; min-height:420px; }
.work-top__fig--design{ grid-column:9/13; grid-row:1; }
.work-top__fig--design .ph{ aspect-ratio:4/5; }
.work-top__fig--sales{ grid-column:10/13; grid-row:2; align-self:start; }
.work-top__fig--sales .ph{ aspect-ratio:1/1; }
.work-top__dim--x{ display:flex; align-items:center; gap:12px; margin-top:12px; font: 500 11px/1 var(--serif); letter-spacing:.16em; color: var(--rust); }
.work-top__dim i{ flex:1; height:1px; background: var(--ink); opacity:.35; position:relative; }
.work-top__dim i::before, .work-top__dim i::after{ content:''; position:absolute; top:-4px; width:1px; height:9px; background: var(--ink); }
.work-top__dim i::before{ left:0; } .work-top__dim i::after{ right:0; }
.work-top__lbl{ margin-top:10px; font: 500 11px/1 var(--serif); letter-spacing:.16em; color: var(--rust); }
.work-top__cols{ margin-top:56px; display:grid; grid-template-columns: repeat(3,1fr); }
.work-top__col{ padding: 0 28px; border-left:1px solid var(--line); }
.work-top__col:first-child{ padding-left:0; border-left:none; }
.work-top__col:last-child{ padding-right:0; }
.work-top__col h3{ font-size:22px; margin-top:12px; }
.work-top__copy{ margin:12px 0 0; font-family: var(--serif); font-size:16.5px; line-height:1.7; }
.work-top__desc{ margin:12px 0 0; font-size:14px; line-height:1.95; color: var(--ink-soft); }
@media (max-width:900px){
  .work-top__head{ grid-template-columns:1fr; gap:20px; }
  .work-top__spread{ gap:14px; }
  .work-top__fig--main{ grid-column:1/13; grid-row:1; }
  .work-top__fig--main .ph{ flex:none; min-height:0; aspect-ratio:4/3; }
  .work-top__fig--design{ grid-column:1/7; grid-row:2; }
  .work-top__fig--sales{ grid-column:7/13; grid-row:2; align-self:start; }
  .work-top__cols{ grid-template-columns:1fr; }
  .work-top__col{ padding: 28px 0 0; border-left:none; border-top:1px solid var(--line); margin-top:28px; }
  .work-top__col:first-child{ border-top:none; margin-top:0; padding-top:0; }
}

/* ============================================================
   04 PEOPLE
   ============================================================ */
.people-top{ background: var(--bg); }
.people-top__grid{ display:grid; grid-template-columns: 40% 1fr; }
.people-top__panel{ position:relative; background: var(--bg-deep); color:#fff; }
.people-top__panel-in{
  position:sticky; top:0; height:100vh; height:100svh; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding: 110px clamp(24px,3vw,48px) 48px max(var(--edge), calc((100vw - var(--max)) / 2 + var(--edge)));
}
.people-top__bigen{
  position:absolute; right:-.08em; top:60px; writing-mode:vertical-rl; pointer-events:none;
  font: 600 clamp(80px,10vw,150px)/1 var(--serif); letter-spacing:.06em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.2);
}
.people-top__panel .section-kicker{ color:var(--accent-light,#e7a483); }
.people-top__panel .section-title{ color:#fff; font-size: clamp(26px,2.7vw,38px); }
.people-top__intro{ margin-top:20px; font-size:14.5px; line-height:2; color:#cfd4e0; max-width:26em; }
.people-top__index{ margin-top:36px; display:flex; flex-direction:column; gap:14px; font: 500 13px/1 var(--serif); letter-spacing:.12em; color:#8790a3; }
.people-top__index li{ display:flex; align-items:center; gap:12px; transition: color .3s ease; }
.people-top__index li i{ width:18px; height:1px; background: currentColor; transition: width .3s ease, background .3s ease; }
.people-top__index li span{ font-family: var(--sans); font-size:12px; letter-spacing:.04em; margin-left:4px; opacity:0; transition: opacity .3s ease; }
.people-top__index li.is-active{ color:#fff; }
.people-top__index li.is-active i{ width:44px; background: var(--rust); }
.people-top__index li.is-active span{ opacity:1; }
.people-top__more{ margin-top:32px; color:#fff; align-self:flex-start; }
.people-top__list{ padding: 72px 0 40px; }
.person{ --person-h: 78vh; position:relative; min-height: var(--person-h); display:grid; grid-template-columns: repeat(12,1fr); gap: 0 24px; align-items:center; padding: 0 var(--edge); }
.person__num{ position:absolute; z-index:0; pointer-events:none; font: 600 clamp(120px,16vw,240px)/1 var(--serif); color:transparent; -webkit-text-stroke:1px var(--line); }
.person__photo{ position:relative; z-index:1; }
.person__photo .ph{ aspect-ratio:3/4; }
.person__body{ position:relative; z-index:1; }
.person__meta{ font-size:12.5px; color: var(--rust); letter-spacing:.06em; }
.person__name{ margin-top:10px; font-size: clamp(22px,2.4vw,30px); }
.person__copy{ margin:16px 0 0; font-family: var(--serif); font-size: clamp(19px,1.9vw,25px); line-height:1.7; }
.person--1 .person__photo{ grid-column:1/7; }
.person--1 .person__body{ grid-column:8/13; }
.person--1 .person__num{ left:33%; bottom:8vh; }
.person--2 .person__body{ grid-column:1/6; grid-row:1; }
.person--2 .person__photo{ grid-column:6/13; grid-row:1; margin-right: calc(-1 * var(--edge)); }
.person--2 .person__num{ left:31%; top:-7vh; }
.person--3 .person__photo{ grid-column:2/7; }
.person--3 .person__body{ grid-column:8/13; }
.person--3 .person__num{ left:-.06em; top:-5vh; }
@media (max-width:900px){
  .people-top__grid{ grid-template-columns:1fr; }
  .people-top__panel-in{ position:relative; height:auto; padding: 72px var(--edge) 48px; }
  .people-top__bigen{ font-size:96px; top:24px; }
  .people-top__index{ display:none; }
  .people-top__list{ padding: 40px 0 24px; }
  .person{ --person-h:auto; grid-template-columns:1fr; gap:20px; padding: 32px var(--edge); }
  .person--1 .person__photo, .person--2 .person__photo, .person--3 .person__photo{ grid-column:1; grid-row:auto; margin:0; }
  .person--1 .person__body, .person--2 .person__body, .person--3 .person__body{ grid-column:1; grid-row:auto; }
  .person__num{ font-size:88px; left:auto !important; right: var(--edge) !important; top:8px !important; bottom:auto !important; }
}

/* ============================================================
   05 CROSS TALK
   ============================================================ */
.ct{
  background-color: var(--bg);
  background-image:
    linear-gradient(rgba(28,27,23,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(28,27,23,.045) 1px, transparent 1px);
  background-size: 48px 48px;
}
.ct__head{ display:grid; grid-template-columns: 1fr 1fr; gap:40px; align-items:end; }
.ct__theme{ margin:0; display:flex; align-items:flex-start; gap:16px; font-family: var(--serif); }
.ct__theme b{ font: 600 clamp(44px,6vw,88px)/1 var(--serif); color: var(--rust); letter-spacing:-.02em; }
.ct__theme span{ font-size: clamp(20px,2.2vw,28px); line-height:1.6; padding-top:.3em; }
.ct__members{
  position:sticky; top:76px; z-index:2; margin-top:56px; padding:14px 0;
  display:flex; gap: clamp(16px,3vw,40px); align-items:center;
  background: rgba(250,248,244,.92); backdrop-filter: blur(6px);
}
.ct__members-line{ position:absolute; left:0; right:0; top:50%; height:1px; background: var(--line); z-index:-1; }
.ct__member{ display:flex; align-items:center; gap:10px; padding-right:8px; background: var(--bg); opacity:.18; filter:grayscale(1); transition: opacity .5s ease, filter .5s ease; }
.ct__member .ph{ width:44px; border-radius:50%; overflow:hidden; border:1px solid var(--line); flex:none; }
.ct__member .ph span{ display:none; }
.ct__avatar .ph span{ margin:4px; padding:2px 4px; font-size:9px; letter-spacing:0; }
.ct__member b{ display:block; font-size:13px; font-weight:500; line-height:1.3; }
.ct__member small{ display:block; font-size:11px; color: var(--ink-soft); }
.ct__member.is-in, .no-js .ct__member{ opacity:1; filter:none; }
.ct__lines{ margin-top:48px; display:flex; flex-direction:column; gap: clamp(28px,4vw,48px); }
.ct__line{ display:flex; gap:20px; align-items:flex-start; max-width:40em; }
.ct__line--r{ margin-left:auto; flex-direction:row-reverse; text-align:right; }
.ct__avatar .ph{ width:72px; aspect-ratio:1/1; flex:none; }
.ct__who{ display:block; font-size:13px; font-weight:500; }
.ct__who small{ margin-left:8px; color: var(--ink-soft); font-size:11.5px; font-weight:400; }
.ct__speech p{ margin:10px 0 0; font-family: var(--serif); font-size: clamp(17px,1.7vw,22px); line-height:1.8; background: var(--bg); display:inline; box-shadow: 0 0 0 6px var(--bg); }
.ct__group{ margin-top:64px; }
.ct__land{ margin-top:48px; display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.ct__land p{ margin:0; font-family: var(--serif); font-size: clamp(20px,2.4vw,30px); line-height:1.6; background: var(--bg); display:inline; box-shadow: 0 0 0 6px var(--bg); }
.ct__land p:last-child{ color: var(--rust); }
@media (max-width:900px){
  .ct__head{ grid-template-columns:1fr; gap:24px; }
  .ct__members{ gap:10px; top:76px; overflow-x:auto; }
  .ct__member small{ display:none; }
  .ct__member b{ font-size:12px; }
  .ct__line, .ct__line--r{ margin-left:0; flex-direction:row; text-align:left; }
  .ct__avatar .ph{ width:52px; }
  .ct__land{ grid-template-columns:1fr; gap:20px; }
}

/* ============================================================
   06 ENVIRONMENT
   ============================================================ */
.env-top{ background: var(--bg); padding-top:0; }
.env-top__hero{ position:relative; }
.env-top__hero > .ph{ aspect-ratio: 21/9; border:none; }
.env-top__hero > .ph > span{ position:absolute; top:14px; right:14px; margin:0; }
.env-top__band{
  position:absolute; left:0; bottom:0; background: var(--bg); max-width: min(90%, 640px);
  padding: 28px clamp(24px,4vw,56px) 0 max(var(--edge), calc((100% - var(--max)) / 2 + var(--edge)));
}
.env-top__lead{ margin-top:36px; }
.env-top__smalls{ margin-top:56px; display:grid; grid-template-columns: repeat(4,1fr); gap:16px; margin-right: calc(-1 * var(--edge)); }
.env-top__smalls .ph:nth-child(even){ margin-top:32px; }
.env-top__figures{ margin-top:72px; display:grid; grid-template-columns: repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.env-top__figures li{ padding:28px 24px; border-left:1px solid var(--line); }
.env-top__figures li:first-child{ border-left:none; padding-left:0; }
.env-top__figures b{ display:block; font: 600 clamp(40px,4.6vw,64px)/1 var(--serif); }
.env-top__figures b em{ font-style:normal; font-size:.34em; margin-left:6px; color: var(--rust); letter-spacing:.1em; font-family: var(--serif); }
.env-top__figures span{ display:block; margin-top:8px; font-size:13.5px; color: var(--ink-soft); }
.env-top__bottom{ margin-top:64px; display:grid; grid-template-columns: 1fr 1.8fr; gap: clamp(24px,4vw,56px); align-items:end; }
.env-top__benefits{ columns:2; column-gap:24px; font-size:13.5px; }
.env-top__benefits li{ padding:8px 0; border-bottom:1px solid var(--line); break-inside:avoid; }
.env-top__big2{ border:none; }
.env-top__links{ margin-top:32px; display:flex; gap:32px; flex-wrap:wrap; }
@media (max-width:900px){
  .env-top__hero > .ph{ aspect-ratio: 4/3; }
  .env-top__band{ position:static; max-width:none; padding: 24px var(--edge) 0; }
  .env-top__smalls{ grid-template-columns: 1fr 1fr; margin-right:0; }
  .env-top__smalls .ph:nth-child(even){ margin-top:0; }
  .env-top__figures{ grid-template-columns:1fr; }
  .env-top__figures li{ border-left:none; border-top:1px solid var(--line); padding:20px 0; }
  .env-top__figures li:first-child{ border-top:none; }
  .env-top__bottom{ grid-template-columns:1fr; }
  .env-top__benefits{ columns:1; }
}

/* ============================================================
   07 RECRUIT
   ============================================================ */
.recruit-top{ background: var(--bg-alt); }
.recruit-top__head{ display:grid; grid-template-columns: 1fr 1fr; gap:48px; align-items:end; }
.recruit-top__head > div{ text-align:right; }
.recruit-top__head > div .section-kicker{ justify-content:flex-end; }
.recruit-top__body{ margin:0; font-size:15.5px; line-height:2.1; color: var(--ink-soft); max-width:30em; }
.recruit-top__index{ margin-top:64px; display:grid; grid-template-columns: repeat(4,1fr); border-top:1px solid var(--ink); }
.recruit-top__index li + li{ border-left:1px solid var(--line); }
.recruit-top__index a{ display:block; padding: 32px 24px 36px; }
.recruit-top__index b{ display:block; font: 600 clamp(56px,6vw,96px)/1 var(--serif); color:transparent; -webkit-text-stroke:1px var(--ink); transition: color .25s ease, -webkit-text-stroke-color .25s ease; }
.recruit-top__index a:hover b{ color: var(--rust); -webkit-text-stroke-color: var(--rust); }
.recruit-top__index span{ display:block; margin-top:18px; font-size:11.5px; letter-spacing:.16em; color: var(--rust); }
.recruit-top__index em{ display:block; font-style:normal; margin-top:6px; font-family: var(--serif); font-size:18px; }
.recruit-top__types{ margin-top:56px; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.recruit-top__types a{ display:flex; align-items:baseline; gap:18px; padding:28px 0; border-bottom:1px solid var(--ink); }
.recruit-top__types span{ font-size:11.5px; letter-spacing:.16em; color: var(--rust); }
.recruit-top__types b{ font: 600 clamp(26px,3vw,40px)/1.2 var(--serif); }
.recruit-top__types i{ margin-left:auto; font-style:normal; }
.recruit-top__types a:hover i{ transform: translateX(5px); }
@media (max-width:900px){
  .recruit-top__head{ grid-template-columns:1fr; gap:20px; }
  .recruit-top__head > div{ text-align:left; order:-1; }
  .recruit-top__head > div .section-kicker{ justify-content:flex-start; }
  .recruit-top__index{ grid-template-columns:1fr 1fr; }
  .recruit-top__index li:nth-child(3){ border-left:none; }
  .recruit-top__index li:nth-child(n+3){ border-top:1px solid var(--line); }
  .recruit-top__index a{ padding: 24px 16px 28px; }
  .recruit-top__types{ grid-template-columns:1fr; gap:0; }
}

/* ============================================================
   08 ENTRY（TOP）：骨格線がフレームとして閉じる
   ============================================================ */
.entry-cta--top .entry-cta__inner{ padding-top: clamp(48px,6vw,80px); padding-bottom: clamp(48px,6vw,80px); }
.entry-frame{ position:absolute; inset:0; pointer-events:none; }
/* 4辺を 上→右→下→左 の順に scale で描画。SVGの非等方スケーリングに依存しないため、
   どの画面比率でもフレームが最後まで閉じる */
.entry-frame__edge{ position:absolute; background: rgba(255,255,255,.32); transform-origin: 0 0; }
.entry-frame__edge--t{ left:0; top:0; right:0; height:1px; transform: scaleX(0); transform-origin: left center; }
.entry-frame__edge--r{ right:0; top:0; bottom:0; width:1px; transform: scaleY(0); transform-origin: center top; }
.entry-frame__edge--b{ left:0; bottom:0; right:0; height:1px; transform: scaleX(0); transform-origin: right center; }
.entry-frame__edge--l{ left:0; top:0; bottom:0; width:1px; transform: scaleY(0); transform-origin: center bottom; }
.entry-frame__edge{ transition: transform .42s cubic-bezier(.22,.61,.36,1); }
.entry-cta--top.is-framed .entry-frame__edge--t{ transform: scaleX(1); transition-delay: 0s; }
.entry-cta--top.is-framed .entry-frame__edge--r{ transform: scaleY(1); transition-delay: .4s; }
.entry-cta--top.is-framed .entry-frame__edge--b{ transform: scaleX(1); transition-delay: .8s; }
.entry-cta--top.is-framed .entry-frame__edge--l{ transform: scaleY(1); transition-delay: 1.2s; }
.no-js .entry-frame__edge{ transform: none; }
.entry-frame__joint{ position:absolute; width:7px; height:7px; border-radius:50%; background: var(--rust); opacity:0; transition: opacity .4s ease 1.6s; }
.entry-frame__joint--tl{ left:-3px; top:-3px; } .entry-frame__joint--tr{ right:-3px; top:-3px; }
.entry-frame__joint--bl{ left:-3px; bottom:-3px; } .entry-frame__joint--br{ right:-3px; bottom:-3px; }
.entry-cta--top.is-framed .entry-frame__joint, .no-js .entry-frame__joint{ opacity:1; }

/* ---- reduced motion：演出はすべて静的な完成状態 ---- */
@media (prefers-reduced-motion: reduce){
  .about-stage{ height:auto; }
  .about-stage__sticky{ position:static; height:auto; padding:56px 0 24px; }
  .fv--sticky{ position:relative; }
  .entry-frame__edge{ transform:none !important; transition:none; }
  .entry-frame__joint{ opacity:1; transition:none; }
}

/* ---- フッター英字社名 ---- */
.gf__brand-en{ display:block; margin-top:6px; font-family: var(--sans); font-weight:400; font-size:11px; letter-spacing:.12em; color:#8790a3; }

/* ---- ENTRYフレーム：SPでは画面端から少し内側に ---- */
@media (max-width:900px){ .entry-cta--top .entry-cta__inner{ margin-left:12px; margin-right:12px; } }