/* 採用③の反応体と、京都の実写真を使った下段を同じ書体でつなぐ。 */
.home-page{
  --home-display:var(--font-body);
  --home-rule:1px solid var(--ghost-border);
  --home-soft-rule:1px solid color-mix(in srgb,var(--paper) 28%,transparent);
  --home-title:clamp(2rem,3.4vw,3rem);
  --home-chapter:clamp(80px,7.5vw,112px);
}
.home-page h1,.home-page h2{font-family:var(--home-display);font-weight:700;letter-spacing:-.025em;line-height:1.4}
.home-page h3{font-family:var(--font-body);font-weight:700;letter-spacing:0;line-height:1.55}
.home-kicker{display:flex;align-items:center;gap:14px;font-size:var(--text-small);font-weight:700;letter-spacing:.04em;color:var(--brand-navy)}
.home-kicker::before{content:'';display:block;width:28px;height:2px;background:var(--brand-green);flex:none}
.home-chapter{display:flex;align-items:baseline;gap:16px;font-size:var(--text-small);color:var(--brand-navy);margin-bottom:28px}
.home-chapter span{font-size:var(--text-small);font-variant-numeric:tabular-nums;color:var(--action)}
.home-arrow{display:inline-grid;place-items:center;width:44px;height:44px;flex:none;border:var(--home-rule);border-radius:50%;font-size:1.125rem;transition:background var(--motion-duration),color var(--motion-duration),transform var(--motion-duration)}
.home-link{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;min-height:48px;text-decoration:none;font-size:1rem;font-weight:700;color:var(--brand-navy)}
.home-link:hover .home-arrow{background:var(--brand-navy);color:var(--paper);transform:translateX(3px)}
.home-page .button{border-radius:2px;gap:40px;padding:16px 28px;font-size:1rem;min-height:58px}

/* 採用③の反応体は言葉と同じ背景に置き、個の力が組織になる接点を見せる。 */
[data-page='home'] .site-header{min-height:100px;border-bottom:0;width:calc(100% - clamp(24px,6vw,100px)*2);max-width:1600px}
[data-page='home'] .brand{width:176px}
[data-page='home'] .desktop-nav .nav-contact{background:transparent;color:var(--brand-navy);padding:12px 0;border-bottom:2px solid var(--brand-green);border-radius:0}
[data-page='home'] .desktop-nav .nav-contact::after{content:'↗';margin-left:12px}
[data-page='home'] .desktop-nav .nav-contact:hover{color:var(--action)}
.home-hero{
  --hero-gutter:clamp(24px,6vw,100px);
  --hero-title:clamp(78px,6.5vw,104px);
  --hero-body:clamp(20px,1.44vw,23px);
  background:var(--surface);
  position:relative;
  isolation:isolate;
  overflow:clip;
}
.home-hero-art{
  position:absolute;inset:0 0 0 46%;pointer-events:none;
  background:url('/images/hero-organization-20261007.webp') no-repeat right center / auto 100%;
  mask-image:linear-gradient(to right,transparent,var(--ink) 12%),linear-gradient(to bottom,transparent,var(--ink) 8%,var(--ink) 88%,transparent);
  mask-composite:intersect;
}
.home-hero-grid{position:relative;width:calc(100% - var(--hero-gutter)*2);max-width:1600px;min-height:calc(100svh - 100px);padding-block:48px 52px}
.home-hero-copy{position:relative;width:calc(46vw - var(--hero-gutter));max-width:660px;min-width:0}
.home-hero .home-kicker{font-size:18px;margin-bottom:24px}
.home-hero h1{font-size:var(--hero-title);line-height:1.22;letter-spacing:-.035em;margin:0 0 24px;text-wrap:initial}
.home-hero h1 span{display:block}
.home-hero-description{font-size:var(--hero-body);line-height:1.8;max-width:31em}
.home-hero-description p{line-height:inherit}
.home-hero-description p+p{margin-top:14px}
.home-hero .actions{margin-top:28px;gap:22px 30px}
.home-hero .button{font-size:18px;min-height:62px;padding:16px 24px;gap:38px}
.home-hero .button::after{content:'↗'}
.home-hero .text-link{gap:22px;font-size:16px;border-bottom:0;text-decoration:none}
.home-hero-link-label{text-decoration:underline;text-decoration-thickness:1px}
.home-hero-note{font-size:15px;line-height:1.9;margin-top:16px;color:var(--brand-navy)}
.home-hero-person{display:flex;align-items:center;gap:18px;max-width:510px;margin-top:30px;padding-top:24px;border-top:var(--home-rule);color:var(--brand-navy)}
.home-hero-person picture{flex:none;width:68px}
.home-hero-person img{width:68px;height:80px;object-fit:cover;object-position:center 18%}
.home-hero-person figcaption{display:grid;gap:3px;font-size:var(--text-small);line-height:1.7}
.home-hero-person strong{font-size:21px;letter-spacing:.045em}

