/* =========================================
   layout.css  |  レイアウト骨組み (l-*)
   ========================================= */

/* コンテナ挙動：1280–1920pxは fluid、1920px以上は固定 */
.l-container{
  width: var(--container-width);
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: clamp(var(--space-4), 2vw, var(--space-6));
}
.l-container--narrow{max-width: 1040px}
.l-container--wide  {max-width: 1440px}

@media (min-width: 1920px){
  .l-container{ width: 100%; }
}

/* ラッパー/メイン/セクション */
.l-wrapper{min-height:100%;display:flex;flex-direction:column}
.l-header{position:relative;z-index:50;background:transparent}
.l-main{flex:1 1 auto}
.l-footer{background:transparent}

.l-header__inner,.l-footer__inner{
  display:flex;align-items:center;gap:var(--space-6);
  padding-block: var(--space-5);
}
.l-header--sticky{position:sticky;top:0;background:rgba(255,255,255,.75);backdrop-filter:blur(8px)}
.l-header--transparent{background:transparent}

.l-section{padding-block: clamp(40px, 8vh, 120px); background: transparent}
.l-section--alt{background: var(--color-surface)}
.l-section--dense{padding-block: clamp(24px, 4vh, 56px)}
.l-section--wide .l-container{max-width: 1440px}

.l-section__head{margin-bottom: clamp(var(--space-6), 4vw, var(--space-8))}
.l-section__body{}

/* 共通グリッド / フレックス / スタック */
.l-grid{display:grid;gap: clamp(var(--space-5), 2vw, var(--space-7))}
.l-grid--2{grid-template-columns:repeat(2,1fr)}
.l-grid--3{grid-template-columns:repeat(3,1fr)}
.l-grid--4{grid-template-columns:repeat(4,1fr)}
@media (max-width: 1200px){ .l-grid--4{grid-template-columns:repeat(3,1fr)} }
@media (max-width:  960px){ .l-grid--3,.l-grid--4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:  640px){ .l-grid--2,.l-grid--3,.l-grid--4{grid-template-columns:1fr} }

.l-grid--auto{grid-template-columns: repeat(auto-fit, minmax(280px, 1fr))}
.l-flex{display:flex;gap: clamp(var(--space-4), 1.5vw, var(--space-6))}
.l-flex--between{justify-content:space-between;align-items:center}
.l-flex--center{justify-content:center;align-items:center}
.l-flex--wrap{flex-wrap:wrap}

.l-stack > * + *{margin-top: var(--space-5)}
.l-stack--sm > * + *{margin-top: var(--space-3)}
.l-stack--lg > * + *{margin-top: var(--space-7)}

/* サイドバー / スイッチ */
.l-sidebar{display:grid;gap:var(--space-6);grid-template-columns: minmax(240px, 320px) 1fr}
@media (max-width: 1024px){ .l-sidebar{grid-template-columns:1fr} }

.l-switch{display:grid;gap:var(--space-6);grid-template-columns:1fr 1fr}
@media (max-width: 960px){ .l-switch{grid-template-columns:1fr} }

/* グローバルナビの外枠（中身は c-nav へ） */
.l-header__logo{display:inline-flex;align-items:center;gap:12px;font-weight:700}
.l-header__nav{margin-left:auto}
.l-header__cta{margin-left:clamp(var(--space-4), 4vw, var(--space-7))}

/* ページタイトル帯（共通） */
.l-pagetitle{padding-block: clamp(48px, 10vh, 160px); background: var(--color-surface)}
.l-pagetitle__title{font-size: var(--fs-h1)}
.l-pagetitle__lead{margin-top: var(--space-4); color: var(--color-muted);max-width: 70ch}
