/* ============================================================
   yurislave — Layout機能 用 追加スタイル(v2)
   ※ style.css の「後」に読み込むこと。既存ルールは一切変更しない
============================================================ */

/* --- 行(1〜3列グリッド) --- */
.layout-row {
  display: grid;
  gap: 8px;
  align-items: start;
}
.layout-row--1 { grid-template-columns: 1fr; }
.layout-row--2 { grid-template-columns: 1fr 1fr; }
.layout-row--3 { grid-template-columns: repeat(3, 1fr); }

.layout-cell { min-width: 0; }
.layout-cell .section { padding-block: 72px; }
.layout-cell--empty { min-height: 1px; }

/* --- 狭いセル内での内部調整 --- */
.lay-narrow .hero {
  min-height: 52svh;
  padding-top: calc(var(--header-h) + 32px);
}
.lay-narrow .works-grid {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 20px 16px;
}
.lay-narrow .links-grid { grid-template-columns: 1fr; }
.lay-narrow .profile    { grid-template-columns: 1fr; gap: 24px; }
.lay-narrow .profile__figure { max-width: 240px; }

/* --- タブレット以下は縦積み --- */
@media (max-width: 980px) {
  .layout-row--2,
  .layout-row--3 { grid-template-columns: 1fr; }
  .layout-cell .section { padding-block: 64px; }
  .lay-narrow .hero { min-height: 70svh; }
}

/* ------------------------------------------------------------
   最終安全装置:
   index.php のインライン待機スクリプトが html に no-reveal を
   付与した場合(script.js が動作しなかった場合)、
   ふわっと表示を無効化して全内容を必ず表示する。
------------------------------------------------------------ */
html.no-reveal [data-reveal] {
  opacity: 1 !important;
  transform: none !important;
}