@media(min-width:1200px) and (max-height:900px){
  .home-hero{--hero-title:clamp(78px,6.5vw,96px);--hero-body:20px}
  .home-hero-grid{padding-block:36px 40px}
  .home-hero .home-kicker{margin-bottom:20px}
  .home-hero h1{margin-bottom:20px}
  .home-hero-description p+p{margin-top:12px}
  .home-hero .actions{margin-top:24px}
  .home-hero-note{margin-top:12px}
  .home-hero-person{margin-top:22px;padding-top:18px}
  .home-hero-person picture{width:60px}
  .home-hero-person img{width:60px;height:72px}
}

/* 罫線と余白をそろえ、本文も見出しと同じ強さで読める索引にする。 */
#home-services{scroll-margin-top:32px}
.home-services{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:80px;padding-block:var(--home-chapter)}
.home-section-intro h2{font-size:var(--home-title)}
.home-section-intro>p:last-child{font-size:1rem;line-height:1.9;margin-top:28px;max-width:32em}
.home-service-list{border-top:var(--home-rule)}
.home-service-row{display:grid;grid-template-columns:28px minmax(0,1fr) 44px;gap:18px;padding:32px 0;border-bottom:var(--home-rule);text-decoration:none;color:var(--ink);align-items:center;position:relative}
.home-service-row:hover{color:var(--ink)}
.home-service-row>.home-service-number{align-self:start;padding-top:3px;color:var(--action);font-size:var(--text-small);font-variant-numeric:tabular-nums}
.home-service-row h3{font-size:clamp(1.125rem,1.6vw,1.375rem);color:var(--brand-navy)}
.home-service-row p{font-size:1rem;margin-top:12px;line-height:1.85}
.home-service-row small{display:block;color:var(--action);font-size:var(--text-small);margin-top:14px}
.home-service-row:hover .home-arrow{background:var(--brand-navy);color:var(--paper);transform:translateX(3px)}

