/* themes/tajimalab-theme/assets/css/styles.css */
body {
    font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}

.container {
    max-width: 1080px;
    margin: 0 auto;
    padding: 0 16px;
}

.site-header, .site-footer {
    padding: 12px 0;
}

.site-title {
    text-decoration: none;
    font-weight: 700;
}

.reports-index .list-group-item {
    padding-top: .9rem;
    padding-bottom: .9rem;
}

.reports-index .badge {
    font-weight: 600;
    letter-spacing: .02em;
}

.navbar {
    background-color: #fff;
    border-bottom: 1px solid rgba(0,0,0,.1); /* 必要なら区切り線 */
}

.navbar .nav-link {
    color: #212529; /* デフォルト文字色 */
}

.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar .nav-link.active {
    color: #0d6efd; /* Bootstrapのprimaryカラー */
}

/* navbar-brand を少し薄くする */
.navbar .navbar-brand {
    color: rgba(var(--bs-body-color-rgb), .95) !important;
    transition: color .15s ease-in-out;
}
.navbar .navbar-brand:hover,
.navbar .navbar-brand:focus {
    color: var(--bs-body-color) !important;
}

/* 本文内の画像をレスポンシブに */
.entry-content img {
    max-width: 100%;
    height: auto;
}

/* Gutenberg の埋め込みやテーブルの整形 */
.entry-content .wp-block-embed,
.entry-content .wp-block-table {
    margin-bottom: 1rem;
}

.object-fit-cover {
    object-fit: cover;
}

/* === Hero Section === */
.hero-viewport {
    min-height: 60vh; /* 高さ調整 */
    display: flex;
    align-items: center; /* 縦センター */
    padding: 6rem 0; /* 余白 */
}

.hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    transform: scale(1.02); /* わずかに拡大してエッジの白地を防ぐ */
    will-change: transform;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    /* 上:濃 / 下:薄 のグラデーションで文字を読みやすく */
    background: linear-gradient(180deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .35) 40%, rgba(0, 0, 0, .2) 100%);
}

.hero-viewport .container {
    z-index: 2;
}

/* =========================================
   Alumni ページ用：UL/LIをBootstrap5っぽく整形
   - デフォルト：レスポンシブなグリッド表示（列数が自動可変）
   - オプション：is-style-badge を付けると「バッジ風」
   - オプション：is-style-columns を付けると「段組（CSS columns）」
   ========================================= */

/* 共通余白（見出しとリストの間） */
.alumni-page .entry-content h2,
.alumni-page .entry-content h3 { margin-top: 2rem; margin-bottom: 1rem; }

/* --- デフォルト：グリッド表示（列数が幅に応じて1→2→3） --- */
.alumni-page .entry-content ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: .5rem 1rem; /* 行間 / 列間 */
}
@media (min-width: 576px) {
    .alumni-page .entry-content ul {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (min-width: 992px) {
    .alumni-page .entry-content ul {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
.alumni-page .entry-content ul > li {
    /* 文字が長い社名もきれいに折り返す */
    overflow-wrap: anywhere;
    line-height: 1.6;
    position: relative;
    padding-left: 1rem;
}
/* 擬似的なドット（Bootstrapの落ち着いたトーンに合わせて薄めに） */
.alumni-page .entry-content ul > li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
    transform: translateY(.1em);
    opacity: .65;
}

/* ================================
   教員紹介ページ（/profile）用の最小スタイル
   - 追加クラス不要 / ブロックエディタそのまま
   - ULは自動段組（SP1段 → sm2段 → lg3段）
   ================================ */

.profile-page .entry-content h2 {
    margin-top: 2rem;
    margin-bottom: .75rem;
    border-bottom: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
    padding-bottom: .25rem;
}
.profile-page .entry-content h3 {
    margin-top: 1.25rem;
    margin-bottom: .5rem;
}

.profile-page .entry-content ul {
    list-style: disc;
    padding-left: 1.25rem;          /* ベースのインデント */
    margin: 0;
    column-gap: 1.25rem;
    column-fill: balance;
    column-count: 1;                 /* SP：1段 */
}
.profile-page .entry-content ul > li {
    line-height: 1.7;
    break-inside: avoid;            /* 段の途中で分断しない */
    overflow-wrap: anywhere;        /* 長い社名も折り返す */
}
.profile-page .entry-content ul > li::marker {
    color: rgba(0,0,0,.65);         /* Bootstrapの落ち着いたトーン */
    font-size: .9em;
}

/* ここから段組不要なら削除 */
/* 段数のブレークポイント（Bootstrap目安に合わせて） */
/*@media (min-width: 576px) {       !* sm *!*/
/*    .profile-page .entry-content ul { column-count: 2; }*/
/*}*/
/*@media (min-width: 992px) {       !* lg *!*/
/*    .profile-page .entry-content ul { column-count: 3; }*/
/*}*/

/*!* 段組ではなく1列で読み進めたい箇所に使う“押さえ”（任意）*/
/*   → ブロックエディターの「追加CSSクラス」に no-columns と入れるだけで段組を抑制 *!*/
/*.profile-page .entry-content ul.no-columns {*/
/*    column-count: 1 !important;*/
/*}*/
/* ここまで段組不要なら削除 */


/* ここからdl/dt/dd */
/* 教員紹介（/profile）— 定義リストの見た目 */
.profile-page .entry-content dl {
    margin: 1rem 0 1.25rem;
}

/* スマホは縦積み */
.profile-page .entry-content dt {
    font-weight: 550;
    margin-top: .75rem;
}
.profile-page .entry-content dd {
    margin: .25rem 0 .5rem 0;
}

/* sm以上で「期間／内容」の2列グリッドにする */
@media (min-width: 576px) {
    .profile-page .entry-content dl {
        display: grid;
        grid-template-columns: minmax(10ch, 16ch) 1fr; /* 左=期間, 右=内容 */
        column-gap: 1rem;
        row-gap: .5rem;
    }
    .profile-page .entry-content dt {
        grid-column: 1;
        margin: 0;                  /* 行間を整える */
        align-self: start;
    }
    .profile-page .entry-content dd {
        grid-column: 2;
        margin: 0 0 .5rem 0;
    }
}

/* テキストの可読性を少し上げる（任意） */
.profile-page .entry-content dd,
.profile-page .entry-content dt {
    line-height: 1.6;
    overflow-wrap: anywhere;
}

/* セクション見出しのトーン（任意） */
.profile-page .entry-content h2 {
    margin-top: 2rem;
    margin-bottom: .75rem;
    border-bottom: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
    padding-bottom: .25rem;
}
.profile-page .entry-content h3 {
    margin-top: 1.25rem;
    margin-bottom: .5rem;
}

/* === 改行抑制（sm以上）& 列幅の最適化 === */
@media (min-width: 576px) {
    .profile-page .entry-content dl {
        grid-template-columns: fit-content(26ch) 1fr;
    }
    .profile-page .entry-content dt {
        white-space: nowrap;          /* なるべく改行しない */
        overflow: visible;             /* はみ出しは隠す */
    }
}


/* ===========================
   Post typography (entry-content)
   =========================== */
.entry-content{
    /* ベース行間を少し広めに（BSの雰囲気に寄せる） */
    line-height: 1.75; /* bsの1.5より少し広め */
    color: var(--bs-body-color, #212529);
}

/* ブロックごとの間隔を“mb-3”相当へ寄せる */
.entry-content p,
.entry-content ul,
.entry-content ol,
.entry-content dl,
.entry-content blockquote,
.entry-content table,
.entry-content pre {
    margin-top: 0;
    margin-bottom: 1rem; /* ≒ .mb-3 */
}

/* 見出しは上下の余白を統一、h2は節の境目感を薄いボーダーで */
.entry-content h2.wp-block-heading,
.entry-content h3.wp-block-heading {
    margin-top: 2rem;
    margin-bottom: .75rem;
    line-height: 1.3;
}
.entry-content h2.wp-block-heading{
    padding-bottom: .25rem;
    border-bottom: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
}

/* リストの“詰まり”を解消：左インデント＆各項目に軽い下余白 */
.entry-content ul,
.entry-content ol{
    padding-left: 1.2rem; /* デフォより気持ち広め */
}
.entry-content li{
    margin-bottom: .25rem;
}
.entry-content li > ul,
.entry-content li > ol{
    margin-top: .25rem;   /* ネスト開始の直前に少し余白 */
}

/* リンクの配色はBSに寄せて、ホバーで下線表示（読みやすさ重視） */
.entry-content a{
    color: var(--bs-link-color, #0d6efd);
    text-decoration: none;
}
.entry-content a:hover{
    color: var(--bs-link-hover-color, #0a58ca);
    text-decoration: underline;
}

/* テーブル・画像の基本整形（必要なら） */
.entry-content table{
    width: 100%;
    border-collapse: collapse;
}
.entry-content table th,
.entry-content table td{
    padding: .5rem;
    border: 1px solid var(--bs-border-color, rgba(0,0,0,.1));
}
.entry-content img{
    max-width: 100%;
    height: auto;
}

/* <br> が多い原稿の“行間詰まり”対策（任意）
   連続する <br> の間に少し余白を入れる */
.entry-content br + br{
    line-height: 2;
    display: block;
    content: "";
}