/* 三つの線の選択と、その説明をつないでブランドの意味を体験できるようにする。 */
.home-philosophy{background:var(--brand-navy);color:var(--paper);padding-block:var(--home-chapter);--focus:var(--paper)}
.home-philosophy .home-chapter,.home-philosophy .home-chapter span{color:var(--paper)}
.home-philosophy-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:80px;align-items:center}
.home-philosophy h2{font-size:clamp(2.5rem,4vw,3.5rem);color:var(--paper);line-height:1.4}
.home-philosophy-copy>p{max-width:34em;font-size:1rem;line-height:1.95;margin-top:28px}
.home-philosophy .home-link{margin-top:28px;color:var(--paper)}
.home-philosophy .home-arrow{border:var(--home-soft-rule)}
.home-philosophy .home-link:hover .home-arrow{background:var(--paper);color:var(--brand-navy)}
.home-knot{width:100%;max-width:440px;margin-inline:auto}
.home-knot-diagram{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 8.33333%}
.home-knot svg{display:block;grid-column:1/-1;width:100%;height:auto;overflow:visible}
.home-knot .knot-thread{fill:none;stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke;transition:opacity 240ms ease,stroke-width 240ms ease}
.home-knot .knot-crossing{fill:none;stroke:var(--brand-navy);stroke-width:10;stroke-linecap:round;vector-effect:non-scaling-stroke}
.home-knot .knot-finance{stroke:var(--brand-green)}
.home-knot .knot-dialogue{stroke:var(--brand-teal)}
.home-knot .knot-action{stroke:var(--paper)}
.home-knot-label{text-align:center;color:var(--paper)}
.home-knot-label strong{display:block;font-size:1rem;line-height:1.6}
.home-knot-label span{display:block;font-size:var(--text-small);line-height:1.65;margin-top:6px}
.home-knot-label.knot-label-action{grid-column:1/-1}
.methods-enhanced .home-knot .knot-thread{opacity:.75}
.methods-enhanced [data-method-view='finance'] .knot-finance,.methods-enhanced [data-method-view='dialogue'] .knot-dialogue,.methods-enhanced [data-method-view='action'] .knot-action{opacity:1;stroke-width:3.5}
.methods-enhanced [data-method-view='action'] .knot-thread{opacity:1}
.home-method-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:28px}
.home-method-tabs button{min-height:48px;background:transparent;color:var(--paper);border:var(--home-soft-rule);border-radius:24px;font-size:1rem;font-weight:700;transition:background var(--motion-duration),color var(--motion-duration)}
.home-method-tabs button[aria-selected='true']{background:var(--paper);color:var(--brand-navy);border-color:var(--paper)}
.home-method-tabs button:hover{border-color:var(--paper)}
.home-knot-caption{text-align:center;font-size:var(--text-small);line-height:1.9;margin-top:20px}
.home-methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-top:var(--home-soft-rule);margin-top:56px;padding-top:32px}
.home-methods article+article{border-left:var(--home-soft-rule);padding-left:32px}
.home-methods h3{font-size:1.125rem;color:var(--paper)}
.home-methods h3 span{display:block;font-size:var(--text-small);font-weight:400;letter-spacing:.04em;line-height:1.7;margin-bottom:12px}
.home-methods p{font-size:1rem;line-height:1.9;margin-top:18px}
.methods-enhanced .home-methods{display:block;min-height:140px}
.methods-enhanced .home-methods article{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:80px;border-left:0;padding:0}
.methods-enhanced .home-methods h3{font-size:1.5rem}
.methods-enhanced .home-methods p{max-width:38em;margin:0;align-self:center}

/* 写真のない支援事例は、判断に必要な文章そのものを主役にする。 */
.home-cases{padding-block:var(--home-chapter)}
.home-section-head{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:40px}
.home-section-head h2{font-size:var(--home-title)}
.home-section-head .home-chapter{margin-bottom:24px}
.home-case-list{border-top:var(--home-rule)}
.home-case{display:grid;grid-template-columns:72px minmax(0,1fr) 44px;gap:32px;align-items:center;padding:40px 0;border-bottom:var(--home-rule);text-decoration:none;color:var(--ink)}
.home-case:hover{color:var(--ink)}
.home-case-index{font-size:2.5rem;font-weight:400;line-height:1;font-variant-numeric:tabular-nums;color:var(--brand-navy)}
.home-case-type{font-size:var(--text-small);color:var(--action);margin-bottom:12px}
.home-case h3{font-family:var(--home-display);font-size:clamp(1.375rem,2vw,1.75rem);letter-spacing:-.015em;line-height:1.5}
.home-case p:last-child{font-size:1rem;max-width:42em;line-height:1.85;margin-top:14px}
.home-case:hover .home-arrow{background:var(--brand-navy);color:var(--paper);transform:translateX(3px)}
.home-case-note{font-size:var(--text-small);line-height:1.9;margin-top:28px;max-width:50em}

/* 同じ証明写真を繰り返さず、代表の言葉と京都の実在する場所を編集する。 */
.home-profile{background:var(--surface-low);padding-block:var(--home-chapter)}
.home-profile-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:80px;align-items:center}
.home-profile-place{max-width:560px}
.home-profile-place picture{display:block;position:relative}
.home-profile-place img{width:100%;aspect-ratio:679/451;object-fit:cover}
.home-profile-place figcaption{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;font-size:var(--text-small);line-height:1.9;color:var(--brand-navy);margin-top:18px}
.home-profile-place figcaption span{font-weight:700}
.home-profile h2{font-size:var(--home-title)}
.home-profile-copy>p{font-size:1rem;line-height:1.95;margin-top:28px;max-width:34em}
.home-profile-signature{display:flex;flex-wrap:wrap;align-items:center;gap:24px;border-top:var(--home-rule);padding-top:28px;margin-top:32px}
.home-profile-signature p{font-size:var(--text-small);line-height:1.9;color:var(--brand-navy)}
.home-profile-signature strong{font-size:2rem;font-weight:700;letter-spacing:.06em;color:var(--brand-navy);white-space:nowrap}
.home-profile-links{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:28px}
.home-institution{display:flex;align-items:center;justify-content:space-between;gap:48px;padding-block:72px}
.home-institution h2{font-size:clamp(1.75rem,2.3vw,2rem);margin-top:20px}
.home-institution p:last-child{font-size:1rem;line-height:1.9;margin-top:16px}
.home-institution .home-link{flex:none}

/* 相談の入口まで本文を縮小せず、静かな明快さを保つ。 */
.home-contact{background:var(--surface);padding-block:var(--home-chapter);border-top:var(--home-rule)}
.home-contact-opening{display:flex;justify-content:space-between;align-items:end;gap:56px}
.home-contact h2{font-size:clamp(2rem,3.4vw,3rem);line-height:1.4}
.home-contact-opening>div:last-child{flex:none;padding-bottom:8px}
.home-contact-opening>div:last-child p{font-size:var(--text-small);line-height:1.9;color:var(--brand-navy);margin-top:18px}
.home-contact-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;padding:0;margin:48px 0 0;list-style:none;border-top:var(--home-rule)}
.home-contact-steps li{padding-top:28px}
.home-contact-steps span{font-size:var(--text-small);font-variant-numeric:tabular-nums;color:var(--action)}
.home-contact-steps h3{font-size:1.125rem;margin-top:12px}
.home-contact-steps p{font-size:1rem;line-height:1.9;margin-top:16px}

@media(max-width:1279px){[data-page='home'] .site-header{min-height:88px}}
@media(max-width:1199px){
  .home-hero{--hero-title:clamp(58px,6.5vw,78px);--hero-body:18px}
  .home-hero-grid{min-height:calc(100svh - 88px);padding-block:40px}
  .home-hero-copy{width:calc(54vw - var(--hero-gutter))}
  .home-hero-art{left:48%;mask-image:linear-gradient(to right,transparent,var(--ink) 24%),linear-gradient(to bottom,transparent,var(--ink) 8%,var(--ink) 88%,transparent)}
  .home-hero .home-kicker{font-size:16px;margin-bottom:20px}
  .home-hero .button{font-size:16px;gap:28px;padding-inline:22px}
  .home-hero .text-link{font-size:15px}
  .home-services,.home-philosophy-grid,.home-profile-grid,.methods-enhanced .home-methods article{gap:56px}
  .home-contact-opening{gap:32px}
}
@media(max-width:899px){
  .home-services{grid-template-columns:1fr;gap:40px}
  .home-section-intro>p:last-child{max-width:36em}
  .home-philosophy-grid{grid-template-columns:1fr;gap:48px}
  .home-knot{max-width:400px}
  .home-philosophy h2{font-size:2.75rem}
  .home-profile-grid{grid-template-columns:1fr;gap:48px}
  .home-profile-place{max-width:560px}
  .home-profile-copy{grid-row:1}
  .home-institution{display:block}
  .home-institution .home-link{margin-top:28px}
  .home-contact-opening{display:block}
  .home-contact-opening>div:last-child{margin-top:32px}
  .methods-enhanced .home-methods article{grid-template-columns:1fr;gap:20px}
}
@media(max-width:599px){
  .home-page{--home-title:clamp(1.875rem,8vw,2.25rem);--home-chapter:72px}
  [data-page='home'] .site-header{min-height:80px}
  [data-page='home'] .brand{width:148px}
  .home-chapter{font-size:var(--text-small);gap:12px;margin-bottom:22px}
  .home-section-intro>p:last-child{margin-top:24px}
  .home-service-row{grid-template-columns:22px minmax(0,1fr) 36px;gap:12px;padding-block:28px}
  .home-service-row h3{font-size:1.1875rem}
  .home-service-row p{font-size:1rem}
  .home-service-row small{font-size:var(--text-small)}
  .home-service-row .home-arrow{width:36px;height:36px}
  .home-philosophy h2{font-size:clamp(2rem,8.5vw,2.5rem)}
  .home-philosophy-grid{gap:40px}
  .home-knot{max-width:360px}
  .home-method-tabs{gap:10px;margin-top:20px}
  .home-method-tabs button{font-size:.9375rem}
  .home-knot-caption{font-size:var(--text-small)}
  .home-methods{grid-template-columns:1fr;gap:28px;margin-top:40px;padding-top:28px}
  .home-methods article,.home-methods article+article{border-left:0;padding:0}
  .home-methods p{margin-top:14px}
  .methods-enhanced .home-methods{min-height:190px}
  .methods-enhanced .home-methods h3{font-size:1.375rem}
  .home-section-head{display:block;margin-bottom:28px}
  .home-section-head>.home-link{margin-top:24px}
  .home-case{grid-template-columns:minmax(0,1fr) 36px;gap:16px;padding-block:32px;align-items:start}
  .home-case-index{display:none}
  .home-case-type{font-size:var(--text-small)}
  .home-case h3{font-size:1.3125rem;line-height:1.5}
  .home-case p:last-child{font-size:1rem}
  .home-case .home-arrow{width:36px;height:36px;margin-top:28px}
  .home-case-note{font-size:var(--text-small)}
  .home-profile-grid{gap:40px}
  .home-profile-copy>p{margin-top:24px}
  .home-profile-place figcaption{font-size:var(--text-small)}
  .home-profile-signature{gap:16px}
  .home-profile-signature p{font-size:var(--text-small)}
  .home-profile-signature strong{font-size:1.75rem}
  .home-profile-links{gap:12px 24px}
  .home-profile-links .home-link{font-size:.9375rem;gap:20px}
  .home-institution{padding-block:56px}
  .home-institution .home-kicker{font-size:var(--text-small);line-height:1.8}
  .home-institution h2{font-size:1.75rem}
  .home-contact h2{font-size:clamp(1.875rem,8vw,2.25rem)}
  .home-contact-steps{grid-template-columns:1fr;gap:0;margin-top:40px}
  .home-contact-steps li{padding-block:24px;border-bottom:var(--home-rule)}
  .home-contact-steps h3{font-size:1.125rem;margin-top:8px}
  .home-contact-steps p{font-size:1rem;margin-top:12px}
}
/* 狭い画面でもコピーと造形を共通の背景に重ね、独立した画像段をつくらない。 */
@media(max-width:699px){
  [data-page='home'] .site-header{min-height:80px}
  .home-hero{--hero-gutter:24px;--hero-title:clamp(38px,10.8vw,46px);--hero-body:18px}
  .home-hero-grid{min-height:0;padding-block:32px;width:calc(100% - var(--hero-gutter)*2)}
  .home-hero-copy{width:100%;max-width:none}
  .home-hero .home-kicker{font-size:var(--text-small);gap:12px;margin-bottom:16px}
  .home-hero .home-kicker::before{width:24px}
  .home-hero h1{line-height:1.26;letter-spacing:-.025em;margin-bottom:0}
  .home-hero-art{inset:0 -40px auto 14%;height:clamp(340px,94vw,440px);background-position:right top;mask-image:linear-gradient(to right,transparent,var(--ink) 15%),linear-gradient(to bottom,transparent,var(--ink) 12%,var(--ink) 55%,transparent)}
  .home-hero-art::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--surface),color-mix(in srgb,var(--surface) 92%,transparent) 34%,color-mix(in srgb,var(--surface) 35%,transparent) 66%,transparent)}
  .home-hero-description{margin-top:clamp(84px,23vw,126px);font-size:18px;line-height:1.85}
  .home-hero-description p+p{margin-top:12px}
  .home-hero .actions{margin-top:24px;gap:12px 22px}
  .home-hero .button{min-height:58px;padding:15px 20px;gap:28px}
  .home-hero .text-link{min-height:44px}
  .home-hero-note{font-size:var(--text-small);margin-top:12px}
  .home-hero-person{margin-top:22px;padding-top:18px;gap:16px}
  .home-hero-person picture{width:56px}
  .home-hero-person img{width:56px;height:66px}
  .home-hero-person strong{font-size:20px}
}
@media(max-width:359px){
  [data-page='home'] .brand{width:134px}
  [data-page='home'] .site-header{gap:20px}
  [data-page='home'] .site-menu summary{white-space:nowrap}
}
@media(prefers-reduced-motion:reduce){
  .home-arrow,.home-knot .knot-thread,.home-method-tabs button{transition:none}
  .home-link:hover .home-arrow,.home-service-row:hover .home-arrow,.home-case:hover .home-arrow{transform:none}
}
